www.seomark.ru
Обзоры интересных и полезных программ, фотография, радио, веб-дизайн и т.д. и т.п. и др. и пр.
Веб-дизайн и поисковая оптимизация
Создание формы обратной связи
• Создание формы обратной связи на сайте
• Проверка ввода формы обратной связи
• Простая форма обратной связи с проверкой введенных данных
• Создание анкеты на сайте
• Проверка формы обратной связи "на лету"
• Отправка файлов через форму обратной связи
• Капча в форме обратной связи
• Простая капча для формы обратной связи
• Заказ товаров и услуг через форму обратной связи
• Форма обратной связи - отправка писем на разные адреса
• Проблемы с кодировкой в форме обратной связи
• Создание кнопок в форме обратной связи
• Календарь в форме обратной связи
• Оформление формы обратной связи
>> смотреть все статьи о создании формы обратной связи
Заказ товаров и услуг через форму обратной связи
В одной из предыдущих статей говорилось о том, что форма обратной связи предоставляет возможность реализации на сайте заказа товаров и даже простейшего интернет-магазина. Если ассортимент предлагаемых вами товаров или услуг не превышает нескольких десятков, то вы легко можете организовать их заказ через форму обратной связи, используя для вычислений JavaScript.
Такой вариант мини интернет-магазина подходит, например, для заказа пиццы или шашлыков через интернет (см. пример), для мгновенного подсчета стоимости предлагаемых услуг, вариантов установки пластиковых окон, ремонтных работ, строительства небольших объектов - словом, везде, где стоимость работ рассчитывается по некоторым фиксированным параметрам. Посетителю сайта не надо формировать корзину покупок, а сумма заказа подсчитывается мгновенно при изменении характеристик заказа.
Для примера, рассмотрим создание формы обратной связи для заказа через сайт полиса автострахования ОСАГО. Потенциальный страховщик выбирает в форме характеристики страхуемого автомобиля и сразу видит в нижней графе стоимость полиса. "Опросный листок" может выглядеть следующим образом (как всегда, форма вполне работоспособна, и вы можете её использовать при создании сайтов):
Обратите внимание, что подсчет не может быть выполнен, если в браузере пользователя отключено выполнение сценариев JavaScript. В этом случае выводится предупреждающая надпись: "*Для выполнения расчета необходимо разрешить в браузере выполнение сценариев для этой страницы!" В HTML-коде страницы это предупреждение заключается в контейнер <noscript>...</noscript> в начале таблицы расчета ОСАГО (см. исходный код). Конечно, вы можете увидеть эту надпись и при просмотре данной страницы, если отключите JavaScript у себя в настройках браузера и обновите страницу.
Итак, продолжим увлекательную тему автострахования. Посетитель радостно вводит данные в форму обратной связи и после ознакомления с полученной суммой страховки заглядывает в свой кошелек. Если он находит там запрашиваемую сумму, то указывает номер телефона и время, когда ему удобно позвонить. Специалист страховой фирмы связывается с ним для уточнения условий страхования и доставки полиса. Быстро и без хлопот! Для заказа и связи с посетителем вполне достаточно простейшей формы обратной связи, наподобие показанной внизу (кстати, и этот макет тоже действующий и "содрать" его из исходного кода никто вам не запрещает):
На всякий случай привожу исходный код данной формы обратной связи (более подробно смотрите в статье Форма обратной связи - примеры использования):
<form action="" method="post" onsubmit="return checkForm(this);">
<table width="200" border="1" align="center" cellpadding="1" cellspacing="0" bgcolor="#FFFFCC">
<tr bgcolor="#ffde87">
<th height="31" width="200" align="center" >Заказать ОСАГО</th>
</tr>
<tr bgcolor="#FFFFCC">
<td align="center" > Ваше имя:<br />
<input name="name" type="text" />
<br />
Номер телефона:<br />
<input name="phone" type="text" />
<br />
Время звонка:<br />
<select name="time" style="width: 150px" >
<option>09.00 - 11.00</option>
<option>11.00 - 13.00</option>
<option>13.00 - 15.00</option>
<option>15.00 - 17.00</option>
<option>17.00 - 19.00</option>
<option>19.00 - 21.00</option>
</select>
<br />
<br />
<input type="submit" value="Заказать" />
</td>
</tr>
</table>
</form>
Для защиты от пустых посланий в этой форме проверяется заполнение полей. Если вы хотите получить более подробную информацию о заказе, то можете включить в отправляемое письмо и введенные посетителем данные о требуемой страховке из заполненой анкеты по ОСАГО. Как это сделать, было описано в статье Создание анкеты на сайте.
Для работы рассмотренной формы обратной связи с функцией заказа необходимо, естественно, написать соответствующую программу JavaScript. Если вы не сильны в программировании, то придется обратиться к специалисту. Однако в большинстве случаев подходящий скрипт можно найти в интернете и адаптировать его под ваши нужды. Кто ищет, тот всегда найдет!
5.04.2010 г.
Copyright © 2008 - Марк Розенталь e-mail:
Перепечатка материалов сайта разрешается при условии сохранения имени автора и гиперссылки на www.seomark.ru