Создание форм и формул

Для работы необходим mootools, поэтому если в вашем шаблоне нет mootools.js необходимо его подключить.

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

К переменным шаблона относятся все переменные заключенные в фигурные скобки: {primer}.

Что это значит: если присвоить селекту переменную {x}, а чекбоксу {y}, а потом в формуле написать так rez={x} + {y}, а в шаблоне письма вставить {rez}, то на почту придет письмо в котором будет сумма выбранного селекта и чекбокса. Ну вот в вкратце так. Теперь подробно.

Все элементы формы имеют параметр name, который и будет соответствовать аналогичной переменой в шаблоне форм и шаблоне построения формул, при этом как вы ее назовете не важно, главное в английской раскладке. Поясню.

К примеру в вашей форме есть поле для ввода количества единиц продукции:

Количество: < input type="text" name="amount" >

Здесь параметр name="amount", поэтому и в формуле и в шаблоне мы будем использовать переменную {amount}.

Но по мимо переменных соответствующих элементам форм, вы в шаблонах можете использовать переменные результаты.

Дня наибольшей наглядности приведем пример.

Шаблон формы:

Количество: < input type="text" name="amount" >
Цена: <input type="text" name="price" >

Всего: {result1} Скидка: {discount}
Выслать результат на email: <input type="text" name="mailto" >
{CAPTCHA}

<input type="submit" value="Рассчитать и выслать результаты"/>

Формула для шаблона:

result1={amount}*{price}
discount={price}/{amount}

Так же, как вы заметили из примера выше существует еще:

• один тип поля параметр name которого равен mailto: <input type="text" name="mailto" >, это означает что в этом поле пользователь должен вести свой емайл для отправки результатов себе на мыло.
• и одна переменная {CAPTCHA} вместо которой будут подставляться капча.

При создании шаблона, как мы выдим выше, формул может быть несколько, при этом результат одной формулы может служить одним из аргументов второй пример поля формулы (если вы используете не целые числа 0.18, то для разделения целой и дробной части служит точка, не запятая как мы привыкли):

rez={ws}*10+{sw}*20+{pr}*30+{so}*40+{at}*50

nds=0.18*rez

В разделе " Скачать Компонент + решения " помимо скачки, самого компонента, можно скачать шаблоны готовых решений под различные варианты, с подродной инструкцией по устоновки, часть из которых представлен в разделе " Демонстрация работы ". Планируется постоянно пополнять раздел готовые решения.

И еще один момент.

Когда речь идет о формах, то сразу возникает вопросы: А как сделать: обязательные поля, проверку на правильность введения емайла и многое другое… Как раз об этом и пойдет речь в разделе " Создание интелектуальных форм ".

Каскад формул (использование результата одной формулы в другой):

Еще остался один вопрос по поводу каскада формул, тоесть когда результат вычисления одной фоормулы становится аргументом другой. При этом на странице вы выводите торлько ОБЪЕМ.

visota={w}*{v}+23

obem=visota*{sq}+visota/3

В формулах выше видно, что результат вычисления используется в двух местах.

Алгоритм устроен следующим образом, что результат любой формулы должен быть выведен на станице, тоесть для того что бы все это заработало нужно сделать вывод обоих вычислений visota и obem в любом месте странице следующим образом {visota} {obem}, ну а то что вам не нужно скройте дивом <div style="display:none;">{visota}</div>. В итоге высоты не будет видно, и все будут работать.

Для построения шаблонов форм используются следующие поля и переменные:

1.	Текстовое поля	<input type="text" name="XXX" >
2.	Текстовый блок	<textarea name="XXX"></textarea>
3.	Выпадающий список	<select name="XXX"> <option value="1">Первый</option>   <option value="dew">Второй</option> </select>	Первый Второй
4.	Выбор одного из перечисленных	<input type="radio" name="XXX" value="1">Первый<br> <input type="radio" name="XXX" value="2">Второй<br> <input type="radio" name="XXX" value="3">Третий<br> <input type="radio" name="XXX" value="4" checked>Четвертый	Первый Второй Третий Четвертый;
5.	Набор нужных опций	<input type="checkbox" name="AAA" value="1">1<br> <input type="checkbox" name="YYY" value="2">2<br> <input type="checkbox" name="WWW" value="3">3<br>	1 2 3
6.	Прикрепление файлов к форме	<input type="file" name="ЛЮБОЕ ИМЯ НА ENG, ГЛАВНОЕ НАЛИЧИЕ ">
7.	Отправка отчета пользователю.	<input type="text" name="mailto"> - если параметр name=mailto, в это поле пользователь может ввести свой емайл для дублирования отправки и админу и себе.
8.	Проверка на человечность	{CAPTCHA} - вывод картинки и поля для проверки на человечность.
9.	Результаты вычислений	{переменные из формул} - результаты вычислений
10.	Отправка результатов вычисления	<input type="submit" value="Отправить заказ">

Создание форм с промежуточными значениями.

При создании форм для калькуляторов стоит учесть, что перерасчет формулы происходит при возникновения собития OnChange, поэтому если значения полей вы устанавливаете по средствам скрипта (без OnChange: примерно так document.getElementById("stoim_strah_h").value=100), то вам необходимо после вызвать событие OnChange так: fireEvent('change'). И ваш код будут выглядеть так:

<input type="text" name="stoim_strah_h" id="stoim_strah_h" size="40" maxlength="256">
document.getElementById("stoim_strah_h").value=100;
document.forms['calcForm'].elements['stoim_strah_h'].fireEvent('change');

Данный прием часто приходится применять когда дело имеешь со скрытыми инпутами (промежуточными).

Дата добавления: 2015-07-02