Вебформы на ajax xslt - История изменений

Alexei в 11:30, 17 февраля 2016

2016-02-17T11:30:13Z

Mad grant в 10:40, 5 июня 2013

2013-06-05T10:40:12Z

Deez в 20:10, 2 сентября 2012

2012-09-02T20:10:51Z

Deez в 20:08, 2 сентября 2012

2012-09-02T20:08:52Z

Deez в 20:08, 2 сентября 2012

2012-09-02T20:08:08Z

Deez в 20:07, 2 сентября 2012

2012-09-02T20:07:48Z

Deez в 20:06, 2 сентября 2012

2012-09-02T20:06:29Z

Deez: Новая страница: «Сейчас мы в несколько довольно несложных действий заставим нашу вебформу, добавленную с п…»

2012-09-02T19:55:18Z

Новая страница: «Сейчас мы в несколько довольно несложных действий заставим нашу вебформу, добавленную с п…»

Новая страница

Сейчас мы в несколько довольно несложных действий заставим нашу вебформу, добавленную с помощью модуля обратная связь работать без перезагрузки страницы.
В этом нам поможет jquery плагин Form.
Для начала открываем шаблон, где размещается шапка необходимой нам страницы и между тэгами head, в самом низу добавляем строчки
<source lang="php">

<script src="http://malsup.github.com/jquery.form.js" type="text/javascript"></script>

</source>
Внимание строчка обязательно должна быть ниже макроса
<source lang="php">
<xsl:value-of select="document('udata://system/includeQuickEditJs')/udata" disable-output-escaping="yes" />
</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>
Всё, теперь форма у нас работает без перезагрузки страницы.

Внимание, работа данного метода проверена на версии 2.8.5.3, если ваша версия ниже, работа этого метода не гарантирована.

@@ Строка 1: / Строка 1: @@
 Сейчас мы в несколько довольно несложных действий заставим нашу вебформу, добавленную с помощью модуля обратная связь работать без перезагрузки страницы.
 В этом нам поможет jquery плагин Form.
@@ Строка 64: / Строка 66: @@
 Инструкцию для tpl шаблонизатора вы можете найти по адресу [http://wiki.umisoft.ru/Вебформы_на_ajax_tpl Вебформы на ajax tpl]

← Предыдущая		Версия 20:10, 2 сентября 2012
Строка 62:		Строка 62:

	Внимание, работа данного метода проверена на версии 2.8.5.3, если ваша версия ниже, работа этого метода не гарантирована.		Внимание, работа данного метода проверена на версии 2.8.5.3, если ваша версия ниже, работа этого метода не гарантирована.
		+
		+	Инструкцию для tpl шаблонизатора вы можете найти по адресу [http://wiki.umisoft.ru/Вебформы_на_ajax_tpl Вебформы на ajax tpl]

@@ Строка 18: / Строка 18: @@
 Открываем его.(если у вас шаблон demodizzy, то он находиться по адресу /xsltTpls/modules/webforms/add.xsl)
 и фрагмент кода
-<source lang="xsl">
+<source lang="xml">
 <xsl:template match="udata[@module = 'webforms'][@method = 'add']">
 		<form method="post" action="{$lang-prefix}/webforms/send/" onsubmit="site.forms.data.save(this); return site.forms.data.check(this);" enctype="multipart/form-data">
@@ Строка 35: / Строка 35: @@
 </source>
 заменяем на вот такой
-<source lang="xsl">
+<source lang="xml">
 <xsl:template match="udata[@module = 'webforms'][@method = 'add']">
 		<form id="umi_the_best" method="post" action="{$lang-prefix}/webforms/send/" onsubmit="site.forms.data.save(this); return site.forms.data.check(this);" enctype="multipart/form-data">

@@ Строка 18: / Строка 18: @@
 Открываем его.(если у вас шаблон demodizzy, то он находиться по адресу /xsltTpls/modules/webforms/add.xsl)
 и фрагмент кода
-<source lang="xslt">
+<source lang="xsl">
 <xsl:template match="udata[@module = 'webforms'][@method = 'add']">
 		<form method="post" action="{$lang-prefix}/webforms/send/" onsubmit="site.forms.data.save(this); return site.forms.data.check(this);" enctype="multipart/form-data">
@@ Строка 35: / Строка 35: @@
 </source>
 заменяем на вот такой
-<source lang="xslt">
+<source lang="xsl">
 <xsl:template match="udata[@module = 'webforms'][@method = 'add']">
 		<form id="umi_the_best" method="post" action="{$lang-prefix}/webforms/send/" onsubmit="site.forms.data.save(this); return site.forms.data.check(this);" enctype="multipart/form-data">

@@ Строка 18: / Строка 18: @@
 Открываем его.(если у вас шаблон demodizzy, то он находиться по адресу /xsltTpls/modules/webforms/add.xsl)
 и фрагмент кода
-<source lang="php">
+<source lang="xslt">
 <xsl:template match="udata[@module = 'webforms'][@method = 'add']">
 		<form method="post" action="{$lang-prefix}/webforms/send/" onsubmit="site.forms.data.save(this); return site.forms.data.check(this);" enctype="multipart/form-data">
@@ Строка 32: / Строка 32: @@
 			</div>
 		</form>
-	</xsl:template>
+</xsl:template>
 </source>
 заменяем на вот такой
-<source lang="php">
+<source lang="xslt">
 <xsl:template match="udata[@module = 'webforms'][@method = 'add']">
 		<form id="umi_the_best" method="post" action="{$lang-prefix}/webforms/send/" onsubmit="site.forms.data.save(this); return site.forms.data.check(this);" enctype="multipart/form-data">
@@ Строка 57: / Строка 57: @@
 			});
 		</script>
