Инструменты пользователя
решения:взаимодействие_по_ajax
Различия
Здесь показаны различия между двумя версиями данной страницы.
| Предыдущая версия справа и слева Предыдущая версия Следующая версия | Предыдущая версия | ||
|
решения:взаимодействие_по_ajax [2018/11/21 04:04] a1 [Отправка файла] |
решения:взаимодействие_по_ajax [2023/06/03 04:39] (текущий) gear |
||
|---|---|---|---|
| Строка 1: | Строка 1: | ||
| ====== Взаимодействие по AJAX ====== | ====== Взаимодействие по AJAX ====== | ||
| Взаимодействие по AJAX с клиентской стороны реализуется функцией ''w_core.request'' | Взаимодействие по AJAX с клиентской стороны реализуется функцией ''w_core.request'' | ||
| - | По идеологии Wmart, событие должно быть привязано к тегу с атрибутом ''data-action'' | ||
| - | Все объекты, над которыми выполняется действие программно, должны иметь атрибут ''data-type'' | ||
| - | Поля, для которых необходима проверка значения помечаются атрибутом ''data-field''. | ||
| Строка 18: | Строка 15: | ||
| ''/assets/js/somebody.js'' | ''/assets/js/somebody.js'' | ||
| <code javascript> | <code javascript> | ||
| - | $('[data-action="sombody.action"]').on('submit', function(e){ | + | document.querySelector('[data-action="sombody.action"]').addEventListener('submit', (e)=>{ |
| e.preventDefault(); //исключаем действие по умолчанию | e.preventDefault(); //исключаем действие по умолчанию | ||
| - | var form = $(this); //получаем форму | + | let elForm = e.target; //получаем элемент формы |
| - | var request = $(this).formObject(); //получаем данные из формы | + | let requestData = new FormData(elForm); //получаем данные из формы |
| - | wmart.request('somebody.action',request,function(response){ | + | w_core.request('somebody.action',requestData,function(responseData){ |
| - | form.formErrors(response.errors); //обрабатываем результат проверки | + | w_core.formErrors(elForm, responseData.errors); //обрабатываем результат проверки |
| - | console.log(response.info); //выводим в консоль переданную переменную info | + | console.log(responseData.info); //выводим в консоль переданную переменную info |
| }); | }); | ||
| }); | }); | ||
| Строка 32: | Строка 29: | ||
| <code php> | <code php> | ||
| function somebodyAction() { | function somebodyAction() { | ||
| - | $result = new w_result($this); //получение объекта результата запроса | + | $response = w_response::load($this); //получение объекта результата запроса |
| $field1 = w_input::int('field1'); //получаем поле field1 как число | $field1 = w_input::int('field1'); //получаем поле field1 как число | ||
| $field2 = w_input::text('field2'); //получаем поле field2 как текст | $field2 = w_input::text('field2'); //получаем поле field2 как текст | ||
| - | $result->errorField($field1, 'somebody.field1', 'Поле field1 заполнено неверно'); | + | $response->errorField($field1, 'somebody.field1', 'Поле field1 заполнено неверно'); |
| - | $result->errorField($field2, 'somebody.field2', 'Поле field2 заполнено неверно'); //проверка полей | + | $response->errorField($field2, 'somebody.field2', 'Поле field2 заполнено неверно'); //проверка полей |
| - | if (!$result->fail) { //проверяем, если валидация прошла успешно | + | if (!$response->fail) { //проверяем, если валидация прошла успешно |
| - | $result->info = 'Все ок!'; //передаем переменную info | + | $response->info = 'Все ок!'; //передаем переменную info |
| } | } | ||
| | | ||
| - | $result->exec(); //Отправляем данные | + | $response->exec(); //Отправляем данные |
| } | } | ||
| </code> | </code> | ||
| Строка 50: | Строка 47: | ||
| ===== Передача запроса при клике по ссылке или кнопке ===== | ===== Передача запроса при клике по ссылке или кнопке ===== | ||
| <code javascript> | <code javascript> | ||
| - | $('[data-action="sombody.action"]').on('click', function(e){ | + | document.querySelector('[data-action="sombody.action"]').addEventListener('click', (e)=>{ |
| e.preventDefault(); //исключаем действие по умолчанию | e.preventDefault(); //исключаем действие по умолчанию | ||
| - | var obj = $(this); //ссылка | + | let elBtn = e.target; //получаем элемент ссылки |
| - | var request = $(this).attrObject(); //получаем data-атрибуты ссылки | + | let requestData = Object.assign({},elBtn.dataset); //получаем data-атрибуты ссылки |
| - | wmart.request('somebody.action',request,function(response){ | + | w_core.request('somebody.action',requestData,function(responseData){ |
| - | console.log(response.result); //выводим поле result из ответа | + | console.log(requestData.info); //выводим в консоль переданную переменную info |
| }); | }); | ||
| }); | }); | ||
решения/взаимодействие_по_ajax.1542762280.txt.gz · Последние изменения: 2018/11/21 04:04 — a1
Инструменты страницы
Если не указано иное, содержимое этой вики предоставляется на условиях следующей лицензии: CC Attribution-Share Alike 4.0 International
