#php #javascript #jquery #ajax #codeigniter
#php #javascript #jquery #ajax #codeigniter
Вопрос:
Вероятно, это будет звучать наоборот. Мне нужно, чтобы форма отправляла return false, но все еще отправляла форму.
У меня есть форма, загружаемая на страницу через ajax (функция загрузки jquery), и при отправке я хотел бы отобразить графику и некоторый текст в том же div, а не перенаправлять страницу.
Это моя кнопка отправки (codeigniter):
<?php $attributes = array('class' => 'button', 'onclick' => 'form_success_client(); return false;', 'name' => 'submit'); echo form_submit( $attributes, 'Save'); ?>
и в html:
<input type="submit" onclick="form_success(); return false;" class="button" value="Save" name="submit">
и функцию javascript, которая загружает сообщение об успешном завершении:
function form_success_client() { // form success
$('.contentarea').load("/mm/index.php/site/form_success_client/");
}
Все это работает нормально, но неудивительно, что форма не отправляется. Я знаю, что правильный способ сделать это — передать отправку формы в jquery, но я не уверен, как это сделать. По возможности не помешало бы быстро исправить ситуацию (пока у меня не будет времени найти лучшее решение), однако все предложения приветствуются.
Спасибо!
ОТВЕТ:
Это то, что сработало для меня, просто небольшое редактирование ответа Мэгги:
function form_success_client(obj) {
$.ajax({
type: 'POST',
url: $(obj).attr('action'),
data: $(obj).serialize(),
success: function(msg){
$('.contentarea').load("/mm/index.php/site/form_success_client/");
}
});
return false;
}
Обратите внимание на то, что $ () переносит obj в URL и данные.
Комментарии:
1. для чего это возвращает false? Каким бы ни был результат, он будет вызываться всегда. так ли это?
Ответ №1:
привяжите ваше JS onclick-событие к форме (не к кнопке) следующим образом 'onclick' => 'form_success_client(this); return false;'
и измените свою функцию на
function form_success_client(obj) {
$.ajax({
type: "POST",
url: obj.attr("action"),
data: obj.serialize(),
success: function(msg){
$('.contentarea').load("/mm/index.php/site/form_success_client/");
}
});
}
непроверено
Комментарии:
1. Привет @maggie, извините за задержку. Этот ответ выглядит хорошо, но я получаю ошибку с obj.attr и obj.serialize — ‘obj.attr не является функцией’ в firebug.
Ответ №2:
Возможное решение. Я придерживаюсь вашего кода
<input type="submit" onclick="form_success_client(this); return false;" class="button" value="Save" name="submit">
function form_success_client( i ) {
formData = $(i).parents('form').serialize();
$.post( "/mm/index.php/site/form_success_client/", formData, function(loaded) { $('.contentarea').append(loaded) }, 'html' );
}
РЕДАКТИРОВАТЬ: И да, как сказала Мэгги, вы должны привязываться form_success_client(this); return false; вот так
<form onsubmit="form_success_client(this); return false;">
не для кнопки
Комментарии:
1. Я полагаю, что если вы прикрепляете событие к форме (что, вероятно, лучше всего), то при выполнении .parents(‘форма’) вы будете делать это в форме и ничего не получите обратно. Это просто запускает ее через мой js-движок head, хотя, возможно, я ошибаюсь. На самом деле просто комментарий, который вам нужно добавить немного больше к вашей правке. 🙂
Ответ №3:
Вы можете использовать jquery .post , .get или .ajax
в зависимости от успеха или возвращенных данных вы можете отправить форму
http://api.jquery.com/jQuery.get/