-	</xsl:template>
+</xsl:template>
 </source>
 Всё, теперь форма у нас работает без перезагрузки страницы.
 Внимание, работа данного метода проверена на версии 2.8.5.3, если ваша версия ниже, работа этого метода не гарантирована.

@@ Строка 53: / Строка 53: @@
 		<script type="text/javascript">
-			$(document).ready(function(){
+                    $(document).ready(function(){
-			   $("#umi_the_best").ajaxForm(function() {
+                        $("#umi_the_best").ajaxForm(function() {
-				 alert("Спасибо за ваш отзыв!");
+                            alert("Спасибо за ваш отзыв!");
-			   });
+                            jQuery("#umi_the_best").trigger("reset");
-			});
+                        });
-		</script>
+                    });
 </xsl:template>
 </source>

@@ Строка 11: / Строка 11: @@
 <xsl:value-of select="document('udata://system/includeQuickEditJs')/udata" disable-output-escaping="yes" />
 </source>
-Всё, с шапкой закончили, так как сам jquery у нас уже подключен, макросами
+Всё, с шапкой закончили, так как сам jquery у нас уже подключен, макросом
 <source lang="php">
-%system includeQuickEditJs()%
+<xsl:value-of select="document('udata://system/includeQuickEditJs')/udata" disable-output-escaping="yes" />
 </source>
 Теперь переходим к шаблону вебформ.
-Открываем его.(если вы ничего не меняли, то он находиться по адресу /tpls/data/reflection/webforms.tpl)
+Открываем его.(если у вас шаблон demodizzy, то он находиться по адресу /xsltTpls/modules/webforms/add.xsl)
-и имеющийся код
+и фрагмент кода
 <source lang="php">
-<form enctype="multipart/form-data" method="post" action="%pre_lang%/webforms/send/">
+<xsl:template match="udata[@module = 'webforms'][@method = 'add']">
-	<input type="hidden" name="system_form_id" value="%form_id%" />
+		<form method="post" action="{$lang-prefix}/webforms/send/" onsubmit="site.forms.data.save(this); return site.forms.data.check(this);" enctype="multipart/form-data">
-	<input type="hidden" name="system_template" value="%template%" />
+			<xsl:apply-templates select="items" mode="address" />
-	<input type="hidden" value="%pre_lang%/webforms/posted/" name="ref_onsuccess">
+			<xsl:apply-templates select="groups/group" mode="webforms" />
-	%address_select%
+			<input type="hidden" name="system_form_id" value="{/udata/@form_id}" />
-	%groups%
+			<input type="hidden" name="ref_onsuccess" value="{$lang-prefix}/webforms/posted/{/udata/@form_id}/" />
-</form>
+			<div class="form_element">
 </source>
 заменяем на вот такой
 <source lang="php">
-<form id="umi_the_best" enctype="multipart/form-data" method="post" action="%pre_lang%/webforms/send/">
+<xsl:template match="udata[@module = 'webforms'][@method = 'add']">
-	<input type="hidden" name="system_form_id" value="%form_id%" />
+		<form id="umi_the_best" method="post" action="{$lang-prefix}/webforms/send/" onsubmit="site.forms.data.save(this); return site.forms.data.check(this);" enctype="multipart/form-data">
-	<input type="hidden" name="system_template" value="%template%" />
+			<xsl:apply-templates select="items" mode="address" />
-	<input type="hidden" value="%pre_lang%/webforms/posted/" name="ref_onsuccess">
+			<xsl:apply-templates select="groups/group" mode="webforms" />
-	%address_select%
+			<input type="hidden" name="system_form_id" value="{/udata/@form_id}" />
-	%groups%
+			<input type="hidden" name="ref_onsuccess" value="{$lang-prefix}/webforms/posted/{/udata/@form_id}/" />
-</form>
+			<div class="form_element">
+				<xsl:apply-templates select="document('udata://system/captcha/')/udata" />
-<script type="text/javascript">
+			</div>
-	$(document).ready(function(){
+			<div class="form_element">
-	   $("#umi_the_best").ajaxForm(function() {
+				<input type="submit" class="button" value="Отправить" />
-	     alert("Спасибо за ваш отзыв!");
+			</div>
-	   });
+		</form>
-	});
-</script>
+		<script type="text/javascript">
 </source>
 Всё, теперь форма у нас работает без перезагрузки страницы.
 Внимание, работа данного метода проверена на версии 2.8.5.3, если ваша версия ниже, работа этого метода не гарантирована.