CODEWITHSUNDEEP
javascriptformsgoogle-chromeconsolefill
Bilal Ahmad
Bilal Ahmad

Reputation: 1122

How to fill web form using javascript

I want to fill the form data using javascript in chrome. I have filled all other fields correctly but the field(html) bellow is not working for me. (there must be other scripts working this form, i don't about that)

<select name="month" class="valid">
<option value="">
    <font style="vertical-align: inherit;"><font style="vertical-align: inherit;">Month</font>
    </font>
</option>
<option value="01">
    <font style="vertical-align: inherit;"><font style="vertical-align: inherit;">January</font>
    </font>
</option>
<option value="02">
    <font style="vertical-align: inherit;">
        <font style="vertical-align: inherit;">February</font>
    </font>
</option>
<option value="03">
    <font style="vertical-align: inherit;"><font style="vertical-align: inherit;">March</font>
    </font>
</option>

Month January February March

i have tried some code but it doesn't work.

var month = document.querySelector('input[name="month"]');
month.selectedIndex = 3;

i am using this script in chrome console, is there any way i can fill this field with javascript?

here is the form link

Upvotes: 1

Views: 3516

Answers (2)

Yuri
Yuri

Reputation: 2900

This code does exactly what you looking for. It selects March in your select. Note: correct selection in not var month = document.querySelector('input[name="month"]'); Use instead 

var month = document.querySelector('select[name="month"]');


$(function() {
    var month = document.querySelector('select[name="month"]');
month.selectedIndex = 3;
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="month" class="valid">
<option value="">
    <font style="vertical-align: inherit;"><font style="vertical-align: inherit;">Month</font>
    </font>
</option>
<option value="01">
    <font style="vertical-align: inherit;"><font style="vertical-align: inherit;">January</font>
    </font>
</option>
<option value="02">
    <font style="vertical-align: inherit;">
        <font style="vertical-align: inherit;">February</font>
    </font>
</option>
<option value="03">
    <font style="vertical-align: inherit;"><font style="vertical-align: inherit;">March</font>
    </font>
</option>
</select>

Upvotes: 2

Eli K Miller
Eli K Miller

Reputation: 70

First, your selector input[name="month"] does not match any elements.

Secondly, once you are able to select the correct element you can set it's value using element.value = 3.

See more about the value property here.

Upvotes: 1

Related Questions