Home/ Questions/Q 7535777
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-30T06:23:36+00:00

I have one drop down which is populated from database and on the same

  • 0

I have one drop down which is populated from database and on the same page I have a seconde drop down which will be populated from the value of the 1st one.

I want to use ajax for this so what should I do for this. And tutorial or a link from where I can solve my problem.

Updated:
Here is the code which I used.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">

    $('#cat').onChange(function(){
    alert("oncha");
        if($('#cat').val() == 'uprofile'){
            file = 'uprofile.html';
        }else if ($('#cat').val() == 'other'){

            file = 'city.html';
        }
        $('#city').change(function(){
            loadusers = $.ajax({
                    type: "GET",
                    url: file,
                    cache: false,
                    success: function (html) {
                        $("#city").html(html);
                    }
            });
        });
    });
</script>

<tr>
           <td class="label"><span id="required_span">* </span>Category</td>
           <td colspan="2" class="data"><select name="cat" id="cat">
           <option value="0">--Select Category--</option>

           <option value="O/O">O/O</option>
           <option value="company driver">company driver</option>
           <option value="other">other</option>

           </select></td>
      </tr>

 <tr>
           <td class="label"><span id="required_span">* </span>City</td>
           <td colspan="2" class="data"><select name="city" id="city">
           <option value="0">--Select city--</option>



           </select></td>
      </tr>

Here is the content of the city.html

<option>1</option>
<option>2</option>

But cannot work even the alert function. What I am missing in the code?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You can use something like this code:

        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">

    $(function() {
        if($('select').val() == 'uprofile'){
            file = 'uprofile.html';
        }else if ($('select').val() == 'album'){

            file = 'album.html';
        }
        $('#dropdown').change(function(){
            loadusers = $.ajax({
                    type: "GET",
                    url: file,
                    cache: false,
                    success: function (html) {
                        $("#dropdown2").html(html);
                    }
            });
        });
    });
</script>
<body>
    <div id="edit-type-wrapper">
     <select id="dropdown">
       <option value="">Select one</option>
       <option value="albums">Album</option>
       <option value="uprofile">User Profile</option>
     </select>
     <select id="dropdown2">
     </select>
    </div>
</body>

    Obviously you need to return the data from the other file/files. Hope this helps

    • 0