Обработка формы ajax

@wredyatina · Регистрация: 06.09.2011

Студворк — интернет-сервис помощи студентам

Здравствуйте, подскажите плиз. Не могу найти ошибку, видать знаний не хватает еще((
Мне необходимо обработать форму без обновления страницы.

Форма:

HTML5
1
2
3
4
5
6
7
8
<form id="myForm" method="post">
 
<!-- все мои input'ы-->
<input name="submit" type="submit" id="submit" /></div>
 
</form>
 
<div id="content"></div>

Скрипт:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
$(document).ready(function() {
$("#myForm").submit(function() {
        $.ajax({
            type: "POST",
            url:"name_files.php",
            data:$('#myForm').serialize(),
            error:function(){$("#content").html("<p>Произошла ошибка!</p>");},
            beforeSend: function() {
                $("#content").html('Загрузка...');
            },
            success: function(html){
                $("#content").html('Регистрация прошла успешно!');
            }
        });
        
        return false;
});
});

Дело в том, что обычным способом, передача данных из формы в php и запись в бд, работает замечательно.
При подключении ajax, уже ничего.

@Razip · 14.07.2014, 17:21

wredyatina, не вижу ничего неправильного. Разве что html переменная в success-callback не используется, но это уже — придирки.

@wredyatina · 14.07.2014, 17:22 **[ТС]**

Охохохохо.... и как же найти косяк?

@Razip · 14.07.2014, 17:24

Стоит проверить путь до файла.

Добавлено через 1 минуту
wredyatina, покажите сайт, для начала. И подробнее опишите «уже ничего», т.к. обычно появляются ошибки в консоли разработчика, в Ajax-ответе может быть текст ошибки, в общем — много вариантов.

@wredyatina · 14.07.2014, 18:03 **[ТС]**

Так если по порядку. Я не указала checkbox'ы и radio сейчас думаю зря. Наверное про них отдельно надо дописать.

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
$(document).ready(function() {
$("#myForm").submit(function() {
 var data = $('#myForm').serialize();
        $.ajax({
            type: "POST",
            url:"name_files.php",
            data:data,
            error:function(){$("#content").html("<p>Произошла ошибка!</p>");},
            beforeSend: function() {
                $("#content").html('Загрузка...');
            },
            success: function(html){
                $("#content").html('Регистрация прошла успешно!');
            }
        });
        
        return false;
});
});

Добавлено через 2 минуты
вот для радио так должно быть?

JavaScript
1
var radio = $('input[name=status]:checked').val();

Добавлено через 18 минут
"Уже ничего" по сути страница обновляется, ну соответственно заполненные данные в форме скидываются и все.)

@and_y87 · 14.07.2014, 18:17

wredyatina, почему бы вам не сделать в php так:

PHP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
$resp = [];
if( count($_POST) == 0 )
{
  $resp['error'] = 'POST путой';
} 
else 
{
  //манипуляции с $_POST
  if( $all_right )
  {
    $resp['seccess'] = true;
    $resp['text'] = 'Регистрация прошла успешно!';
  }
  else
  {
    $resp['error'] = 'Что то пошло не так';
  }
}
 
print( json_encode( $resp, true ) );

и в ответе сервера сделать так:

JavaScript
1
2
3
4
5
6
7
8
9
success: function( resp )
{
  if ( resp.error )
  {
    alert( resp.error );
    return false;
  }
  $("#content").text ( resp.text );
}

Проставив достаточное кол-во уведомлений об ошибках можно упростить и разработку и дальнейшую жизнь пользователям которые будут видеть при ответе от сервера что они сделали не так...

@esculap_ra · 14.07.2014, 18:22

посмотри что приходит в $_POST скрипту обработчика.

Добавлено через 4 минуты
serialize() передает данные типа index.php?item1=1&item2=1
а serializeArray() в формате json [{item1:1},{item2:1}]

Donald28 · 15.07.2014, 08:38

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
$("#myForm").submit(function(event) {
    event.preventDefault(); // прерываем отправку формы
    var data = $('#myForm').serialize();
        $.ajax({
            type: "POST",
            url:"name_files.php",
            data:data,
            error:function(){$("#content").html("<p>Произошла ошибка!</p>");},
            beforeSend: function() {
                $("#content").html('Загрузка...');
            },
            success: function(html){
                $("#content").html('Регистрация прошла успешно!');
            }
        });
        
        return false;
});

@Razip · 16.07.2014, 14:57

Donald28, В Вашем варианте можно убрать return false в конце обработчика, т.к. это использовалось для остановки отправки формы, но Вы использовали для этого:

JavaScript
1
event.preventDefault(); // прерываем отправку формы

@wredyatina · 16.07.2014, 14:59 **[ТС]**

Ребята, спасибо за советы, с работой завал получился(
сегодня вечером попробую, если не получиться отпишу и если получиться тоже)

@and_y87 · 16.07.2014, 16:16

wredyatina, Удачного опыта Вам

Новые блоги и статьи Все статьи Все блоги /
SDL3 для Web (WebAssembly): Синхронизация спрайтов SDL3 и тел Box2D 8Observer8 04.03.2026 Содержание блога Финальная демка в браузере. Итоговый код: finish-sync-physics-sprites-sdl3-c. zip На первой гифке отладочные линии отключены, а на второй включены:. . .	SDL3 для Web (WebAssembly): Идентификация объектов на Box2D v3 - использование userData и событий коллизий 8Observer8 02.03.2026 Содержание блога Финальная демка в браузере. Итоговый код: finish-collision-events-sdl3-c. zip https:/ / www. cyberforum. ru/ blog_attachment. php?attachmentid=11680&d=1772460536 Одним из. . .	Реалии Hrethgir 01.03.2026 Нет, я не закончил до сих пор симулятор. Эта задача сложнее. Не получилось уйти в плавсостав, но оно и к лучшему, возможно. Точнее получалось - но сварщиком в палубную команду, а это значит, в моём. . .	Ритм жизни kumehtar 27.02.2026 Иногда приходится жить в ритме, где дел становится всё больше, а вовлечения в происходящее — всё меньше. Плотный график не даёт вниманию закрепиться ни на одном событии. Утро начинается с быстрых,. . .
SDL3 для Web (WebAssembly): Сборка библиотек: SDL3, Box2D, FreeType, SDL3_ttf, SDL3_mixer и SDL3_image из исходников с помощью CMake и Emscripten 8Observer8 27.02.2026 Недавно вышла версия 3. 4. 2 библиотеки SDL3. На странице официальной релиза доступны исходники, готовые DLL (для x86, x64, arm64), а также библиотеки для разработки под Android, MinGW и Visual Studio. . . .	SDL3 для Web (WebAssembly): Реализация движения на Box2D v3 - трение и коллизии с повёрнутыми стенами 8Observer8 20.02.2026 Содержание блога Box2D позволяет легко создать главного героя, который не проходит сквозь стены и перемещается с заданным трением о препятствия, которые можно располагать под углом, как верхнее. . .	Конвертировать закладки radiotray-ng в m3u-плейлист damix 19.02.2026 Это можно сделать скриптом для PowerShell. Использование . \СonvertRadiotrayToM3U. ps1 <path_to_bookmarks. json> Рядом с файлом bookmarks. json появится файл bookmarks. m3u с результатом. # Check if. . .	Семь CDC на одном интерфейсе: 5 U[S]ARTов, 1 CAN и 1 SSI Eddy_Em 18.02.2026 Постепенно допиливаю свою "многоинтерфейсную плату". Выглядит вот так: https:/ / www. cyberforum. ru/ blog_attachment. php?attachmentid=11617&stc=1&d=1771445347 Основана на STM32F303RBT6. На борту пять. . .

@Razip 268 / 268 / 109 Регистрация: 22.08.2013 Сообщений: 907
	14.07.2014, 17:21
	wredyatina, не вижу ничего неправильного. Разве что html переменная в success-callback не используется, но это уже — придирки. 0

@wredyatina 2 / 0 / 1 Регистрация: 06.09.2011 Сообщений: 128
	14.07.2014, 17:22 [ТС]
	Охохохохо.... и как же найти косяк? 0

@Razip 268 / 268 / 109 Регистрация: 22.08.2013 Сообщений: 907
	14.07.2014, 17:24
	Стоит проверить путь до файла. Добавлено через 1 минуту wredyatina, покажите сайт, для начала. И подробнее опишите «уже ничего», т.к. обычно появляются ошибки в консоли разработчика, в Ajax-ответе может быть текст ошибки, в общем — много вариантов. 0

@esculap_ra 462 / 265 / 55 Регистрация: 22.08.2010 Сообщений: 1,204 Записей в блоге: 4
	14.07.2014, 18:22
	посмотри что приходит в $_POST скрипту обработчика. Добавлено через 4 минуты serialize() передает данные типа index.php?item1=1&item2=1 а serializeArray() в формате json [{item1:1},{item2:1}] 0

@wredyatina 2 / 0 / 1 Регистрация: 06.09.2011 Сообщений: 128
	16.07.2014, 14:59 [ТС]
	Ребята, спасибо за советы, с работой завал получился( сегодня вечером попробую, если не получиться отпишу и если получиться тоже) 0

@and_y87 Develo0per 424 / 368 / 75 Регистрация: 27.02.2012 Сообщений: 1,379 Записей в блоге: 98
	16.07.2014, 16:16
	wredyatina, Удачного опыта Вам 0