使用JQueryAJAX在Laravel 5.5中填一个table
Using JQuery AJAX to fill a table in Laravel 5.5
我的视图中有一个填充的下拉列表,当我从列表中选择一个日期时,我想用数据库中的数据填充另一个 table。
我创建了一个名为 description 的控制器方法,它也采用如下所示的参数,其中 returns 我需要的 JSON 格式的数据
当我手动输入 url 时,我得到了正确的 json 响应,但是当我尝试使用 Ajax 传递 url 时,它不起作用。
我的控制器代码
public function description($car,$date)
{
$description = DB::table("histories")
->where('crn',$car)
->where("date",$date)
->get();
return json_encode($description);
}
我的路线
Route::get('admin/cars/history/{car}/{date}','CarController@description');
我的观点
<div class="container-fluid">
<ol class="breadcrumb">
<li><a href="{{url('admin')}}">Home</a></li>
<li><a href="{{url('admin/cars')}}">Car</a></li>
<li class="active">{{$car->crn}}</li>
</ol>
<div class="box box-success">
<div class="panel">
<div class="panel-heading"><h3>Car Details</h3></div>
<div class="box-header with-border">
<div class="form-group">
<label for="owner">Owner</label>
<p>{{$car->customer->name}}</p></div>
<div class="form-group">
<label for="manufacturer">Manufacturer</label>
<p>{{$car->manufacturer}}</p></div>
<div class="form-group">
<label for="model">Model</label>
<p>{{$car->model}}</p></div>
<div class="form-group">
<label for="address">Last Visit</label>
<p>{{$lastservice->created_at->toFormattedDateString()}}</p></div>
<div class="form-group">
<label for="">Select Date to view history records</label>
<select name="date" class="form-control" style="width:250px">
<option value="">--- Select Date ---</option>
@foreach ($history as $date => $value)
<option value="{{ $date }}">{{ $value }}</option>
@endforeach
</select>
<a href="{{url('admin/cars/')}}" class="btn btn-default">Back</a></div>
</div>
</div>
我的JQuery
<script type="text/javascript">
$(document).ready(function() {
var results = $('#results');
$('select[name="date"]').on('change', function() {
var $date = $('option:selected').text();
$.ajax({
url: 'admin/cars/history/HNH419/'+$date,
type: "GET",
dataType: "json",
success:function(response){
alert(response);
}})
})
});
</script>
我的界面示例
就我而言,当我在 ajax url
.
前面添加“localhost”时它起作用了
因为没有像“admin/cars/history/HNH419/…”
这样的url,实际上有像“localhost/admin/cars/history/HNH419/….”
这样的东西
提示:手动尝试时必须使用地址栏中的完整地址。
$.ajax({
type:'POST',
url: host_url+'forum/question/add',
// code continues
就我而言,host_url = “localhost:8000”
我的视图中有一个填充的下拉列表,当我从列表中选择一个日期时,我想用数据库中的数据填充另一个 table。
我创建了一个名为 description 的控制器方法,它也采用如下所示的参数,其中 returns 我需要的 JSON 格式的数据
当我手动输入 url 时,我得到了正确的 json 响应,但是当我尝试使用 Ajax 传递 url 时,它不起作用。
我的控制器代码
public function description($car,$date)
{
$description = DB::table("histories")
->where('crn',$car)
->where("date",$date)
->get();
return json_encode($description);
}
我的路线
Route::get('admin/cars/history/{car}/{date}','CarController@description');
我的观点
<div class="container-fluid">
<ol class="breadcrumb">
<li><a href="{{url('admin')}}">Home</a></li>
<li><a href="{{url('admin/cars')}}">Car</a></li>
<li class="active">{{$car->crn}}</li>
</ol>
<div class="box box-success">
<div class="panel">
<div class="panel-heading"><h3>Car Details</h3></div>
<div class="box-header with-border">
<div class="form-group">
<label for="owner">Owner</label>
<p>{{$car->customer->name}}</p></div>
<div class="form-group">
<label for="manufacturer">Manufacturer</label>
<p>{{$car->manufacturer}}</p></div>
<div class="form-group">
<label for="model">Model</label>
<p>{{$car->model}}</p></div>
<div class="form-group">
<label for="address">Last Visit</label>
<p>{{$lastservice->created_at->toFormattedDateString()}}</p></div>
<div class="form-group">
<label for="">Select Date to view history records</label>
<select name="date" class="form-control" style="width:250px">
<option value="">--- Select Date ---</option>
@foreach ($history as $date => $value)
<option value="{{ $date }}">{{ $value }}</option>
@endforeach
</select>
<a href="{{url('admin/cars/')}}" class="btn btn-default">Back</a></div>
</div>
</div>
我的JQuery
<script type="text/javascript">
$(document).ready(function() {
var results = $('#results');
$('select[name="date"]').on('change', function() {
var $date = $('option:selected').text();
$.ajax({
url: 'admin/cars/history/HNH419/'+$date,
type: "GET",
dataType: "json",
success:function(response){
alert(response);
}})
})
});
</script>
我的界面示例
就我而言,当我在 ajax url
.
因为没有像“admin/cars/history/HNH419/…”
这样的url,实际上有像“localhost/admin/cars/history/HNH419/….”
提示:手动尝试时必须使用地址栏中的完整地址。
$.ajax({
type:'POST',
url: host_url+'forum/question/add',
// code continues
就我而言,host_url = “localhost:8000”