Uncaught TypeError:非法调用使用laravel / ajax

Question

当我切换复选框时，我试图将数据库中的列paye更改为1并更改列date_paiement。

所以我使用以下代码:

我有以下情态形式:

<div class="modal fade bd-example-modal-lg" id="formModal" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Modal title</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<form id="date_payement" method="post" action="projets"   enctype="multipart/form-data">
{{ csrf_field() }}
<input type="hidden" id="id_hidden" name="id_projet" />
<div class="form-group">
<label for="casting_date_naissancee">Date de payement</label>
<div class="input-group date">
<input type="text" class="form-control" id="date_paiement" name="date_paiement">
<span class="input-group-text input-group-append input-group-addon" id="spanEstPaymentDate">
<i class="simple-icon-calendar"></i>
</span> 
</div>
</div>
<div class="form-group" align="center">
<input type="hidden" name="action" id="action" />
<input type="hidden" name="hidden_id" id="hidden_id" />
<input type="submit" name="action_button" id="action_button" class="btn btn-warning" value="Enregistrer" />
</div>
<div class=" col-md-6">
<span id="form_result"></span>
</div>
</form>
</div>
</div>
</div>
</div>
</div>

和下面的脚本:

$(document).ready(function() {
$(document).on('change', '.selectRow1', function() {
$('.modal-title').text("Saisir la date de paiement");
$('#action_button').val("Enregistrer");
$('#action').val("Enregistrer");
$('#formModal').modal('show');
var paye = $(this).prop('checked') == true ? 1 : 0;
console.log(paye);
var id = $(this).attr('id');
console.log(id);
$('#date_payement').on('submit', function(event) {
event.preventDefault();
if ($('#action').val() == 'Enregistrer') {
$.ajax({
type: "post",
dataType: "json",
url: 'projets/paiement',
data: {
'paye': paye,
'id_projet': id,
'date_paiement': new FormData(this)
},
success: function(data) {
console.log(data)
}
});
}
});
});
});

这是控制器:

public function paiement(Request $request) {
$request->validate(['paye'=>'required','id_projet'=>'required','date_paiement'=>'required']);
$projet = Projet::find($request->id_projet);
if($projet){
$projet->paye = $request->paye;
$projet->date_paiement = $request->date_paiement;
$projet->save();
return response()->json(['success'=>'Status change successfully.']);
}
return response()->json(['failed'=>'Status change failed.'],422);
}

所以我想当我切换选中框时，我应该得到paye，如果它是0或1，并显示模态形式来写date_paiement和改变到数据库的两列paye和date_paiement。

但是用这个代码，我得到以下错误:

Uncaught TypeError: Illegal invocation

如果你有任何想法，请帮助

Answer 1

您使用FormData不正确，您必须将其作为数据传递，而不是它的一部分。
另外，您必须指定processData: false,以防止$.ajax试图将格式数据转换为字符串，contentType: false,以防止$.ajax试图设置不正确的内容类型。

$('#date_payement').on('submit', function(event) {
event.preventDefault();
if ($('#action').val() == 'Enregistrer') {
var data = new FormData(this);
data.append('paye', paye);
data.append('id_projet', id);
$.ajax({
type: "post",
dataType: "json",
url: 'projets/paiement',
data: data,
processData: false,
contentType: false,
success: function(data) {
console.log(data)
}
});
}
});