Как реализовать валидацию полей формы по Ajax

International Russian
1

День добрый!

Начал разбираться с фреймворком, это мой первый опыт в MVC на PHP, до сегодняшнего дня знаком был с этой технологией по опыту программирования на Cocoa для Макинтоша.

Вопрос собственно, как красиво сделать проверку формы по ajax, чтобы не перегружать всю форму, а получать сообщение о неправильном поле и выводить его в div контейнер. Например здесь https://twitter.com/signup сделана проверка доступности username (попробуйте в поле username ввести ae).

Если ставить задачу шире, то можно и не только результат проверки выводить но и перегружать отображение формы при успешном submit-e.

Искал в документации и примерах но ничего подходящего не нашел. Спасибо заранее!

2

Если простая валидация полей без отправки всех данных - просто вешаем действие ajax.post($(this).value) на то что кликнул и передаем в какой то контроллер где экшин обработает пришедшие данные и вернет ошибка это или поле заполнено верно. после этого в js проверяете что пришло в ответ и решаете формировать ошибку или же пропускать дальше к работе. всё просто

3

в ниже приведенном скрипте делается подзагрузка

списка городов для определ. страны. поковыряйся.

( вообщето наверно вопрос не совсем по теме Yii )

в твоей ссылке примера проверка привязаны к событию

onblur инпута

для вывода сообщ. делай так:

[tt]document.getElementById('id твоего div').innerHTML = 'текст ошибки';[/tt]

[tt]//срабатывает на onchange элемента select

    function loadCities(country_id) {

        loadDoc('cities/list/'+country_id);

    }

    var req = null;

//запрос

    function loadDoc(url) {

        req = (typeof(window.ActiveXObject)=='undefined' ? new XMLHttpRequest : new ActiveXObject("Microsoft.XMLHTTP"));

        req.onreadystatechange = processReqChange;

        req.open("GET", url);

        req.send(null);

    }

//обработка ответа

    function processReqChange() {

        if ((req.readyState == 4) && (req.status == 200)) {

            alert(req.responseText); //test

            //

            //  тута изголяйся как хошь

            //

            req = null;

        }

    }[/tt]