отправка формы с использованием jquery.confirm
Есть много примеров того, как отправить форму после нажатия кнопки ОК в диалоговом окне подтверждения, но я не могу заставить ее работать.
<form class="myform" method="post"action="<?php echo Configure::read('Settings.MYURL'); ?>">
<input type="hidden" name="type" value="bdt" />
<input type="hidden" name="data" value="<?php echo $session['Session']['id']; ?>" />
<input type="hidden" name="id" value="<?php echo $subscriber_id; ?>" />
<input type="hidden" name="p_id" value="<?php echo $available_packages['Package']['id']; ?>"/>
<input type="hidden" name="ext_id" value="<?php echo $available_exten_pack['id']; ?>"/>
<input type="hidden" name="redirected_from" value ="<?php echo $this->request->here; ?>" />
<input id = "loginurl" type="hidden" name="loginurl" value="<?php echo Router::fullBaseUrl() . Router::url(array('controller' => 'Home', 'action' => 'login')); ?>" />
<input class="btn btn-sm btn-primary pull-right extendpackage" type="submit" name="submit" value="Subscribe">
</form>
я использую JQuery-confirm.js для диалога, оповещения и т. д.
Если пользователь нажмет кнопку отправки или отправит форму
$.confirm({
columnClass: 'col-md-4 col-md-offset-4',
theme: 'white',
title: 'Add',
content: 'do stuff',
confirmButton: 'Ok',
cancelButton: 'Cancel',
confirmButtonClass: 'btn-success',
cancelButtonClass: 'btn-danger',
confirm: function() {
// i want user submit my form
//which posts my data to an action
//
},
cancel: function() {
}
});
я пытался $('.myform').submit() Но это не работает
Решение
Jquery.confirm.js не вызывает диалоговое окно подтверждения, не связываясь с кнопкой или формой. Итак, вам нужно связать действие подтверждения с кнопкой отправки. Вы также можете показать диалог подтверждения при отправке формы.
Чтобы связать действие подтверждения с кнопкой, вы можете сделать:
$('input[type=submit]').confirm({
columnClass: 'col-md-4 col-md-offset-4',
theme: 'white',
title: 'Add',
content: 'do stuff',
confirmButton: 'Ok',
cancelButton: 'Cancel',
confirmButtonClass: 'btn-success',
cancelButtonClass: 'btn-danger',
confirm: function() {
//Submit the form
$('.myform').submit();
},
cancel: function() {
//Do nothing
}
});
Этот код покажет диалоговое окно подтверждения при нажатии кнопки отправки.
Здесь демонстрация
Обновить:
Как включить код подтверждения диалога в функцию form.submit ()?
Если вы включите диалог подтверждения, отобразите код в form.submit Функция, как это, вы обнаружите, что диалоговое окно подтверждения не появляется:
$('form').submit(function(event) {
$.confirm({
//confirm dialog options...
confirm: function() {
//Submit the form
},
cancel: function() {
//Cancel submission
event.preventDefault();
}
});
});
Причина этого в том, что когда вы вызываете $.confirm() функция, он отображает диалоговое окно подтверждения, и после этого он отправит форму. Представление скрывает диалог. По сути, диалог не останавливает выполнение потока пользовательского интерфейса, когда он виден в отличие от диалогового окна предупреждений —alert('Alert'),
Чтобы решить эту проблему, отправка формы должна быть отменена, прежде чем появится диалоговое окно подтверждения. Теперь, после подтверждения вы можете отправить форму. Отменить форму нечего.
Вот как вы можете сделать это:
$('form').submit(function(event) {
event.preventDefault();
var form = $(this)[0];
$.confirm({
columnClass: 'col-md-4 col-md-offset-4',
theme: 'white',
title: 'Add',
content: 'do stuff',
confirmButton: 'Ok',
cancelButton: 'Cancel',
confirmButtonClass: 'btn-success',
cancelButtonClass: 'btn-danger',
confirm: function() {
//Submit the form
form.submit();
},
cancel: function() {
//Do nothing
}
});
});
Другие решения
Других решений пока нет …