Ajax отправка данных из формы
Здесь представлен способ отправки данных из формы через Ajax с помощью библиотеки jQuery. Сделайте ваш сайт еще более современным и интерактивным. Такой отправкой данных мы избавляемся от перезагрузки страницы, после нажатия на кнопочку Submit в форме.
Демо можно посмотреть тут
Как это делается? Все как обычно довольно просто, jQuery и его плагины уже обо всем для нас позаботились 🙂
Нам понадобится плагин jquery.form.js. Скачать можно тут, либо с официального сайта
Сам код:
<!-- Подключаем jQuery и плагин --> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="jquery.form.js"></script> <!-- Создание формы, здесь приведена самая простейшая для примера --> <form id="FormaAjax" action="action.php" method="post"> Поле 1: <input type="text" name="pole1" /> Поле 2: <textarea name="pole2"></textarea> <input type="submit" value="Отправить данные" /> </form> <!-- Здесь делаем блок для вывода результата --> <div id="result"></div> |
<!-- Сам скрипт обработки формы --> <script type="text/javascript"> $(document).ready(function(){ $("#FormaAjax").ajaxForm(function() { //Здесь можно прописать какие действия будут делаться после отправки формы, // Например под формой будет выходить какой-нибудь текст // Делаем тоже через jQuery вот так: $("#result").load("result.php"); }); }); </script> |
То есть после нажатия на кнопку Submit в форме данные отправятся на скрипт action.php со всеми данными методом post, где и будут обработаны c единственной разницей, что страница не перезагрузится.
После чего содержимое Div с idшником «result» заполнится выводом скрипта result.php (Если мы хотим чтобы форма тоже заменялась, то кладем форму в этот div).
То есть, можно в action.php к примеру заносить данные в базу а в result.php выводить их из базы на страницу. Либо делать это все в одном скрипте, вариантов масса, все ограничено лишь фантазией 🙂
День добрый!
Подскажите, пожалуйста, как это сделать в одном скрипте? У меня и так и так получается три файла. Допустим, index.html, action.php и result.php
Буду благодарен за ответ.
@Константин
Один из вариантов передавайте вашему скрипту какое-нибудь значение в зависимости от которого он будет либо выводить форму, либо заносить данные либо еще какие-либо действия делать.
А как отправить форму не по кнопке submit а через JS функцию типа senf() да чтоб при этом страница не перегружалась??
Ответ первому номеру:
через
case ‘namex: break;
можно сделать
Спасибо большое за скрипт, но у меня появилась проблема с кодировкой. В базу заносятся иероглифы и выводятся на экран соответственно они же. Как решить проблему ?
Спасибо! Отличный пример!
пожалуйста дайте пример action.php для полноты осознания инфы )
Ребята, напишите все что нужно для работоспособности сего урока как в демке.
«//Здесь можно прописать какие действия будут делаться после отправки формы,
// Например под формой будет выходить какой-нибудь текст
// Делаем тоже через jQuery вот так:»
Не вот так что там можно что-то прописать, а пропишите что надо, и файл обработчик пожалста… А то вроде материал есть, а хрен что получается=)