[英]How to add button for each row using for loop in datatables by ajax and jquery
[英]Ajax Add button in for each loop Laravel 5.4
我正在尝试在foreeach
循环中创建一个“添加按钮”。 并使用ajax提交。 但是我很难找出我到底在做什么错,我的JS知识很差。
这就是我的代码。
视图:
@foreach ($lots as $lot)
@if (count($lot->comments) >= 1)
<span class="glyphicon glyphicon-ok"></span>
@else
<form id="favorites-button" data-id="{{ $lot->lot_id }}">
{{ csrf_field() }}
<input type="hidden" name="body" value="0_o" class="form-control">
<button type="submit" class="btn btn-xs btn-primary">Favorites</button>
</form>
@endif
@endforeach
这是我的JS
@section('js')
<!-- Ajax add to favorites -->
<script type="text/javascript">
$("document").ready(function(){
$("#favorites-button").submit(function(e){
e.preventDefault();
var button = $(this);
var url = '/lots/' + button.data('id') + '/comment';
var body = $("input[name=body]").val();
var dataString = 'body='+body;
$.ajax({
type: "POST",
url : url,
data : dataString,
dataType : "json",
success : function(data){
}
},"json");
});
});
</script>
@endsection
这是我的路线:
Route::post('/lots/{lot}/comment', 'CommentsController@add');
而我的控制器:
public function add(Lot $lot)
{
Comment::create([
'body' => request('body'),
'lot_id' => $lot->lot_id,
'user_id' => auth()->user()->id,
'bid' => $lot->bid,
'lot_date' => $lot->lot_date,
'auction_name' => $lot->auction_name,
'pics_urls' => $lot->pics_urls,
'company' => $lot->company,
'model_name_en' => $lot->model_name_en,
'model_type_en' => $lot->model_type_en,
'scores_en' => $lot->scores_en,
'model_year_en' => $lot->model_year_en,
'color_en' => $lot->color_en,
'displacement' => $lot->displacement,
'transmission_en' => $lot->transmission_en,
'start_price_en' => $lot->start_price_en,
'inspection_en' => $lot->inspection_en,
'grade_en' => $lot->grade_en,
'equipment_en' => $lot->equipment_en,
'mileage_num' => $lot->mileage_num,
'result_en' => $lot->result_en,
'auct_ref' => $lot->auct_ref,
]);
return "ok";
}
所以我认为问题还在于我在foreach
循环中使用的ID
。 这意味着循环中的所有表单都具有相同的ID。 所以我需要重新考虑我的整个方法。 任何人都有想法我该怎么做?
<script type="text/javascript"> $("document").ready(function(){ $("#favorites-button").submit(function(e){ e.preventDefault(); var button = $(this); var url = '/lots/' + button.data('id') + '/comment'; var body = $("input[name=body]").val(); $.ajax({ type: "POST", url: url, data: { body: body, _token: '{{ csrf_token() }}' }, dataType: "json", success: function(data){ console.log('success'); } },"json"); }); }); </script>
我认为这会有所帮助。
所以我一开始就做错了一切!
我改变了整个方法。 感谢我的朋友们的帮助。
现在,首先,我将表单更改为Button女巫调用事件:
这是视图:
@foreach ($lots as $lot)
@if (count($lot->comments) >= 1)
<span class="glyphicon glyphicon-ok"></span>
@else
<button data-id="{{ $lot->lot_id }}" class="btn btn-xs btn-primary favouriteButton">Favourite</button>
@endif
@endforeach
比起我改JS:
<!-- Ajax add to favorites -->
<script type="text/javascript">
// call button via class
$('.favouriteButton').click(function (e) {
var button = $(this);
e.preventDefault();
// change the route
$.get('/lots/' + $(this).data('id') + '/favourite')
.done(function (response) {
// instead of button insert check icon
button.parent().append('<span class="glyphicon glyphicon-ok"></span>');
// remove button
button.remove();
})
.fail(function (respnse) {
});
});
</script>
比我改变路线:
Route::get('/lots/{lot}/favourite','CommentsController@favouriteButton');
并创建了新功能:
public function favouriteButton(Lot $lot){
Comment::create([
'body' => 'Auto add', // this is the body for new comment
'lot_id' => $lot->lot_id,
'user_id' => auth()->user()->id,
'bid' => $lot->bid,
'lot_date' => $lot->lot_date,
'auction_name' => $lot->auction_name,
'pics_urls' => $lot->pics_urls,
'company' => $lot->company,
'model_name_en' => $lot->model_name_en,
'model_type_en' => $lot->model_type_en,
'scores_en' => $lot->scores_en,
'model_year_en' => $lot->model_year_en,
'color_en' => $lot->color_en,
'displacement' => $lot->displacement,
'transmission_en' => $lot->transmission_en,
'start_price_en' => $lot->start_price_en,
'inspection_en' => $lot->inspection_en,
'grade_en' => $lot->grade_en,
'equipment_en' => $lot->equipment_en,
'mileage_num' => $lot->mileage_num,
'result_en' => $lot->result_en,
'auct_ref' => $lot->auct_ref,
]);
return "ok";
}
希望我的经验对身体有所帮助。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.