Вебформы на ajax tpl — различия между версиями
Deez (обсуждение | вклад) (Новая страница: «Сейчас мы в несколько довольно несложных действий заставим нашу вебформу, добавленную с п…») |
Deez (обсуждение | вклад) |
||
| Строка 1: | Строка 1: | ||
Сейчас мы в несколько довольно несложных действий заставим нашу вебформу, добавленную с помощью модуля обратная связь работать без перезагрузки страницы. | Сейчас мы в несколько довольно несложных действий заставим нашу вебформу, добавленную с помощью модуля обратная связь работать без перезагрузки страницы. | ||
В этом нам поможет jquery плагин Form. | В этом нам поможет jquery плагин Form. | ||
| − | Для начала открываем шаблон, где размещается шапка необходимой нам страницы и между тэгами head, в самом низу добавляем | + | Для начала открываем шаблон, где размещается шапка необходимой нам страницы и между тэгами head, в самом низу добавляем строчки |
| + | <source lang="php"> | ||
<!-- ajax jquery Forms --> | <!-- ajax jquery Forms --> | ||
<script src="http://malsup.github.com/jquery.form.js" type="text/javascript"></script> | <script src="http://malsup.github.com/jquery.form.js" type="text/javascript"></script> | ||
<!-- end ajax jquery forms --> | <!-- end ajax jquery forms --> | ||
| + | <source> | ||
Внимание строчка обязательно должна быть выше макросов | Внимание строчка обязательно должна быть выше макросов | ||
| + | <source lang="php"> | ||
%system includeQuickEditJs()% | %system includeQuickEditJs()% | ||
%system includeEditInPlaceJs()% | %system includeEditInPlaceJs()% | ||
| + | <source> | ||
Всё, с шапкой закончили, так как сам jquery у нас уже подключен, макросами | Всё, с шапкой закончили, так как сам jquery у нас уже подключен, макросами | ||
| + | <source lang="php"> | ||
%system includeQuickEditJs()% | %system includeQuickEditJs()% | ||
%system includeEditInPlaceJs()% | %system includeEditInPlaceJs()% | ||
| − | + | <source> | |
Теперь переходим к шаблону вебформ. | Теперь переходим к шаблону вебформ. | ||
Открываем его.(если вы ничего не меняли, то он находиться по адресу /tpls/data/reflection/webforms.tpl) | Открываем его.(если вы ничего не меняли, то он находиться по адресу /tpls/data/reflection/webforms.tpl) | ||
и имеющийся код | и имеющийся код | ||
| + | <source lang="php"> | ||
<form enctype="multipart/form-data" method="post" action="%pre_lang%/webforms/send/"> | <form enctype="multipart/form-data" method="post" action="%pre_lang%/webforms/send/"> | ||
<input type="hidden" name="system_form_id" value="%form_id%" /> | <input type="hidden" name="system_form_id" value="%form_id%" /> | ||
| Строка 22: | Строка 28: | ||
%groups% | %groups% | ||
</form> | </form> | ||
| − | + | <source> | |
заменяем на вот такой | заменяем на вот такой | ||
| − | + | <source lang="php"> | |
| − | <form enctype="multipart/form-data" method="post" action="%pre_lang%/webforms/send/"> | + | <form id="umi_the_best" enctype="multipart/form-data" method="post" action="%pre_lang%/webforms/send/"> |
<input type="hidden" name="system_form_id" value="%form_id%" /> | <input type="hidden" name="system_form_id" value="%form_id%" /> | ||
<input type="hidden" name="system_template" value="%template%" /> | <input type="hidden" name="system_template" value="%template%" /> | ||
| Строка 33: | Строка 39: | ||
</form> | </form> | ||
| + | <script type="text/javascript"> | ||
| + | $(document).ready(function(){ | ||
| + | $("#umi_the_best").ajaxForm(function() { | ||
| + | alert("Спасибо за ваш отзыв!"); | ||
| + | }); | ||
| + | }); | ||
| + | </script> | ||
| + | <source> | ||
Всё, теперь форма у нас работает без перезагрузки страницы. | Всё, теперь форма у нас работает без перезагрузки страницы. | ||
Версия 19:44, 2 сентября 2012
Сейчас мы в несколько довольно несложных действий заставим нашу вебформу, добавленную с помощью модуля обратная связь работать без перезагрузки страницы. В этом нам поможет jquery плагин Form. Для начала открываем шаблон, где размещается шапка необходимой нам страницы и между тэгами head, в самом низу добавляем строчки <source lang="php"> <script src="http://malsup.github.com/jquery.form.js" type="text/javascript"></script> <source> Внимание строчка обязательно должна быть выше макросов <source lang="php"> %system includeQuickEditJs()% %system includeEditInPlaceJs()% <source> Всё, с шапкой закончили, так как сам jquery у нас уже подключен, макросами <source lang="php"> %system includeQuickEditJs()% %system includeEditInPlaceJs()% <source> Теперь переходим к шаблону вебформ. Открываем его.(если вы ничего не меняли, то он находиться по адресу /tpls/data/reflection/webforms.tpl) и имеющийся код <source lang="php"> <form enctype="multipart/form-data" method="post" action="%pre_lang%/webforms/send/"> <input type="hidden" name="system_form_id" value="%form_id%" /> <input type="hidden" name="system_template" value="%template%" /> <input type="hidden" value="%pre_lang%/webforms/posted/" name="ref_onsuccess"> %address_select% %groups% </form> <source> заменяем на вот такой <source lang="php"> <form id="umi_the_best" enctype="multipart/form-data" method="post" action="%pre_lang%/webforms/send/"> <input type="hidden" name="system_form_id" value="%form_id%" /> <input type="hidden" name="system_template" value="%template%" /> <input type="hidden" value="%pre_lang%/webforms/posted/" name="ref_onsuccess"> %address_select% %groups% </form>
<script type="text/javascript"> $(document).ready(function(){ $("#umi_the_best").ajaxForm(function() { alert("Спасибо за ваш отзыв!"); }); }); </script> <source> Всё, теперь форма у нас работает без перезагрузки страницы.
