Хорошее название топика, правда? А названия топиков очень важны, по ним приходят из поисковиков и по названию человек сразу понимает то ли это что он искал. Теперь по сути.
Как люди в древнее время (когда не было jQuery) сабмитили форму на AJAX’е? Схема не сложна, но очень муторна, нужно составить либо строку из всех инпутов вида ?id=25&bring_me=pianino&verni_mena_na=nebo, либо в формате JSON, который опять же нужно парсить. Потом появились фреймворки и библиотеки умеющие делать это за нас, нужно было только указать что и куда передаем, т.е. типа того что: { id: document.getElementById(’hidden_id’) .value, bring_me: document.getElementById(’bring_me’) .value, …}, не очень удобно.
И тут появляется ОН jQuery, тот кто покорил самого Гугла! И был написан под него плагин jQuery Form Plugin, который делает всю работу по сабмиту формы за нас. Создаем форму используя самую обыкновенную верстку, без особых дополнений:
<form id="myForm" action="comment.php" method="post">
Name: <input type="text" name="name" />
Comment: <textarea name="comment"></textarea>
<input type="submit" value="Submit Comment" />
</form>
Подключаем jQuery, сам Form Plugin и создаем небольшой обработчик для формы:
<head>
<script type="text/javascript" src="path/to/jquery.js"></script>
<script type="text/javascript" src="path/to/form.js"></script>
<script type="text/javascript">
// ожидаем загрузки всего документа
$(document).ready(function() {
// назначаем 'myForm' обрабатываемой формой и задаем ей простецкую функцию
$('#myForm').ajaxForm(function() {
alert("Спасибо за комментарий!");
});
});
</script>
</head>
И все дела! Теперь вместо сабмита формы произойдет AJAX запрос на сервер по ссылке из action с данными из нашей формы! Так же плагин поддерживает и AJAX загрузку файлов! Описание плагина и скачать его можно на этом сайте – http://malsup.com/jquery/form/.
Тестил в IE6 – ошибка JavaScript возникает при попытке обзора файлов. Будут еще версии обновленные?
> Павел
http://malsup.com/jquery/form/#code-samples
зайдите в File upload и проверьте, пробовал на IE 6 все работает
В файрфоксе такая же ошибка про javascript
где брать файл comment.php ?
а вот не подскажите как с кодировкой виндовой быть (на УТФ перейти возможности нет)
Если есть на php расширение iconv, то проблем никаких:
1. Если форма сабмитится без файлов, то iconv(’utf-8′, ‘windows-1251′, $_POST['name']); и так с каждым полем.
2. Если форма без файлов, то перекодировать ничего не надо, так как в этом случае ajaxForm передает форму через iframe и кодировка не меняется.
dust, большое спасибо, что написали про iconv, помогло исправить кодировку.
спасибо помог автор!!! зачет тебе++++
Под Opera 10 не работает. Форма сабмитетса, но респонса нет. Причем так, только в 10 (alpha,beta, все, все вообщем). Такой же глюк и на оф. сайте плагина.
Досадно, что использую я этот плагин в большом проекте, и теперь такая засада. Может както это решаемо?
Ну если проект на запад, то проблем нет, там опера – труп, а вот если проект наш… то это проблема, к сожалению опера еще жива…
sdfsdfsdfsdfsdf
fdgfdgf
dfgfdfffffffffffff
fghfghfgh
Люди подскажите
предоставленный здесь код он точно работает
или что-то надо добавлять
Нужно как в примере подключить jQuery и Form Plugin, а так да, работает.
только вот я не понял, что всё таки с файлом – comment.php ? поясните.
Я бы в таких случаях выкладывал рабочий пример архивом. не было бы столько вопросов.
comment.php это условный файл, т.е. там содержится код для добавления комментария в вашу базу. Приведу для примера запрос, но только как пример:
$sql = "INSERT INTO `comments` (`name`,`comment`) VALUES ('".addslashes($_POST['name'])."', '".addslashes($_POST['comment'])."')";
что значит "к сожалению опера еще жива"?? опера – руль. а вот ие6 (да и всё ослиное семейство) – мастдай. ФФ – тежеловесная, использую её только для дебага
"Описание плагина и скачать его можно на этом сайте" – мозг выпал от этой фразы…. капец… промптом переводил чтоль??
Простите, не хотел вас травмировать.
да с Opera 10 проблема, можт кто сможет подсказать решение данной проблемы
Зачёт!!
Пример работает при простом случае, а если формы вложенные одна в другую – тогда нет.
<form name="MainForm1" target="senddata">
<form id="myForm" action="save_comment.php" method="post">
Name: <input type="text" name="good_id" />
Comment: <textarea name="good_comment"></textarea>
<input type="submit" value="Submit Comment" />
</form>
<input type="submit" value="send_main_form">
</form>
и что же делать ?
если нажимаю кнопку "Submit Comment" – попадаю на новую страницу
форма в форме это бред
Советую все-таки разделить формы, они не должны быть вложенными, в нормальном случае.