CODEWITHSUNDEEP
javascripthtmlmysql
Dean TristaNato
Dean TristaNato

Reputation: 133

How to fetch data from database from the second dropdown value

I have a HTML like this

<label>Brand</label></br>
  <select name="brand" id="brand" onChange="changecat(this.value);">
     <option value="" selected>Select Brand</option>
     <option value="A">AMD</option>
     <option value="B">Intel</option>
  </select> </br> </br>

<label>Socket</label></br>
   <select name="category" id="category">
     <option value="" disabled selected>Select Socket</option>
   </select> </br></br>

<label>Select Processor</label>
   <select id="proSelect" onchange="proSelectValue()">
     <option value="0">Processor</option>
   </select>

and the JS like this

var brandByCategory = {
    A: ["AM4", "AM3", "AM2"],
    B: ["LGA 1151", "LGA 1151v2", "LGA 1150"]
}

    function changecat(value) {
        if (value.length == 0) document.getElementById("category").innerHTML = "<option>Select Socket</option>";
        else {
            var catOptions = "";
            for (categoryId in brandByCategory[value]) {
                catOptions += "<option>" + brandByCategory[value][categoryId] + "</option>";
            }
            document.getElementById("category").innerHTML = catOptions;
        }
    }

I want to populate the third dropdown (Processor Dropdown) with the data from the database. What is the effecient way to do that? But, when I look at the inspect element on the browser, the socket dropdown option doesn't have a value, is that a problem? Thankss

Upvotes: 1

Views: 1759

Answers (1)

Fraddy
Fraddy

Reputation: 331

In order to update Processor dropdown, Socket dropdown will not cause any problem.

Check below link which has resolved this kind of question.

JavaScript - populate drop down list with array

Upvotes: 1

Related Questions