Блог программиста

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


<FORM ACTION="index.php" METHOD="POST" NAME="MyForm">
<INPUT TYPE="Text" NAME="MyTextField">
<INPUT TYPE="IMAGE" SRC="send.png">
</FORM>

Вот и все что нужно сделать. Заменить стандартную конструкцию

<INPUT VALUE="Отправить" TYPE="submit"/>

на

<INPUT TYPE="IMAGE" SRC="send.png">

Следует отметить что аттрибуты width, height, align остаются доступными для изображения.

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

<form> ... </form>

Это достигается с помощью несложного обработчика события onClick у этих элементов. Вот пример ссылки, которая делает Submit для формы, которую привели в примере выше:

<a href="#" onclick="document.forms['MyForm'].submit();”>Submit</a>

В JavaScript я не силен, но из кода можно понять что мы обращаемся к нашей форме по ее параметру NAME: forms['MyForm'] а дальше делаем Submit. Тоесть, фактически, мы можем сделать аналог кнопки “Отправить” для любых элементов, которые имеют обработчик onClick. Удачи вам в экспериментах, и красивого сабмита

admin PHP JavaScript, PHP, Программирование