Xander
Xander

Reputation: 397

Auto select radio button and then submit button on page load - Javascript

I'm trying to select a radio button with an id (lets say the ID is "radio") and then automatically click a button with a type of submit inside of a form with an id of "multifee". I want these two things to automatically happen upon page load. Any suggestions on how to do this with javascript?

<form method="post" action="#" id="multifees" onsubmit="feeForm.submit(this); return false;">
<input type="radio" name="fee[1][options][]" id="radio" value="1" class="validate-one-required-by-name">
<button type="submit" class="button">Add</button>
</form>

So far I have no javascript started because I'm not even sure where to begin.

Upvotes: 0

Views: 4726

Answers (5)

user3310334
user3310334

Reputation:

You can check the radio button (#radio) like so:

document.getElementByID("radio").checked = true;

Or actually within the html using the checked property:

<input type="radio" checked>

To auto-submit:

document.getElementsByClassName("button").click();

Or:

    document.getElementByID("multifees").submit();

Upvotes: 0

Bellash
Bellash

Reputation: 8184

$('#radio').check();
$('#submit').click();

EDITS: with javascript

 document.getElementById('radio').checked=true;
 document.getElementById("multifees").submit();

Upvotes: 1

durbnpoisn
durbnpoisn

Reputation: 4669

Based on what you're asking for, there are really only a couple things you need. A radio list which one is preselected:

<form name="thisForm" id="thisForm" method="post" action="[your destination]">
    <input type="radio" name="choice1" value="choice1" checked /> choice<br />
    <input type="radio" name="choice1" value="choice2"/> choice2<br />
    <input type="radio" name="choice1" value="choice3"/> choice3<br />
    </form>

And a Javascript function to submit the form:

<script type="text/JavaScript" language="JavaScript">
        function submitForm() {
            document.getElementById("thisForm").submit();
        }
       // submitForm();
    </script>

I have the call to the function commented out on purpose, or you would throw you page into an infinite loop.

Upvotes: 0

aug
aug

Reputation: 11714

When declaring your radio button, you can add the attribute checked so that it is autoselected even when the page loads.

<input type="radio" name="fee[1][options][]" id="radio" value="1" class="validate-one-required-by-name" checked>

If you want to auto-submit, you can just make Javascript click for you.

<script type="text/javascript">
    document.getElementById('sumbit').click();
</script>

If you want the script to work, you have to place the script after <body> so that the element can been loaded onto the page or else it won't know what button to look for since it may not have been loaded yet. Make sure to give your submit button an id as well.

Upvotes: 1

bitfiddler
bitfiddler

Reputation: 2115

In pure Javascript try this in a window.onload handler:

document.getElementById('radio').check();
document.getElementById('submit').click();

Upvotes: 0

Related Questions