首頁猿問如何同時實現(xiàn)table標(biāo)簽的分頁和搜索？

如何同時實現(xiàn)table標(biāo)簽的分頁和搜索？

JavaScript

www說 2018-11-17 16:51:56

我原本table的分頁功能使用的是thinkphp框架中的分頁：// 查詢狀態(tài)為1的用戶數(shù)據(jù) 并且每頁顯示10條數(shù)據(jù)$list = Db::name('user')->where('status',1)->paginate(10);// 把分頁數(shù)據(jù)賦值給模板變量list$this->assign('list', $list);// 渲染模板輸出return $this->fetch();<div><ul>{volist name='list' id='user'} <li> {$user.nickname}</li>{/volist}</ul></div>{$list->render()}搜索功能則是自己寫一個一小段JavaScript代碼，代碼就不貼出來了，只是對當(dāng)前頁面的table進(jìn)行遍歷查找，但這個代碼只能對當(dāng)前的頁面進(jìn)行搜索，無法對全部數(shù)據(jù)搜索。如何能在搜索框輸入數(shù)據(jù)后能馬上跳轉(zhuǎn)到該數(shù)據(jù)所在的頁面并單獨顯示出來？希望大家能提供點思路。

查看完整描述

1 回答

明月笑刀無情

TA貢獻(xiàn)1828條經(jīng)驗獲得超4個贊

根據(jù)你的問題，你現(xiàn)在的js代碼是對當(dāng)前頁面的數(shù)據(jù)進(jìn)行搜索然后將不符合數(shù)據(jù)過濾到，這樣肯定只能過濾當(dāng)前頁的，如果要實現(xiàn)你所說的在全表搜索，那你需要重定向到這個路由，并且?guī)蠀?shù)再查詢一次數(shù)據(jù)來返回給前端，這樣就可以得到所有你想得到的數(shù)據(jù)了。
簡單說下兩個方法吧。

控制器這么寫
$cat = isset($_GET['cat']) ? $_GET['cat'] : '';

$QB_logs = DB::where('qb_status', 'e')->where(function($query) use ($cat){    if($cat) {
        $query->where('qb_action', '=', $cat);
    }
}->select();
前端這么寫
{!!  $QB_logs->appends(['cat'=>$cat])->render() !!}

這個是laravel的寫法，具體到你的框架應(yīng)該也差不多。

第二個方法，如果你不想要頁面跳轉(zhuǎn)來重新加載數(shù)據(jù)的話，你可以考慮用datatable來渲染數(shù)據(jù)，這樣也能達(dá)到你所說的效果。

反對回復(fù) 2018-11-17