CODEWITHSUNDEEP
javascriptdomforms
cannyboy
cannyboy

Reputation: 24426

Targeting a button on a form to press, with javascript

I know that, using Javascript, I can tell a form to submit using something like this:

document.forms[0].submit()

However, if there are a number of forms on a page, which could be in any order, how would I target the submit link in this form:

<form action="/services/auth/" method="post">
<div id="auth-allow-container" class="button-container">
<a class="Butt" id="auth-allow" type="submit" href="#"><span>SUBMIT</span></a>
<a class="Butt CancelButt" id="auth-disallow" href="#home"><span>CANCEL</span></a>
</div>
</form>

..so that it is as if the user has clicked SUBMIT?

Upvotes: 0

Views: 153

Answers (3)

Šime Vidas
Šime Vidas

Reputation: 185933

You could make a function:

function submitFormById(id) {
    var el = document.getElementById(id);
    while ( el && el.tagName.toLowerCase() != 'form') {
        el = el.parentNode;
    }
    el && el.submit();
}

Then you use this function like so: 

submitFormById('auth-allow');
submitFormById('auth-disallow');

Both will submit the form.

Upvotes: 2

yopefonic
yopefonic

Reputation: 532

put in the link:

onclick="this.parentNode.parentNode.submit();"

this is a bit fragile if you change the dom structure but it is a generic link for this kind of form

update:

document.addEventListener("DOMContentLoaded", function() {
    document.getElementById("auth-allow").addEventListener("click", submithAuthForm, false);
}, false);

function submithAuthForm(){
    document.getElementById('auth-allow').parentNode.parentNode.submit();
}

Upvotes: 1

Endophage
Endophage

Reputation: 21473

Give the form a name attribute. Then you can do document.name.submit(). i.e. 

<form name="MyForm" ....>
<input ... />
</form>

You would then be able to do document.MyForm.submit()

EDIT:

As you have said you can't change the html, solutions adding an ID are also no help. You will have to identify which numerical form element on the page this specific one is and do docuemnt.forms[x].submit() where x is the index of this form.

Upvotes: 1

Related Questions