使用AJAX初始化jQuery Multiselect

Question

我遇到了AJAX和JQUERY的问题。

我有一个表格，里面有一个标签。选择一个选项后，我使用AJAX生成一个公式，用数据库中的一些数据填充并显示它。

我想用jQuery UI MultiSelect Widget

的问题是，我需要初始化与jQuery选择，但是当我产生了新的内容在文件中调用这个函数，它不工作：（它的工作原理以及如果我不使用AJAX）。

<script type="text/javascript"> 
     $(function(){ 

      $("#ExampleSelect").multiselect({ 
       selectedList: 4 
      }); 

     }); 

</script> 

的结构如下：与含有正常和其将包含AJAX调用后所产生的元件的主要形式

• PHP文件。 （onChange事件在<select>）。
• Ajax的文件，它包含了jQuery UI多选其中港岛线在主PHP的形式被显示（在<div>标记内）

---

function LoadDiv() 
{ 

    var xmlhttp; 

    var serie_id = document.getElementById('serie_id').value; 


    if (window.XMLHttpRequest) 
    {// code for IE7+, Firefox, Chrome, Opera, Safari 
     xmlhttp=new XMLHttpRequest(); 
    } 
    else 
    {// code for IE6, IE5 
     xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    xmlhttp.onreadystatechange=function() 
    { 
     if (xmlhttp.readyState==4 && xmlhttp.status==200) 
     { 
      document.getElementById("divForm").innerHTML=xmlhttp.responseText; 
     } 
    } 
    xmlhttp.open("POST","divDataManagement.php",true); 
    xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); 
    xmlhttp.send("serie_id="+serie_id); 

} 

$.ajax({ 

     success: function(){ 
       $("#ExampleSelect").multiselect("destroy").multiselect({ 
        selectedList: 4 
       }); 

    } 
}); 

• PHP文件。

---

<select id = "ExampleSelect" multiple> 
         <option value="option1">Option 1</option> 
         <option value="option2">Option 2</option> 
         <option value="option3">Option 3</option> 

       </select> 

感谢您的帮助。

Answer 1

使用AJAX成功方法初始化它。

$.ajax({ 
... 
success: function(){ 
     $("#ExampleSelect").multiselect({ 
      selectedList: 4 
     }); 
} 
... 

如果您对选定的multiselect实例进行了更改，请在更改后将其销毁并重新初始化。

$.ajax({ 
... 
success: function(){ 
    $("#ExampleSelect").multiselect("destroy").multiselect({ 
     selectedList: 4 
    }); 
} 
... 

如果您使用XMLHttpRequest而不是jQuery ajax，则应该先在onreadystatechange方法中多选。

xmlhttp.onreadystatechange=function() 
{ 
    if (xmlhttp.readyState==4 && xmlhttp.status==200) 
    { 
     document.getElementById("divForm").innerHTML=xmlhttp.responseText; 
     $("#ExampleSelect").multiselect({ 
      selectedList: 4 
     }); 
    } 
}