Маленькие хитрости UMI.CMS. Эпизод 2

Как я и обещал, мы продолжим публикации полезных рецептов для создания красивых и удобных сайтов на UMI.CMS. Сегодня я расскажу вам как сделать проверку полей в форме обратной связи и как импортировать товары из одной языковой версии в другую. Итак, моем руки, повязываем фартук, включаем приятную музыку и...

Рецепт №1.
Вас утомили посетители, которые в форме обратной связи не указывают свое имя, или же вы потеряли клиента, который забыл указать свой контактный e-mail? Первый наш рецепт поможет вам создать проверку полей формы обратной связи на заполненность, и кроме того, мы сделаем проверку поля с обратным адресом на правильность заполнения.

Следует оговориться - приведенный ниже рецепт действителен для вывода формы с помощью макроса % webforms insert %. Для макроса % webforms add % решение будет чуть позже.

Первым делом следует открыть для редактирования шаблон ~tpls/webforms/default.tpl (если вы, конечно, используете именно этот шаблон). В нем надо найти блок ['webforms_block'] и сразу перед формой (тег <form>) вставить небольшой скрипт:

<script type="text/javascript">
function checkForm(obj, elems) {
var element, pattern;
var reg = new RegExp("[0-9a-z_]+@[0-9a-z_^.]+\\.[a-z]{2,3}", 'i');
        for (var i = 0; i < obj.elements.length; i++) {
                element = obj.elements[i];      
                if (elems != undefined) 
                if (elems.join().indexOf(element.type) < 0) continue;       
                if (!element.getAttribute("required")) continue;   
                if (pattern = element.getAttribute("check_pattern")) {
                        pattern = new RegExp(pattern, "g"); 
                        if (!pattern.test(element.value)) { 
                                alert(element.getAttribute("required"));   
                                element.focus();        
                                return false;   
                        }   
                }
                else if(/^\s*$/.test(element.value)) {
                        alert(element.getAttribute("required"));       
                        element.focus();    
                        return false;       
                }
                if (null!=element.getAttribute("mail"))
                if (!reg.test(element.value)) {
                        alert(element.getAttribute("mail"));
                        element.focus(); 
                        return false;
                }
        }
        return true;
}
</script>

Ну, а дальше все просто - стандартную строку

<form method="post" action="/webforms/post/">

надо заменить на

<form method="post" action="/webforms/post/"  onsubmit="return checkForm(this);" id="webForm">

а к тегам, отвечающим за вывод полей (<input> и <textarea>), добавить параметр required="Заполните поле Сообщение". Таким образом получим примерно такой код:

<form method="post" action="/webforms/post/" 
 onsubmit="return checkForm(this);" id="webForm">
<table border="0" width="100%">
<tr>
<td width="40%">Куда отправить:</td>
<td></td>
</tr>
<tr>
<td>Ваше имя:</td>
<td>
<input type="text" name="data[fname]" class="textinputs" required="Заполните поле Ваше имя" />
</td>
</tr>
<tr>
<td>Ваш e-mail:</td>
<td>
<input type="text" name="data[email_from]" class="textinputs" 
 required="Заполните поле Ваш e-mail" mail="Введен неверный адрес электронной почты" />
</td>
</tr>
<tr>
<td colspan="2">Сообщение:</td>
</tr>
<tr>
<td colspan="2">
<textarea name="message" class="textinputs" style="width: 385px; height: 200px;" 
 required="Заполните поле Сообщение"></textarea>
</td>
</tr>
% system captcha() %
</table>
<p><input type="submit" value="Отправить" /></p>
</form>

Обратите внимание, для поля "Ваш e-mail" мы указали дополнительный параметр mail="Введен неверный адрес электронной почты". Это сделано для вывода предупреждающего сообщения в случае, если е-меил не соответствует виду adress@postservice.com.

Рецепт №2.
Сайты с несколькими языковыми версиями обычно делаются по-порядку: сначала создается русская версия, а затем английская. Для того, чтобы вам не пришлось воссоздавать структуру сайта в английской версии, мы создали скрипт, который осуществит клонирование нужных разделов. Конечно, данная технология требует доработки, поскольку полностью струкутру за один раз не склонировать, но она может существенно помочь разработчикам многоязычных сайтов.

Первым делом скачайте скрипт и поместите его в корневую директорию вашего сайта. Затем, запустите его из адресной строки браузера (domainname.ru/clone-to-lang.php). В появившеся окне укажите URL раздела на сайте, который вы бы хотели клонировать в другую языковую версию, а в списке языков выберите тот, в который будет осуществляться перенос. Жмем кнопку "Клонировать" и достаем русско-английский* словарь :)

Вот такие пироги, друзья.
До новых встреч!

*в зависимости от создаваемых языковых версий словари могут изменяться!

Скрипт клонирования был написан и любезно передан в пользование нашим товарищем системным аналитиком Ефимом Жилиным. Все восхищения и благодарности прошу адресовать ему :)