當我按退格鍵時,然后顯示所有產品如何防止它。我需要在搜索框文本消失時阻止它,然后搜索結果應該消失。
$(document).ready(function(){
$('#product-keyword').on('keyup', function(e){
var keyword = $(this).val();
$.ajax({
url:'{{ route("labelProductSearch") }}',
data:{
keyword: keyword,
},
success:function(response){
$('#search-result').html(response);
console.log('Product Found')
},
error:function(){
console.log('Product Not Found')
}
});//End Ajax
});
});
和我的控制器
//搜索產品 public function get_product_search(Request $request) { $searchString = $request->keyword;
$product = Product::where('name', 'LIKE', $searchString.'%')
->orWhere('weight', 'LIKE', $searchString.'%')
->orWhereHas('stocks', function ($query) use ($searchString) {
$query->where('sku', 'LIKE', $searchString.'%');
})
->orderby('id','desc')
->get();
$output = '';
if (count($product)>0) {
$output = '<ul >';
foreach ($product as $row){
$output .= '<li onclick="addProductCart('.$row->id.')" >';
$output .= '<div >';
$output .= '<div >';
$output .= '<img src="'.uploaded_asset($row->thumbnail_img).'" width="30" alt="當我按退格鍵然后顯示所有產品如何防止它">';
$output .= '</div>';
$output .= ' <div >'.$row->name.'</div></div></li></ul>';
}
}else{
$output = '<ul >';
$output .= '<li >'.'No results'.'</li>';
$output .= '</ul>';
}
return $output;
}
uj5u.com熱心網友回復:
在發送ajax請求之前做這樣的事情
$(document).ready(function(){
$('#product-keyword').on('keyup', function(e){
var keyword = $(this).val();
// smartly handle if no keyword entered
if (keyword === '') {
$('#search-result').html("Please type something to search");
return;
}
$.ajax({
url:'{{ route("labelProductSearch") }}',
data:{
keyword: keyword,
},
success:function(response){
$('#search-result').html(response);
console.log('Product Found')
},
error:function(){
console.log('Product Not Found')
}
});//End Ajax
});
});
如果未輸入關鍵字,基本上您不需要發送 ajax 請求來查找產品。事實上,您需要通知用于輸入內容以搜索產品。
轉載請註明出處,本文鏈接:https://www.uj5u.com/gongcheng/392933.html
上一篇:當沒有提供可選引數時,將Laraveloptions()作為陣列回傳
下一篇:警告:React.createElement:型別無效——需要一個字串(對于內置組件)(ReactWebpackPhaser)
