@sergemin

Как правильно составлять ajax запрос?

Из методов ajax в jquery пользуюсь только .load()
Не могу нормально разобраться с методом .ajax()
Там, где указывается url на сайтах и в документации чаще всего пишут ссылку на php обработчик. А если я не знаю php, но хочу сделать валидацию полей, то как поступить?
  • Вопрос задан
  • 566 просмотров
Решения вопроса 1
delphinpro
@delphinpro Куратор тега JavaScript
frontend developer
В любом случае на сервере должен быть обработчик вашей формы. Чаще всего это php, ввиду его широкой распространенности.

Валидацию формы можно (и нужно!) делать на клиенте. И лишь дублировать ее на сервере. Для валидации очень хорош плагин www.formvalidator.net
Подключаете и настраиваете плагин. Он не даст вам отправить форму с ошибками. И когда все поля заполнены правильно вы уже можете аяксом отправить свою форму на сервер.
Так можно отправить любую форму, кроме enctype=multipart/formdata
$('[data-toggle="ajax"]').on('submit', function (e) {
        e.preventDefault();
        var $form    = $(this);
        var data     = $form.serialize();
        var action   = $form.attr('action');
        var method   = $form.attr('method');

        $.ajax({
            url     : action,
            type    : method,
            data    : data,
            dataType: 'html' // или 'json' смотря какой ответ будете возвращать
        }).then(function (data) {
            console.log('Форма отправлена', data);
        }).fail(function () {
            console.log('Ошибка отправки');
        });
    });


Поясняю.
К формам, которые желаем отправлять аяксом, мы приписываем атрибут data-toggle="ajax".
Обработчик, куда будет отправляться форма, мы берем из атрибута action="" формы. Метод отправки (post/get) также берем из формы. Это дает определенную гибкость в использовании кода, когда значения не захардкоржены в скрипте. Если форма отправилась, то в методе then мы получим то, что вернет нам обработчик на сервере. Для большей гибкости предпочтительно использовать dataType: 'json'. Тогда вы сможете отправить с сервера объект с подробным статусом ответа, например результаты валидации каждого поля.
Если форма не отправилась сработает метод fail() Например, сервер вернул ответ не равный 200 или данные не соответствующие запрошенному типу (вы просили json, а пришел html).

C отправкой файлов чуть сложнее, но вы сначала с этим разберитесь.
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
NodeJS?
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы