Примеры сниппета eForm для создание обратной связи, заказа звонка, оформление заказа товаров на Evolution CMS.
Ситуация, когда надо вывести форму в модальном окне довольно частая. Выведем форму в модальном окне Bootstrap 3.
Модальное окно будет выглядеть примерно так:
Чанк tplForm:
<form method="post" action="04_extras/eform/10_primery.html" name="Form" id="Form">
...
</form>
Чанк tplThank:
Ваше сообщение отправлено.
Ну и последний штрих, нужно разместить примерно такой скрипт:
<script>
$(function(){
$(document).on("submit","#Form",function(e){
e.preventDefault();
var m_method=$(this).attr('method');
var m_action=$(this).attr('action');
var m_data=$(this).serialize();
$.ajax({
type: m_method,
url: m_action,
data: m_data,
resetForm: 'true',
success: function(result){
var data = $(result).find("#myModal_form").html();
$("#myModal_form").html(data);
}
});
});
});
</script>
Создаем примерно такой вызов eForm, обернут в диве с id ajaxContactForm - обротите внимание что по этому id и будет вся привязка.
Тут конечно можно ставить сразу форму без вызова через eForm, её же полюбому оброботает плагин.
, - ТВ переменные сайта сохранённые в системной таблицы с помощью плагина CfgTv.
[!eForm? &formid=`contactForm` &subject=`Сообщение с сайта EvoDOC` &tpl=`formTpl` &errorTpl=`errorTpl` &report=`reportTpl` &thankyou=`thankyouTpl` &gotoid=`244` &vericode=`0` &from=`` &to=`` !]
Скрипт Ajax обработки
Создаем плагин например AjaxSubmit который срабатывает на событие OnPageNotFound
switch($_GET['q']){
case 'ajaxContactForm':
echo $modx->runSnippet(
'eForm',
array(
'formid' => 'contactForm',
'subject' => 'Сообщение с сайта EvoDOC',
'tpl' => 'formTpl',
'report' => 'reportTpl',
'thankyou' => 'thankyouTpl',
'errorTpl' => 'errorTpl',
'vericode' => 0,
'protectSubmit' => '0',
'from' => '',
'to' => ''
)
);
die();
break;
}