How can I use images in a form?

Question

I have three images :

<img src="{% static "img/lt.png" %}" />
<img src="{% static "img/en.png" %}" />
<img src="{% static "img/ru.png" %}" />

I need them to be in the form, however I want there to be no submit button - when user clicks on the image the form gets submitted. Is it possible ? How can I do that ?

possible duplicate of [Using an image as a submit button](http://stackoverflow.com/questions/5283360/using-an-image-as-a-submit-button). Or [Submit Button Image](http://stackoverflow.com/questions/11772326/submit-button-image). Or [button image as form input submit button](http://stackoverflow.com/questions/3381609/button-image-as-form-input-submit-button). — cmbuckley, Sep 24 '13 at 22:35

score 5 · Answer 1 · answered Sep 24 '13 at 22:34

5

Use input with type="image" to your problem

<input type="image" src="YourImage" />

answered Sep 24 '13 at 22:34

Donovan Charpin

3,567
22
30

1

+1 for engaging brain before answering. – Niet the Dark Absol Sep 24 '13 at 22:39
I don't know why -1, but ok.. – Donovan Charpin Sep 24 '13 at 22:40

score 0 · Answer 2 · answered Sep 24 '13 at 22:35

You can add javascript click handlers to the images that submit the form using javascript.

    <img src="{% static "img/ru.png" %}" onclick="submitForm();" />

    <script type="text/javascript">
        function submitForm() {
            document.getElementById('form1').submit();
        }
    </script>

This can also allow you to modify any potentially hidden input fields before the submit occurs.

How can I use images in a form?

2 Answers2