javascript - I am new to node js how to get dependent dynamic dropdown from database -


my node code:

app.get('/block_name', function (req,res){  var sql='select  `block_name`,`block_id` `tbl_block`  '; connection.query(sql,function(err, result) {     if (err) throw err;     res.json(result); }); 

});

app.get('/site_name', function (req,res){

var sql='select  `site_name`,`site_id` `tbl_site` '; connection.query(sql,function(err, result) {     if (err) throw err;     res.json(result); }); 

});

html

site

      <select name="site" id="dropdown" >         <option value="">- select -</option>       </select>      <label class="field" >block</label>       <select name="block" id="dropdown1" >         <option value="">- select -</option>       </select> 

script

<script>      $(document).ready(function(){     $.ajax({         url : "/site_name",         type : "get",         success : function(data){              var len = data.length;              console.log(data);             $("#dropdown").empty();             for(var =0; i<len;i++){             var value1 = data[i]['site_name'];             var value2 = data[i]['site_id'];                 $("#dropdown").append("<option value='"+value2+"' >"+value1+"</option>");              }          }     }); });       $(document).ready(function(){     $.ajax({         url : "/block_name",         type : "get",         success : function(data){              var len = data.length;              console.log(data);             $("#dropdown1").empty();             for(var =0; i<len;i++){             var value1 = data[i]['block_name'];             var value2 = data[i]['block_id'];                 $("#dropdown1").append("<option value='"+value2+"' >"+value1+"</option>");              }          }     }); });     </script> 

my second dropdown lists data need particular thing listed according first dropdown. in advance.. sorry bad english

anytime first drop-down changes value, need repopulate second drop-down based on select value in first drop-down - rerunning ajax call load second drop-down, using value of first drop-down decide data request server.

you installing event handler on first drop-down can detect time value changed , repopulate second dropdown fresh ajax call whenever event on first drop-down occurs.


Comments

Popular posts from this blog

Is there a better way to structure post methods in Class Based Views -

performance - Why is XCHG reg, reg a 3 micro-op instruction on modern Intel architectures? -

jquery - Responsive Navbar with Sub Navbar -