значения Append в раскрывающийся список

Question

-

Я использую исходный код для множественного выбора

Dropdown check-list

Так, в примере был показан для статических значений, я отредактировал согласно моему требованию, И я пытался заполнить значения выпадающего списка с помощью базы данных, что означает динамическое заполнение значений в выпадающем списке. Но мне это не удалось. Пожалуйста, помогите мне. Выпадающий список будет заполняться в соответствии с выбранной опцией из первого выпадающего списка

<select id="design" onmouseup="showOfficer()" > 
<option value="A">A</option> 
<option value="B">B</option> 
<option value="C">C</option> 
<option value="D">D</option> 
<option value="E">E</option> 
</select> 

<select id="officers" class="officers" multiple="multiple"><div id="show_officer"></div></select> 

мой яваскрипта

<script language="javascript" > 
function showOfficer(){ 
         document.getElementById("msg4").style.display="block"; 
         $.ajax({ 
          url: 'getValues.jsp', 
          data: 'design_id='+ $('#design').val(), 
          type: 'post', 
          success: function(msg){document.getElementById("show_officer").innerHTML=msg; 
           document.getElementById("msg4").style.display="none"; 
          }}); 
        } 
</script> 

getValues.jsp

<%@include file="../dbconfig.jsp" %><% 
String design=request.getParameter("design_id"); 
String buffer=""; 
try{ 
    int count=0; 
ResultSet rs = state.executeQuery("SELECT OFFICER_ID,FIRST_NAME,LAST_NAME FROM OFFICER WHERE STATUS_TYPE='UNASSIGN' AND DESIGN_ID='"+design+"'");// 
    while(rs.next()){ 
    buffer=buffer+"<option value='"+rs.getString(1)+"'>"+rs.getString(2)+" "+rs.getString(1)+"</option>"; 
    count++; 
    } 
if(count==0) 
    { 
    buffer=buffer+"<option value='ERROR'>OFFICERS ASSIGNED ALREADY</option>"; 
} 
} 
catch(Exception e){ 
    buffer=buffer+"<option value='ERROR'>OFFICERS ASSIGNED ALREADY</option>"+e; 
} 
buffer=buffer+""; 
//out.print(buffer); 
response.getWriter().print(buffer); 
%> 

Пожалуйста, помогите мне !!

Answer 1

Я думаю, что это то, что вы ищете:

success: function(html){ 
    $("#msg4").hide(); 
    $("#officers").html(html); 
    $("#officers").dropdownchecklist(); 
} 

заменить функцию успеха с этим и принять, что div из вашего select.

Если вы загружаете jQuery, почему бы вам не использовать его не только для вызова ajax?

удалить OnMouseUp и попробовать это:

$('#design').mouseup(function(){ 
    $("msg4").show(); 
    $.ajax({ 
      url: 'getValues.jsp', 
      data: 'design_id='+ $('#design').val(), 
      type: 'post', 
      success: function(html){ 
       $("#msg4").hide(); 
       $("#officers").dropdownchecklist("destroy"); 
       $("#officers").html(html); 
       $("#officers").dropdownchecklist(); 
      } 
      }); 
});