Open Constructor | Использование форм в Open Constructor

В Open Constructor имеется удобный обработчик форм, который берёт на себя всю работу по отправке писем, валидацию формы на основе регулярных выражений и многое другое. Остаётся только написать html форму.

Для создания кода формы используется «Включение шаблона», для этого во вкладке «Шаблоны» открываем Разное / Включение шаблона, создаём шаблон и пишем в него HTML код формы.

В качестве примера возьмем такую форму

HTML код формы:

{set cid = $ctx->newCaptchaId()}
<br />
Все поля, выделенные <b>жирным</b>, обязательны для заполнения.<br><br />
<form action="/contact-us/submit/?cid={$cid}" method="post">
    <table>
        <tr>
        <td valign="top"><b>Ваше имя</b></td>
        <td>
            <input name="name" type="text" size="35" value="{$smarty.get.name|escape}">
            {if $smarty.get.failed.name}
                <div class="error">{$smarty.get.failed.name}</div>
            {/if}
        </td>
        </tr>
        <tr>
        <td valign="top"><b>E-mail</b></td>
        <td>
            <input name="email" type="text" size="35" value="{$smarty.get.email|escape}">
            {if $smarty.get.failed.email}
                <div class="error">{$smarty.get.failed.email}</div>
            {/if}
        </td>
        </tr>
        <tr>
        <td valign="top"><b>Сообщение</b></td>
        <td>
            <textarea name="message" rows=5 cols=40 wrap="off"></textarea>
            {if $smarty.get.failed.message}
                <div class="error">{$smarty.get.failed.message}</div>
            {/if}
        </td>
        </tr>
    </table>
    <br>
    <table>
        <tr>
            <td>Пожалуйста, введите текст,<br> изображенный на картинке:</td>
            <td>
                <img src="/res/captcha/{$cid}.png" style="border: 1px solid #000; margin-top: 5px;" onclick="this.src = '/res/captcha/{$cid}.png?' + (new Date()).getTime();">
            </td>
            <td>
                <input type="text" style="margin: 0 10px;" name="f_cid">
                {if $smarty.get.failed.f_cid}
                    <div class="error" style="margin: 0 10px;">{$smarty.get.failed.f_cid}</div>
                {/if}
            </td>
            <td><input src="/images/otpravit.gif" style="margin-left: 30px;" type="image"></td>
        </tr>
    </table>
</form>

В примере форма находится на странице /contact-us/, в параметре формы «action» указано /contact-us/submit/, где форма будет обработана объектом «Отправка писем» (описано далее).

Далее создаём объект Разное / Включение шаблона и связываем этот объект с созданным шаблоном.

При нажатии кнопки «Отправить», данные формы будут отправлены на /contact-us/submit/.

На странице /contact-us/submit/ нужно поставить объект «Отправка писем», но сначала создадим для этого объекта шаблон.
Перейдем во вкладку «Шаблоны», откроем Разное / Включение шаблона, создадим шаблон и напишем в него HTML код письма (для упрощения работы лучше взять за основу шаблон по умолчанию).

<html>
    <head>
        <title>Отправка сообщения</title>
        <meta http-equiv="Content-Type" content="text/html; charset={$charset}">
    </head>
    <body>
        Имя: {$msg.name|escape}<br>
        E-mail: {$msg.email}<br>
        Сообщение:<br> {$msg.message|nl2br|escape}
    </body>
</html>

После создания шаблона во вкладке «Объекты» создаётся объект Разное / Отправка писем.

В данном объекте задаются все основные параметры. Объект настраивается следующим образом: