Как динамически добавить параметры (параметры в форме "java.sql.ResultSet") к тегу выбора в JSP - PullRequest
0 голосов
/ 08 марта 2012

Я хочу добавить опции в мой тег выбора, который я извлек из базы данных. Например Если пользователь хочет местоположение определенного магазина. Сначала база данных извлечет «страну» и отобразится в теге select. Теперь при выборе страны следующее состояние должно отображаться в теге выбора, который извлекается из базы данных в зависимости от выбранной страны.

Ответы [ 2 ]

0 голосов
/ 13 марта 2012
<script type="text/javascript">

var xmlRequest;

function changeCities() { 

xmlRequest = new XMLHttpRequest(); 

xmlRequest.open("get", "CityServlet?stateId=2", true); 

xmlRequest.send(null); 

xmlRequest.onReadyStateChange = processResponse; 

} 

function processResponse() { 

alert(1); 

if(xmlRequest.readyState == 4 && xmlRequest.status == 200) { 

alert(xmlRequest.responseText); 

var response = xmlRequest.responseText; 

document.getElementById("res").value = response; 

} 

} 
</script> 

<body>

<form action="post" name="customerRegForm"> 

    <select name="state" onchange="changeCities()"> 

      <option value="1">Gujarat</option> 

      <option value="2">Rajasthan</option> 

   </select> 
  <select name="cities">  </select> 

  <input type="text" name="res"></input> 

</form> 

   </body> 

Напишите сервлет, который принимает параметр, переданный из XMLHttpRequest, и возвращает ответ от сервлета.

0 голосов
/ 08 марта 2012

JSP скомпилированы на стороне сервера. То, что вы пытаетесь выполнить, - это манипулирование DOM, которое происходит на стороне клиента. Вы не можете динамически генерировать имена состояний на основе страны, выбранной с помощью тегов JSP. Вы должны сделать это, используя JavaScript и Ajax. Проверьте jQuery Автозаполнение с удаленным источником данных

Я бы лучше выложил какой-нибудь код.

HTML

    <select id="PIA" name="PIA"  tabindex="2" class='combobox' required='required' placeholder="Select Office">

                    <option value="!valid">Select Office</option>    
                    <option value='AHD'>AHEMDABAD</option>    
                    <option value='BPL'>BHOPAL</option>    
                    <option value='BHU'>BHUBNESWAR</option>    
                    <option value='COC'>COCHIN</option>    
                    <option value='DLH'>DELHI</option>    
                    <option value='GZB'>GHAZIABAD</option>    
                    <option value='GUW'>GUWAHATI</option>    
                    <option value='HYD'>HYDERABAD</option>    
                    <option value='JPR'>JAIPUR</option>    
                    <option value='JAL'>JALANDHAR</option>    
                    <option value='JMU'>JAMMU</option>
                    <option value='CAL'>KOLKATA</option>
                    <option value='KOZ'>KOZHIKODE</option>    
                    <option value='LKO'>LUCKNOW</option>   
                    <option value='BOM'>MUMBAI</option>    
                    <option value='PAT'>PATNA</option>    
                    <option value='SUR'>SURAT</option>    
                    <option value='ASR'>AMRITSAR</option>    
                    <option value='BLY'>BAREILLY</option>    
                    <option value='DDN'>DEHRADUN</option>    
                    <option value='MLP'>MALAPPURAM</option>
                    <option value='NGP'>NAGPUR</option>    
                    <option value='GOA'>PANAJI</option>    
                    <option value='PNE'>PUNE</option>    
                    <option value='RPR'>RAIPUR</option>    
                    <option value='RCH'>RANCHI</option>    
                    <option value='SML'>SHIMLA</option>    
                    <option value='SGR'>SRINAGAR</option>    
                    <option value='THN'>THANE</option>    
                    <option value='TVM'>TRIVANDRUM</option>    
                  </select>

    </td>



    <!--  District -->

    <td><div class="ui-widget" id='distPop'>

    <select id='district' name='district' tabindex="2" class='combobox'>  

        <option id="!valid" value='!valid'>Select District</option> 

    </select> 
</div>

1010 * Javascript *

$('document').ready(function(){
    $('#PIA').combobox({
    maxheight: '100px',
    selected: function(e,u){
            $.getJson({
                "yourURL",
                $(this).val();
                function(districts){
                   $.each(districts[$(this).val()], function(key, value){
               $('#district').append("<option value='"+key+"'>"+value+
                        "</option>");
                });

            });
      });
});

Не забудьте включить JQuery и JQuery UI-скрипты в верхней части вашей страницы.

...