How to call JavaScript function in a dropdown on Selection not on Change

Question

I'm trying to call the JavaScript function on automatically selected value from dropdown options on the basis of what value came from DB. Right now JavaScript function got called when I change options from the front-end. Here is my code. What I want is to call JavaScript Getstate(this.value) function on automatically selection which depends on the value came from DB. Any suggestions?

 <label>Province: </label><br>
 <select name="Provincedown" id="ProvinceDropDown"  class="form-control" onChange="getState(this.value);">
 <option value="SelectProvince" <?=$ProvinceName == 'SelectProvince' ? ' selected="selected"' : '';?> > Please Select </option>
 <option value="Sindh" <?=$ProvinceName == 'Sindh' ? ' selected="selected"' : '';?>> Sindh </option>
 </select>

getState(this.value) is my JavaScript function in which I'm using AJAX and making my data JSON and sending to another page.

@Carlo I'm trying to say that gestate function get call whether there is a change in value from front end but here I want to call getstate() function when I automatically select value on the basis of the value I got from DB like I'm doing in my code — Naveed Cheema
– Naveed Cheema, Commented Sep 5, 2016 at 21:46
So you want to fire the first time on page load, where the selected value is printed by the server? It should be as symple as calling getState(document.getElementById("ProvinceDropDown").value) on page load — Carlo
– Carlo, Commented Sep 5, 2016 at 21:56
@Carlo so you want me to change this.value to document.getElementById("ProvinceDropDown").value ???? — Naveed Cheema
– Naveed Cheema, Commented Sep 5, 2016 at 22:00
no. in the onChange property it's fine as it is. You have to call the function on page load, with the selected value as a parameter. I sense that you will understand this better if you remove the scripts from inline and include them in a js file — Carlo
– Carlo, Commented Sep 5, 2016 at 22:02

Rana Aalamgeer · Accepted Answer · 2016-09-06 07:12:00Z

3

Use window.onload to get your selected value from dropdown.

<label>Province: </label><br>
 <select name="Provincedown" id="ProvinceDropDown"  class="form-control">
 <option value="SelectProvince" <?=$ProvinceName == 'SelectProvince' ? ' selected="selected"' : '';?> > Please Select </option>
 <option value="Sindh" <?=$ProvinceName == 'Sindh' ? ' selected="selected"' : '';?>> Sindh </option>
 </select>


 <script>
 function abc()
 {
 var name=document.getElementById("ProvinceDropDown").value;
 alert(name);
 }
 window.onload = abc;
 </script>

answered Sep 6, 2016 at 7:12

Rana Aalamgeer

7122 gold badges8 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Naveed Cheema Over a year ago

that is exactly i did yesterday night.; Thankyou (:

Collectives™ on Stack Overflow

How to call JavaScript function in a dropdown on Selection not on Change

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related