Отменить отправку формы по enter. Отправление Ajax запроса
Иногда нужно переделать стандартное поведение элементов HTML документа.
Ну и так уже сложилось что заказчик хочет чтоб страница не перегружалась.
Стандартно валидация введеных даных проводится методами JavaScript, Jquery и т.д. тоесть на стороне клиента.
Но что нужно делать когда нужно провести сложную валидацию с обращением в БД? В помощь разработчику приходит Ajax запрос.
Что делаем:
1) проверяем нажат ли в форме enter
2) отправляем запрос
3) принимаем и разбираем ответ
4) запрещаем выполнение стандартного поведения.
$(document).ready(function(){//когда документ подгружен $('#form_id').keydown(function(event){ // при нажатии в форме с id="form_id" клавиши enter if(event.keyCode==13){//код enter //если нужно отправить Ajax запрос var OurUrl='/testfolder/test_file.php';//путь к файлу в котором будут производится проверки var options=[];//обьявим масив $.each($("input[type=checkbox]:checked"),function(){ options.push($(this).attr('name'));//наполняем масив полями "name" отмеченых checkbox(например) }); $.ajax({ type: 'POST',//определяем метод запроса data:{data : options},//данные для передачи url: OurUrl, success: function (data) {//при успешном выполнении $('#response_container').html(data);//записать ответ в элемент с id="response_container" //или когда пришла не распарсеная строка var obj = JSON.parse(data);//распарсим if (obj.STATUS=='OK'){//проверка $('.adm-info-message-green').show();//какие-то действия }else{ $('.adm-info-message-red').show();//какие-то действия } } }); //конец вызова event.preventDefault();//отменить стандартные действия return false; } }); });
Оставить комментарий