How To Retrieve Data From Database Based On The Value Of Two Drop Down List Using Ajax?

i have implemented the Example. Here i am retrieving data using only one drop down list. Its working fine. But if I want to do the same for two drop down list that is values from d

Solution 1:

There is an issue with how you are referencing the selected values of the SELECT elements, or more accurately, how your SELECT elements are structured. You need to place your ID (branch and sem) on the SELECT and not the individual options and you can remove the this.value parameter when you call showCourses() onchange because your function isn't set up to accept a parameter.

Try using this for your SELECTs

<selectname="branch"id="branch"onchange="showCourses()"><optionvalue="0"selected>Select one</option><optionvalue="ISE">1</option><optionvalue="CSE">2</option><optionvalue="ME">3</option></select><selectname="sem"id="sem"onchange="showCourses()"><optionvalue="0"selected>select one</option><optionvalue="I-P">I-P</option><optionvalue="I-C">I-C</option><optionvalue="II-P">II-P</option></select>

I also noticed that your check for selected values is looking for an empty string for either str or str1, but your "Select One" options have a value of 0 so you may want to change:

if (str == "" || str1 == "") {
    document.getElementById("txtHint").innerHTML = "";
    return;
}

To

if (str == "0" || str1 == "0") {
    document.getElementById("txtHint").innerHTML = "";
    return;
}