#php #jquery #ajax #codeigniter-3 #sweetalert2
#php #jquery #ajax #codeigniter-3 #sweetalert2
Вопрос:
До использования SweetAlert форма отправки работала нормально. После добавления SweetAlert форма отправки все равно не работает, я не понимаю, что не так с моим кодом.
Мой HTML-код
<div class="form-group">
<a href="javascript:;" class="btn btn-success" id="addInputFile">Modal Input File</a>
</div>
и модальный
<form class="form-horizontal" id="submit">
<div id="myModal" class="modal fade" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">amp;times;</span></button>
<h4 class="modal-title">Modal title</h4>
</div>
<div class="modal-body">
<div class="form-group">
<input type="text" name="judul" class="form-control" placeholder="Judul">
</div>
<div class="form-group">
<input type="file" name="file">
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary" id="btn_upload">Upload</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
</form>
Часть js
$(document).ready(function(){
$('#addInputFile').on('click', function(){
$('#myModal').modal('show');
$('#btn_upload').on('click', function(e){
e.preventDefault();
Swal.fire({
title: 'Are you sure?',
text: "The data will input",
type: 'warning',
showCancelButton: true,
confirmButtonColor: '#3085d6',
cancelButtonColor: '#d33',
confirmButtonText: 'Add',
cancelButtonText: 'Cancel'
}).then((result) => {
if (result.value) {
$('#submit').unbind('submit').submit();
$('#submit').submit(function(e){
e.preventDefault();
$.ajax({
url:'myfile.php',
type:"post",
data:new FormData(this),
processData:false,
contentType:false,
cache:false,
async:false,
success: function(data){
alert("Input Form Success.");
}
});
});
}
})
});
});
});
Кроме того, я пытаюсь отредактировать эту строку
$('#submit').submit(function(e){
В это
$('#submit')[0].submit(function(e){
Но страницы, но страница обновляется.
Комментарии:
1. также покажите свой html
2. почему вы отключаете отправку?
3. после добавления e.preventDefault(); ниже $(‘#btn_upload’).on (‘click’, функция(e){ Я предполагаю, что форма установлена по умолчанию. Итак, я пытаюсь добавить туда функцию unbind, но все равно, даже если я их удалю, все равно не работает
4. я отредактировал свой пост, пожалуйста, помогите, сэр.
Ответ №1:
обновите это
<div class="modal-footer">
<input type="button" class="btn btn-default" data-dismiss="modal" value='Close'>
<input type="button" class="btn btn-primary" id="btn_upload" value='Submit' />
</div>
$(document).ready(function(){
$('#addInputFile').on('click', function(){
$('#myModal').modal('show');
});
$('#btn_upload').on('click', function(){
Swal.fire({
title: 'Are you sure?',
text: "The data will input",
type: 'warning',
showCancelButton: true,
confirmButtonColor: '#3085d6',
cancelButtonColor: '#d33',
confirmButtonText: 'Add',
cancelButtonText: 'Cancel'
}).then((result) => { alert('resolved');
if (result.value) {alert('submitting');
$.ajax({
url:'myfile.php',
type:"post",
data:new FormData(this),
processData:false,
contentType:false,
cache:false,
async:false,
success: function(data){
alert("Input Form Success.");
},
failure:function(d){
alert("Error")
alert(d)
}
});
}
})
});
});
Комментарии:
1. пожалуйста, соответствующим образом отрегулируйте скобки
2. предупреждение разрешено и отправка отображается, но по-прежнему не действует.
3. чем проблема в вашем запросе ajax, добавьте свою функцию сбоя в ajax
4. Все то же самое, просто показать разрешение предупреждения и отправку. Не входит в раздел сбоя