在ASP上执行回发.Net控件通过jQuery动态添加

本文关键字:jQuery 动态 添加 控件 Net ASP 执行 | 更新日期: 2023-09-27 18:13:48

我有一个在ASP.Net下运行的网站。它有许多ascx控件,每个控件代表一个不同的页面。母版页将调用ascx上的LoadControl(),然后将其添加到面板中。然后,ascx Page_Load()将个人保存函数与页面上的事件相关联,以便母版页上的"保存"按钮执行正确的操作。

我现在正试图变得更动态,更多地使用jQuery,更多地在客户端做事情。为此,我正在尝试动态加载ascx控件。我们的目标是能够在对每个ascx进行最小更改的情况下做到这一点。我有一个页面,包含以下内容(为简洁而编辑):

<head>
<script language="javascript" type="text/javascript">
function documentMetadataLoad()
{
    jQuery.ajax({
      type: "GET",  //GET
      url: "JQueryHandler.ashx?Operation=LoadPage&Name=/UserControls/DocumentManagment/DocumentMetadata.ascx",
      dataType: "html",
      cache: false,
      success: function (response)
      {
        $('#property_tab').html(response);
      },
      error: function ()
      {
        debugger;
        $('#property_tab').html('error');
      }
    });
</script>
</head>
<body id="mainBody" class="bodyClass">
<form id="form1" runat="server">
<div id="btn_save">
    <a href="#" id="btnSave" class="topBtnText">Save</a>
</div>
<div>
    <div id="tab1" onclick="documentMetadataLoad(); ">Properties</div>
</div>
<div id="property_tab" style="display: Block;"></div>
</form>
</body>

这个页面将动态加载一个名为DocumentMetadata的控件。当用户单击选项卡时,Ascx。(是的,我知道当客户端通过控制路径时可能存在一个巨大的安全漏洞,但这是一个概念验证。)

JQueryHandler将采用给定的路径并生成一个页面。它的ProcessRequest()看起来像这样:

public void ProcessRequest(HttpContext context)
{
    if (context.Request.QueryString["Operation"] == "LoadPage")
    {
        String strPath = context.Request.QueryString["Name"];
        using (TisPage MyPage = new TisPage())
        {
            HtmlForm f = new HtmlForm();
            f.Action = context.Request.UrlReferrer.AbsolutePath;
            UserControl userctrl = MyPage.LoadControl(strPath) as UserControl;
            f.Controls.Add(userctrl);
            MyPage.Controls.Add(f);
            context.Server.Execute(MyPage, context.Response.Output, true);
        }
    }
}

(感谢http://www.infoconcepts.com/rendering-ascx-files-ajax/指示HtmlForm应该包装控件。)TisPage是System.Web.UI的一个子类。页,其中添加了ascx期望的用于保存数据的事件。

现在,我遇到的问题是我想要DocumentMetadata。在用户按下#btnSave时调用它的save函数。这是后面的代码,它希望保留其视图状态。所以我想我必须有一个回发。我不希望重写c#的保存函数,使其成为传入参数的自己的ashx调用;有很多这样的页面,不值得把它们都重写一遍。

我在DocumentMetadata中有以下代码。

设置按钮。
$(document).ready(function ()
{
    $("#btnSave").bind("click", Save);
});
function Save()
{
    debugger;
    __doPostBack('ctl00', null);
}

我通过在Javascript中调用__doPostBack()进行实验,但我随后得到错误:"视图状态MAC的验证失败。如果此应用程序由Web Farm或集群托管,请确保配置指定相同的validationKey和验证算法。不能在集群中使用AutoGenerate。"作为一个实验,我试图从我的网页中删除我的机器密钥配置。配置,但这似乎没有帮助。

是否有一种方法可以使用JavaScript调用加载了jQuery的ascx控件背后的代码?

在ASP上执行回发.Net控件通过jQuery动态添加

通过ajax加载.ascx控件与加载字符串相同。它是单向管道,并且该控件没有可用的回发通信。UpdatePanel解决方案也不会起作用(而且它们也很糟糕)。

我的建议是创建客户端模板,使用像Mustache.js这样的东西,然后通过ajax加载JSON数据来填充这些模板,并用ajax与web服务与服务器/数据库通信。通过分离你的代码,它将更容易维护,你将能够重用更多的代码,更好的效率等。

post -back是老派的技术,而UpdatePanels只是ajax的一个令人讨厌的实现。花点时间做正确的事情,为了你的应用和你自己,你会因此变得更好。

如果使用UpdatePanel,您在这里所做的可以更容易地完成。它通过部分回发在客户端工作,并且保留了ASP页面生命周期。你可以包装你的#property_tab#btnSave与UpdatePanels和管理回发事件服务器端。

相关文章: