因此,我的页面包含一个项目列表和一个搜索栏,该搜索栏根据插入的文本动态搜索所有项目。我在输入上放置了一个 eventHandler,以便每次输入更改时进行 ajax 调用以进行过滤。
从另一个角度来看,我尝试实现相同的逻辑,但在复选框上使用标签。起初,我只是放置了警报以确保我的 JavaScript 正确接收所有标签,到目前为止没有任何问题。然后我尝试进行另一个 ajax 调用并记录结果,看看他的输出是否是我想要的。这次我收到了“GET link 500(内部服务器错误)”。
我使用 Laravel 8。
这是复选框对应的视图:
@foreach($categories as $category)
<li class="list-group-item">
<div class="form-check">
<input class="form-check-input filtercheckbox" type="checkbox" name="checkboxfilter" id="{{$category}}check" value="{{$category}}">
<label class="form-check-label" for="inlineRadio1">{{strtoupper($category[0]).substr($category,1)}}</label>
</div>
</li>
@endforeach
我的JavaScript:
function filterItems(){
var filter = [];
for(var i=0; i<checkbox.length; i++) {
if(checkbox[i].checked){
filter.push(checkbox[i].value);
}
}
$.ajax({
url:"/aluno/shop/filter",
method:"GET",
data:{ filter:filter },
dataType:"json",
success:function (data) {
console.log(data);
//document.getElementById('items_list').innerHTML = data;
}
}
);
}
var checkbox = document.getElementsByClassName("filtercheckbox");
for(var i=0; i<checkbox.length; i++) {
checkbox[i].addEventListener("change",filterItems);
}
我的功能控制器:
public function filterCategory(Request $request){
if($request->ajax()){
$query = $request->get('filter');
$materials = array();
if( $query != ''){
foreach ($query as $cat){
$materialsList = Material::where('category','=', $cat)->get();
array_push($materials,$materialsList);
}
}else{
$materialsList = Material::all();
}
由于 dd() 函数在这种情况下不起作用,因此我无法判断问题是什么,是否有调用、响应或两者之间的任何内容。感谢一些帮助,我还可以展示我如何进行有关文本搜索的其他 ajax 调用,不知道是否可能有任何冲突。
慕田峪7331174
相关分类