JQuery-UI Dialog下使用服务器端按钮失效

目标：点按钮弹出div层，选择数据后自动隐藏div，将所选数据赋值到窗体。

<div id="divWinPop">

//里面是要实现弹出框的代码，包括翻页、查找等.

</div>

 

当使用JQuery把上面div部分代码实现Dialog时，发现里面的服务器端按钮无法触发事件。

后来查资料发现，JQuery会把代码appendTo到body，而不在form里，所以按钮事件无法触发。

解决方法：在点击按钮打开Dialog时，将div append到form里，使按钮生效。

在div divWinPop外面，再套一层div，如：

<div id="divParent">

  <div id="divWinPop">

  </div>

</div>

 

这样在按钮事件中写：

<script language="javascript" type="text/javascript"><!--
 
$(document).ready(function()  
{
$("#divWinPop").hide(); //加载时隐藏div
 $("#btn").click(function() {
   $("#divWinPop").dialog({modal:true}); 
   $("#divWinPop").dialog({width:600,height:450}); //设置宽度、高度
      $("#divWinPop").dialog( "option", "position", "center" );
      $("#divWinPop").parent().appendTo("#divParent"); //将弹出div append到属于form里的div，那么服务器端控件就可以正常执行
    });
    

});
</script>