12

我需要以编程方式禁用 JQuery 选项卡。选项卡位于更新面板 (Ajax) 中,而更新面板位于 ASP.NET 页面中。代码:

<link type="text/css" rel="stylesheet" href="http://ui.jquery.com/testing/themes/base/ui.all.css" />

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>

<script type="text/javascript" src="http://ui.jquery.com/testing/ui/ui.core.js"></script>

<script type="text/javascript" src="http://ui.jquery.com/testing/ui/ui.tabs.js"></script>

<script type="text/javascript">

    $(document).ready(function(){
        $("#example").tabs();
    });


    function hidetabs(){
        $(document).ready(function(){
        $("#example").tabs();
        $('#example').data('disabled.tabs', [1, 2]);});
    }
</script>


<%@ Page Language="C#" MasterPageFile="~/any.Master" AutoEventWireup="true" Codebehind="anycode.aspx.cs"
    Inherits="anycode" %>

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">

<asp:UpdatePanel ID="UpdatePanel_Deal_Import" runat="server">
<ContentTemplate>
<div id="example">
<ul>
<li><a href="#fragment-1"><span>One</span></a></li>
<li><a href="#fragment-2"><span>Two</span></a></li>
<li><a href="#fragment-3"><span>Three</span></a></li>
</ul>
<div id="fragment-1">
<p>
First tab is active by default:</p>
<pre><code>$('#example').tabs();</code></pre>

<asp:Button ID="btn_Save" OnClick="btn_Save_Click" runat="server" Text="Save" Visible="False" CommandName="Save">
</div>

<div id="fragment-2">
Lorem ipsum dolor sit amet, consectetuer 
ut laoreet dolore magna aliquam erat volutpat.
</div>
<div id="fragment-3">
Lorem ipsum dolor sit amet, consectetuer 
aliquam erat volutpat.
</div>
</div>

      </ContentTemplate>
</asp:UpdatePanel>
</asp:Content>


Code behind:

protected void btn_Save_Click(object sender, EventArgs e)
{
//here I need to diable the panels.

}

btn_Save_Click 函数不会发布页面,因此它不会调用 Javascript/jquery hidetabs 函数。谢谢你的帮助!!!

4

3 回答 3

17

我使用了以下方式,对我来说 100% 正常工作:

首先我创建一个函数并将我的 jquery 函数写入我的页面中的函数:

<script>
    function myFunction(params) {
        $.my_jquery(params...)
        ......
    }
</script>

然后我在我的控件的事件处理程序中使用了这段代码(例如单击一个按钮),我的控件位于更新面板中:

protected void myButton(object sender, EventArgs e)
{
    .....
    ScriptManager.RegisterStartupScript(this.Page, this.GetType(), "tmp", "<script type='text/javascript'>myFunction(params...);</script>", false);
}

成功的

于 2011-07-28T13:29:20.420 回答
5

听起来您需要一个具有客户端操作而不是回发的按钮。

<asp:Button ID="Clickable" runat="server" text="Click me" OnClientClick="JavascriptCall();" />

此外,虽然 jQuery 通常是向后兼容的,但直接引用 jQuery 最新的 .js 文件并不是一个好主意。相反,我会下载您想要的版本,并将其静态放置在您的站点上,以便直接参考已知版本。在不需要时添加对外部站点上资源的状态或可用性的依赖是不好的。

于 2009-02-16T23:32:32.533 回答
1

谢谢克里斯,

实际上是的,部分解决方案是直接调用 javascript 函数,但不是使用客户端控件,而是在我的 UpdatePanel 请求结束后调用 Javascript,如下面的博客中所述:

http://blog.jeromeparadis.com/archive/2007/03/01/1501.aspx

现在我的代码看起来像:

<link type="text/css" rel="stylesheet" href="css/ui.all.css" />

    <script type="text/javascript" src="jquery-latest.js"></script>

    <script type="text/javascript" src="ui.core.js"></script>

    <script type="text/javascript" src="ui.tabs.js"></script>

    <script type="text/javascript">

    //enable tabs if a deal is selcted or saved.
    function EndRequestHandler(sender, args) {
        var rec_id = document.getElementById('<%=hidden_value.UniqueID %>').value;

        if (rec_id=="")
            hidetabs();
        else
            showtabs();
    }

    hidetabs();

    $(document).ready(function(){
        $("#rec_entry").tabs();
    });

    function hidetabs(){
        $(document).ready(function(){
        $("#rec_entry").tabs();
        $('#rec_entry').data('disabled.tabs', [1, 2, 3, 4, 5]);});
    }

    function showtabs(){
        $(document).ready(function(){
        $("#rec_entry").tabs();
        $('#rec_entry').data('disabled.tabs', []);});
    }

    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);

    </script>

    ...html code add the tabs... 

后面的代码:

受保护的无效btn_Save_Click(对象发送者,EventArgs e){

        .... code to save the new record ........  

        UpdatePanel_mypanel.Update();
    }

面板更新后,EndRequestHandler 评估一个标志(在本例中为隐藏字段)并调用启用或禁用选项卡的 Javascript 函数。

由于我的 javascript 中包含这句话,endrequesthandler 得到了控制:

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);

我听从了您的建议,将 javascript 文件包含到我的项目中。再次感谢!

伊斯特兰

于 2009-02-18T05:41:07.910 回答