我與我的Laravel安裝程序有一些衝突的問題,特別是分頁和產品過濾器。Laravel jQuery - 分頁和產品過濾器,分頁URL
分頁和產品過濾器都通過jQuery處理,因此頁面不會完全刷新。
這是我的jQuery分頁代碼,使用標準的Laravel - >分頁功能。
$(function() {
$('body').on('click', '.pagination a', function(e) {
e.preventDefault();
var url = $(this).attr('href');
var page_number = $(this).attr('href').split('page=')[1];
getProducts(page_number);
window.history.pushState("", "", url);
});
function getProducts(page_number) {
$.ajax({
url : '?page=' + page_number
}).done(function (data) {
$('.devices-holder').html(data);
}).fail(function() {
alert('Data could not be loaded.');
});
}
});
這很好,問題是當我們過濾產品,然後嘗試去篩選結果的另一頁。
剛剛過濾後,分頁鏈接正確,例如/ devices/filter?filter = 1 & page2,但是在點擊此頁面時會加載所有沒有過濾器的設備,即使我複製該網址並加載該頁面,它成功進入第2頁,包含過濾器。
然後,分頁URL是完全忽略過濾器後,是/設備? & page = 2。我想這一定是我的渲染和附加在視圖中PAGINATE鏈接做的,但我不確定我在做什麼錯:
{!! $devices->appends(Input::all())->render() !!}
這是我的控制器:
public function devicesByFilter(Request $request) {
$type = 'devices';
$types = Input::get('types');
$devices = Device::where('type', '=', $type)->where('approved', '=', 1);
if(!empty($types)) {
$url = 'filter';
$check = 0;
foreach($types as $deviceType) {
if($check == 0) {
$devices = $devices->where('device_type', 'LIKE', $deviceType);
} else {
$devices = $devices->orWhere('device_type', 'LIKE', $deviceType);
}
$url = $url.'&types%5B%5D='.$deviceType;
$check++;
}
}
$devices = $devices->orderBy('match_order', 'asc')->paginate(10);
$devices->setPath('filter');
if ($request->ajax()) {
return view('devices.ajax.loadfilter', ['devices' => $devices, 'type' => $type, 'types' => $types])->render();
}
return View::make('devices.all', compact('devices', 'type'));
}
這是我的過濾器jQuery代碼:
$(document).ready(function() {
var types = [];
// Listen for 'change' event, so this triggers when the user clicks on the checkboxes labels
$('input[name="type[]"]').on('change', function (e) {
e.preventDefault();
types = []; // reset
if (document.location.href.indexOf('filter') > -1) {
var url = '../devices/filter?type=device';
} else {
var url = 'devices/filter?type=device';
}
$('input[name="type[]"]:checked').each(function()
{
types.push($(this).val());
url = url+'&types%5B%5D='+$(this).val();
});
if (document.location.href.indexOf('filter') > -1) {
$.get('../devices/filter', {type: 'devices', types: types}, function(markup)
{
$('.devices-holder').html(markup);
});
} else {
$.get('devices/filter', {type: 'devices', types: types}, function(markup)
{
$('.devices-holder').html(markup);
});
}
window.history.pushState("", "", url);
});
});
因此,在一個貧窮的企圖澄清:
分頁jQuery的完美的作品
過濾完美的作品
試圖過濾顯示所有設備不只是過濾後去另一頁即使URL是正確的,並且如果我在另一個選項卡上再次加載此URL,它也會得到正確的結果。
嘗試轉到另一個篩選結果頁面後,分頁鏈接缺少附加輸入。
從這裏開始調試很困難,任何能指向正確方向或嘗試/測試的人都會很棒。