我想创建一个搜索过滤器,并使用ajax显示输出。
这是用于提交数据的按钮:
Workspace
|-Read
|-repo
|-local
|-scm
|-1.0
|-scm-1.0.jar
|-scm-1.0.pom
这是以下形式的输出表:
{!! Form::open(['method' => 'POST', 'action' => 'Modul\CarianAnugerahController@search']) !!}
//Form for filter here...
{{ Form::submit('Cari', ['class' => 'btn btn-primary', 'id' =>'search']) }}
{!! Form::close() !!}
获取数据的ajax代码是:
<div class="panel panel-default">
<div class="panel-heading">Senarai Calon Anugerah</div>
<div class="panel-body">
@if (session('status'))
<div class="alert alert-success">
{{ session('status') }}
</div>
@endif
@if(Auth::check())
<div class="container table-responsive col-lg-12">
<!-- <div class="container text-center"> -->
<table class="table table-striped table-bordered" id="calon_table" >
<thead>
<tr>
<td class="text-center col-lg-3"><strong>Name</strong></td>
<td class="text-center"><strong>Action</strong></td>
<!-- <td class="text-center"><strong>Lihat Rekod</strong></td> -->
</tr>
</thead>
<tbody id="calon_anugerah">
</tbody>
</table>
<!-- </div> -->
</div>
@endif
@if(Auth::guest())
<a href="/login" class="btn btn-info"> Anda perlu log masuk.</a>
@endif
</div>
</div>
</div>
我已经使用CarianAnugerahController @ search中的代码查询了数据:
<script type="text/javascript">
$('#search').on('click', function(){
$.get("{{ URL::to('search-calon') }}",function(data){
$.each(data, function(i, value){
var tr =$("<tr/>");
tr.append($("<td/>",{
text : value.name
}))
$('#calon_anugerah').append(tr);
});
})
})
</script>
这是路线:
$query = DB::table('itemregistrations')
->select('itemregistrations.ItemRegistrationID','itemregistrations.name', 'itemregistrations.Nobadan');
if(request('umur')) {
$query->whereRaw('YEAR(CURDATE()) - lahir_yy >= ?', [request('umur')]);
}
if(request('negeri_lahir')) {
$query->where('NegeriID', request('negeri_lahir'));
}
if(request('kategori')) {
$query->where('CategoryID', request('kategori'));
}
if(request('pangkat')) {
$query->where('OperasiID', request('pangkat'));
}
$newitem = $query->get();
return response($newitem);
我可以获取该值,但它不会显示在表中。它以json格式在白页中显示输出。
示例输出。在浏览器中。
ajax代码缺少什么?
答案 0 :(得分:1)
我想您应该删除form
action
和method
。因为如果您通过ajax
提交表单,则不需要action
和method
。由于action
和method
的原因,您的表单提交就像表单数据的正常发布一样,这就是您在浏览器上接收输出的原因。
{!! Form::open() !!}
{{ csrf_field() }}
//Form for filter here...
{{ Form::submit('Cari', ['class' => 'btn btn-primary', 'id' =>'search']) }}
{!! Form::close() !!}
尝试这些更改,看看是否获得期望的结果。并使用post
进行ajax调用,您的search-calon
路由为POST
<script type="text/javascript">
$('#search').on('click', function(){
$.post("{{ URL::to('search-calon') }}",function(data){
$.each(data, function(i, value){
var tr =$("<tr/>");
tr.append($("<td/>",{
text : value.name
}))
$('#calon_anugerah').append(tr);
});
})
})
</script>