我是laravel的初学者,我在我的项目中创建了一个ajax crud,我想在我的编辑表单中使用输入类型select和radio,但我不知道如何实现它,你能帮我吗?请。
这是我的编辑按钮:
<button
class="edit-modal btn btn-info"
data-id="{{$dechet->id}}"
data-type="{{$dechet->type}}"
data-description="{{$dechet->description}}"
data-statut="{{$dechet->statut}}"
data-utilisateur="{{$dechet->utilisateur}}"
data-heure="{{$dechet->heure}}">
<span class="icon-pencil"></span>
</button>
这是我的编辑表格:
<form class="form-horizontal" role="form">
<div class="form-group">
<label class="control-label col-lg-3" for="id">ID:</label>
<div class="col-lg-9">
<input type="text" name="id" class="form-control"
id="id_edit" disabled>
</div>
</div>
<div class="form-group">
<label class="control-label col-lg-3" for="date">Date:
</label>
<div class="col-lg-9">
<input type="datetime" name="date" class="form-control"
id="date_edit">
</div>
</div>
<div class="form-group">
<label class="control-label col-lg-3"
for="utilisateur">utilisateur:</label>
<div class="col-lg-9">
<input type="text" name="utilisateur" class="form-
control" id="utilisateur_edit" disabled>
</div>
</div>
<div class="form-group">
<label class="control-label col-lg-3" for="type">Type:
</label>
<div class="col-lg-9">
<select name="type" class="select" id="type_edit">
<option value="" {{ $dechet->type == '' ?
'selected="selected"' : '' }}>{{ $dechet->type}}
</option>
</select>
</div>
</div>
<div class="form-group">
<label class="control-label col-lg-3" for="statut">Statut:
</label>
<div class="col-lg-9">
<label class="radio-inline">
<input type="radio" class="styled" name="statut"
id="statut_edit" value="0" {{ $dechet->statut == '0'
? 'checked' : '' }}>Refusée </label>
<label class="radio-inline">
<input type="radio" class="styled" name="statut"
id="statut_edit" value="1" {{ $dechet->statut == '1'
? 'checked' : '' }}>En cours</label>
<label class="radio-inline">
<input type="radio" class="styled" name="statut"
id="statut_edit" value="2"{{ $dechet->statut == '2' ?
'checked' : '' }}>Acceptée</label>
</div>
</div>
<div class="form-group">
<label class="control-label col-lg-3"
for="description">Description:</label>
<div class="col-lg-9">
<textarea class="form-control" name="description"
id="description_edit" rows="5" cols="5"></textarea>
</div>
</div>
</form>
ajax电话:
$(document).on('click', '.edit-modal', function() {
$('.modal-title').text('Edit');
$('#id_edit').val($(this).data('id'));
$('#type_edit').val($(this).data('type'));
$('#description_edit').val($(this).data('description'));
$('#date_edit').val($(this).data('heure'));
$('#utilisateur_edit').val($(this).data('utilisateur'));
$('#statut_edit').val($(this).data('statut'));
id = $('#id_edit').val();
$('#editModal').modal('show');
});
$('.modal-footer').on('click', '.edit', function() {
$.ajax({
type: 'PUT',
url: 'updateDechets' + id,
data: {
'_token': $('input[name=_token]').val(),
'id': $("#id_edit").val(),
'type': $('#type_edit').val(),
'statut': $('#statut_edit').val(),
'description': $('#description_edit').val(),
'date': $('#date_edit').val(),
},
success: function(data) {
$('.errorType').addClass('hidden');
$('.errorStatut').addClass('hidden');
$('.errorDescription').addClass('hidden');
$('.errorDate').addClass('hidden');
if ((data.errors)) {
setTimeout(function () {
$('#editModal').modal('show');
toastr.error('Validation error!', 'Error Alert',
{timeOut: 5000});}, 500);
if (data.errors.type) {
$('.errorType').removeClass('hidden');
$('.errorType').text(data.errors.type);
}
if (data.errors.statut) {
$('.errorStatut').removeClass('hidden');
$('.errorStatut').text(data.errors.statut);
}
if (data.errors.description) {
$('.errorDescription').removeClass('hidden');
$('.errorDescription').text(data.errors.description);
}
if (data.errors.date) {
$('.errorDate').removeClass('hidden');
$('.errorDate').text(data.errors.date);
}
} else {
toastr.success('Successfully updated dechet!',
'Success Alert', {timeOut: 5000});
}
}
});
});