如果我将结果附加到他们显示的正文中,但是当我将结果附加到#results时,我会在输出结果来自id为'results'的div中搜索结果。
搜索框位于master.blade.php的导航栏中,其他每个页面都包含它。
master.blade.php
<form id="search_form" action="/search" method="get" autocomplete="off" class="navbar-form navbar-left">
<div class="form-group">
<input type="text" class="form-control" id="search_text" onkeyup="search_data(this.value);" placeholder="Search">
</div>
<div id="result">
<table style="width:100%">
@if (isset($results) && count($results) > 0)
@foreach( $results as $business )
<tr>
<td>{{ $business->logo }}</td>
<td>{{ $business->name}}</td>
</tr>
@endforeach
@endif
</table>
</div>
</div>
</form>
控制器:
public function search($search_value) {
$search_text = $search_value;
if ($search_text==NULL) {
$data= Business::all();
} else {
$data=Business::where('name','LIKE', '%'.$search_text.'%')->get();
}
//$data = $data->toArray();
return view('master')->with('results',$data);
}
的Ajax:
function search_data(search_value) {
$.ajax({
url: '/searching/' + search_value,
type: 'post',
dataType: 'html',
success: function(data) {
$('#results').append(data);
},
error: function(data) {
$('body').html(data);
},
headers: {
'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
}
});
}
路线::
Route::post('/searching/{search}', 'SearchController@search');
如果我真的查看ajax响应,结果是:
<table style="width:100%">
<tr>
<td></td>
<td>dasd</td>
</tr>
</table>
但它永远不会出现在页面上!如果将附加内容更改为正文,则会执行此操作。
//修改
我有一个加载的GIF工作正常,但现在它永远不会消失,每次执行ajax,它也不想消失:
$(document).ajaxStart(function() { Pace.restart(); });
$(window).on('load', function () {
setTimeout(function(){
$('.se-pre-con').fadeOut('slow', function () {
$(".container").css({ opacity: 1.0 });
});
}); // set the time here
});
$(document).ready(function() {
setTimeout(function() {
$(".messages").fadeOut(5000);
});
setTimeout(function() {
$(".messages").fadeOut(5000);
});
});
的CSS:
.se-pre-con {
position: fixed;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
opacity: 0.5;
background-color: #6d6968;
background: url(../images/default.gif) center no-repeat #fff;
}
答案 0 :(得分:0)
jQuery.ajaxSetup({
beforeSend: function (xhr, data) {
$('.se-pre-con').show();
},
complete: function ()
{
$('.se-pre-con').hide();
}
});