如何动态地将选项(选项以“java.sql.ResultSet”的形式)添加到jsp中的select标签

时间:2012-03-08 09:32:32

标签: javascript jsp jsp-tags

我想将选项添加到我从数据库中检索到的select标签中。 例如 如果用户想要某个商店的位置。 首先,数据库将检索“country”并显示在select标签中。 现在选择国家/地区时,下一个州应显示在选择标记中,该标记根据所选国家/地区从数据库中检索。

2 个答案:

答案 0 :(得分:0)

JSP在服务器端编译。你想要完成的是DOM操作,它发生在客户端。您无法根据使用JSP标记选择的国家/地区动态生成状态名称。你必须使用javascript和Ajax。查看jQuery Autocomplete with remote datasource

我宁愿发布一些代码。

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>

的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脚本。

答案 1 :(得分:0)

<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> 

编写一个Servlet,它接受从XMLHttpRequest传递的参数并从servlet返回响应。