How to retrieve values in database and show in jsp select tag when another select tag is selected?

Question

Well in the project that I am working there's a database table containing the following fields :

From the database table I want to show beds that's available in the ward that's not occupied when the ward is selected , then in bed select tag should show only available beds .

The jsp form select tag code is :

 <div class="form-group">
                            <label for="course">Ward No:</label>
                                    <div class="form-select">
                                <select name="Ward" id="course">
                                    <option value="0">--Select Ward No---</option>
                                    <option value="ward1">1</option>
                                    <option value="ward2">2</option>
                                    <option value="ward3">3</option>
                                    <option value="ward4">4</option>
                                    <option value="ward5">5</option>
                                    <option value="ward6">6</option>
                                    <option value="ward7">7</option>
                                    <option value="ward8">8</option>
                                    <option value="ward9">9</option>
                                    <option value="ward10">10</option>
                                    <option value="ward11">11</option>
                                    <option value="ward12">12</option>
                                </select>
                                <span class="select-icon"><i class="zmdi zmdi-chevron-down"></i></span>
                            </div>
                                 </div>
                                 <div class="form-group">
                            <label for="bed">Bed No:</label>
                                    <div class="form-select">
                                        <select name="Bed" id="course">     
                                    <option value="0">--Select Ward No---</option>
                                    <option value="bed1">1</option>
                                    <option value="bed2">2</option>
                                    <option value="bed3">3</option>
                                    <option value="bed4">4</option>
                                    <option value="bed5">5</option>
                                    <option value="bed6">6</option>
                                    <option value="bed">7</option>
                                    <option value="bed8">8</option>
                                    <option value="bed9">9</option>
                                    <option value="bed10">10</option>
                                    <option value="bed11">11</option>
                                    <option value="bed12">12</option>
                                </select>
                                        
                                <span class="select-icon"><i class="zmdi zmdi-chevron-down"></i></span>
                            </div>
                                 </div>

So the question is how can I do this ?

I am new java development and this is my first project , so please excuse if any silly mistakes are found.

Thank you in advance for all helping out , its much appreciated.

[This](https://stackoverflow.com/questions/4112686/how-to-use-servlets-and-ajax) post should be helpful. — Swati, Apr 23 '21 at 05:41

score 1 · Answer 1 · answered Apr 22 '21 at 13:54

The simple answer to your question is AJAX

Do an AJAX call to get the available beds from DB after selecting the ward number. Form the bed dropdown dynamically.

Example:

<select name="Ward" id="course" onChange="fetchAvailableBeds()">
......
</select>

function fetchAvailableBeds()
{
    var wardNo = $("#course").val();
    var queryUrl = "REST_URL";
    $.ajax({
    url     : URL,
    data    : "wardNo="+wardNo,
    type    : "POST",
    success : function(data, textStatus, jqXHR)
    {
        var responseJSON = jqXHR.responseText;
        var responseParsedJSON = JSON.parse(responseJSON);

        var bedDetails = responseParsedJSON.bedDetails;
        if(bedDetails.length > 0)
        {
            $('#bed').empty().append('<option>--Select Bed--</option>');
            for(var i=0;i<bedDetails.length;i++)
            {
                $('#bed').append('<option value="'+bedDetails[i].name+'">'+bedDetails[i].id+'</option>' );
            }
        }
        else
        {
            $('#bed').empty().append( '<option>--No Beds Available--</option>');
        }

     }
  });
}

score 0 · Answer 2 · answered Apr 22 '21 at 19:38

0

After selecting the ward number you can generate the select tag as string from database using for loop and print out the result on html

answered Apr 22 '21 at 19:38

Ola Nasr

1
1

How to retrieve values in database and show in jsp select tag when another select tag is selected?

2 Answers2