javascript - Refresh a select tag to default value -


i have 2 select tag. want refresh values in 2nd select tag default , when user click on first select tag. how achieve in javascript

you need use onchange event perform task. idea when first select changed, set default value (here choose set first item of list, can whatever need re-initialize value).

function initialize() {    var select_car = document.getelementbyid("select_car");    var select_power = document.getelementbyid("select_power");        select_car.selectedindex = 0;    select_power.selectedindex = 0;        select_car.addeventlistener("change", function() {      select_power.selectedindex = 1;      });  }
<body onload="initialize()">  <select id="select_car">    <option disabled>-- select car --</option>    <option>mazda mx5</option>    <option>nissan skyline gtr</option>  </select>  <select id="select_power">    <option disabled>-- select power --</option>    <option>150cv</option>    <option>255cv</option>  </select>  </body>


Comments

Post a Comment

Popular posts from this blog

javascript - AngularJS custom datepicker directive -

i make custom datepicker directive custom template. but have no idea how start building it... how include date data directive? i appreciate guide or give me advice work on more precisely. it might you! follow below steps html code sample: <label>birth date</label> <input type="text" ng-model="birthdate" date-options="dateoptions" custom-datepicker/> <hr/> <pre>birthdate = {{birthdate}}</pre> <script type="text/ng-template" id="custom-datepicker.html"> <div class="enhanced-datepicker"> <div class="proxied-field-wrap"> <input type="text" ui-date-format="yy-mm-dd" ng-model="ngmodel" ui-date="dateoptions"/> </div> <label> <button class="btn" type="button"><i class="icon-calendar"></i>
Read more

javascript - jQuery date picker - Disable dates after the selection from the first date picker -

<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>jquery ui datepicker - default functionality</title> <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> <script src="//code.jquery.com/jquery-1.10.2.js"></script> <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> <link rel="stylesheet" href="/resources/demos/style.css"> <script> $(function () { $("#datepicker1").datepicker(); }); </script> <script> $(function () { $("#datepicker2").datepicker(); }); </script> </head> <body> <p>date 1: <input type="text" id="datepicker1"></p> <p>date 2: <input type="t
Read more