我做的是点击查询时弹出一个div,查询条件放到div里面,查询按钮Button也在div里面; 看到jquery-ui很好看,而且很方便,便改用jquery-ui实现.但期间遇到下面这两个难题:

1、服务器控件Button包含在对话框的话 ,点击Button,回滚页面时对话框消失

2、后台获取不到对话框的中服务器控件的value

 

解决办法:

问题1:

页面采取局部刷新,用ajax包起来,即UpdatePanel,将对话框中用到的Button按钮,放到要弹出的对话框外面,改用js触发此button的onclick事件。

问题2:

添加代码:

$("#" + ObjWin).parent().appendTo(jQuery("form:first"));

(说明:ObjWin为要弹出的对话框(即div的id)),主要原因是jquery团队在弹出对话框操作时,将弹出对象添加到body,而不是form表单里,不在form表单,你也就无法获取到值,所以要手工添加到form对象里。

解决掉上面两个问题后,又引发出新的问题 

即问题3:当单击两次查询后,再单击Button(查询),则会多出一个一摸一样的ObjWin(称为ObjWin1),原因不知,请高手指点,再次单击Button(查询),ObjWin和ObjWin1里的查询条件的值才保持一致,而且Button(查询)所依据的查询条件是ObjWin1的。就这样需要单击两次才会得到自己想要的查询结果。

试了n多办法后,想到了一个解决办法,即第三次单击Button(查询)的时候,再次触发一次Button(查询)。而且,第三次即(奇数次)查询时不回滚到后台,直接在OnClientClick的时候,执行完

$("#" + ObjWin).parent().appendTo(jQuery("form:first"));
return;这样查询的结果就符合查询条件了。
实例:
需要引用的资源:
http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js
http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js
http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css
前台主要html文件:
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<div  class="HidePopDiv" id="win1" runat="server">
<table class="PopTb"  cellspacing="0px">
<colgroup>
<col  class="TD40Px" align="right"/>
<col   class="TD75Px" align="left"/>
<col  class="75px" align="right"/>
<col  class="TD200Px" align="left"/>
</colgroup>
<tr>
<td>年度:</td>
<td>
<select runat="server" id="SltYear">
</select>
</td>
<td>
                    考核基地:
</td>
<td>
<select runat="server" id="SltExamBaseSch">
</select>
</td>
</tr>
<tr>
<td>
                    状态:
</td>
<td>
<select runat="server" id="SltState">
</select>
</td>
<td>
                    考核类型:
</td>
<td>
<select id="SltExamTypeSch" runat="server">
</select>
</td>
</tr>
<tr>
<td>
                    工种:
</td>
<td colspan="3" class="TDL">
<select runat="server" id="SltProfessionTypeSch">
</select>
</td>
</tr>

</table>
</div>  
<asp:Button runat="server" ID="btn_select" Text="查询" OnClick="btn_select_Click" OnClientClick="GiveSearchValue('win1')">
</asp:Button>

</ContentTemplate>
</asp:UpdatePanel>

前台弹出对话框js代码

var i = 0;
///给予查询按钮传递服务器卡控件的值
function GiveSearchValue(ObjWin) {
    $("#" + ObjWin).parent().appendTo(jQuery("form:first"));
    i = i + 1;
if (i % 2 == 0)
    { return; }
}
///弹出对话框
function ShowDialog(ObjWin, ObjBtn) {
    $("#" + ObjWin).dialog({
        width: 400,
        autoOpen: false,
        buttons: {
            "查询": function () {

                $("#" + ObjBtn).click();

if (i > 2) {
if (i % 2 == 1) {
                        $("#" + ObjBtn).click();
                    }
                }

            }
                         , "关闭": function () { CloseDialog(ObjWin); }
        },
        show: "slow",
        hide: "slow"

    });
    $("#" + ObjWin).dialog("open");
}
///关闭对话框
function CloseDialog(CloseWin) {
    $("#" + CloseWin).dialog("close");
    i = 0;
}

后台主要代码:

protected void btn_select_Click(object sender, EventArgs e)
    {
///为modal类赋值
        ClsMEBSet = new MODAL.ExamBatchSet();
        ClsMEBSet.BELONGCITY = bpBelongCity;
        ClsMEBSet.EBEXAMTYPE = SltExamTypeSch.Value;
        ClsMEBSet.EBPROFESSIONTYPE = SltProfessionTypeSch.Value;
        ClsMEBSet.CURYEAR = SltYear.Value;
        ClsMEBSet.EBTYPE = "1";
        ClsMEBSet.PUBSTATE = SltState.Value;
        ClsMEBSet.EBEXAMBASEID = SltExamBase.Value;
///重新查询数据 
        this.WebPager1.RecordCount = ClsBllEBSet.GetExamBatchNum(ClsMEBSetSch);
    }

有更好地思路请分享出来哦……