【问题标题】:Passing arguments from one asp.net page to another using jQuery使用 jQuery 将参数从一个 asp.net 页面传递到另一个页面
【发布时间】:2011-01-02 08:22:40
【问题描述】:

我需要使用 jQuery 将 4 个参数(3 个字符串和一个逗号分隔列表)从 ASP.NET 页面传递到另一个 ASP.NET 页面。目标页面应该作为一个单独的窗口启动,它适用于以下 jQuery sn-p:

$('#sourcePageBtn').click(function(){
   window.open("destinationPage.aspx");
   return false;
});

如何将参数传递给目标页面?我试图避免查询字符串传递参数,因为:

  1. 我不想在目标窗口中显示 url 参数(也可能很长)。

  2. 字符串参数中有一些特殊字符,如'、/、\、&等。

请提出建议。

编辑: 我正在尝试访问 aspx 文件的脚本部分中的参数,即

<script language="C#" runat="server">
    protected void Page_Load ( object src, EventArgs e) 
    {
     //Creating dynamic asp controls here
    }
</script>

我对脚本部分 Page_Load 中参数的具体需求源于我在 Page_Load 中创建了一些依赖于这些参数的动态图表控件。

干杯

【问题讨论】:

    标签: asp.net jquery


    【解决方案1】:

    初步想法(在创建解决方案之前)

    1. 对大数据使用 POST 而不是 GET。使用 POST 不会将查询字符串用于数据,因此 URL 长度限制不是问题。 (不同浏览器的最大 URL 长度不同,因此在移动大数据时您应该远离它)。

    2. 特殊的 URL 字符可以是 encoded 以在查询字符串中传递,所以这应该不是问题。

    或者,您可以将数据从第一页存储在服务器端,并让第二页从服务器端获取数据。但这太过分了。它使您可以进行不需要的服务器编程。

    通过 HTTP 调用传递状态是标准做法。你不应该试图规避它。使用它。所有的设施都是为你而建的。现在只需要 jQuery 来为我们提供一些帮助......

    注意: 小心在浏览器禁用 JavaScript 的情况下使用 jQuery 实现主要应用功能。在大多数情况下,即使禁用了 JavaScript,您的 Web 应用程序也应该在基本级别上可用。在这工作之后,在 JavaScript/jQuery 上进行分层以使体验更好,甚至很棒。

    编辑:解决方案(使用 ASP.NET 处理)

    解决方案实施的关键资源是:

    它是如何工作的:从一个主页,一个 POST 发生并且结果显示在一个弹出窗口中。它按以下顺序发生:

    • 主脚本打开一个弹出窗口(如果它不存在)
    • 主脚本等待弹出窗口完全初始化
    • 主脚本 POST(使用 AJAX)参数到另一个页面(发送请求)
    • 主脚本接收响应并在弹出窗口中显示。

    实际上,我们已将数据发布到弹出窗口并将参数传递给处理。

    接下来是三个页面,它们构成了完整的解决方案。我将所有 3 个都放在我的桌面上,它可以在 Google Chrome 稳定版 3.0.195.38 中运行。其他浏览器未经测试。您还需要将jquery-1.3.2.js 放在同一个文件夹中。

    ma​​in_page.html

    这是您提供的逻辑的扩展。示例使用链接而不是表单按钮,但它具有相同的id=sourcePageBtn

    此示例在 POST 发生时传递两个键/值对(仅作为示例)。您将在此位置传递您选择的键/值对。

    <html>
    
    <head>
    <script type="text/javascript" src="jquery-1.3.2.js"></script>
    </head>
    
    <body>
    
    <a id="sourcePageBtn" href="javascript:void(0);">click to launch popup window</a>
    
    <script>
    
    $(function() {
     $('#sourcePageBtn').click( function() {
    
      // Open popup window if not already open, and store its handle into jQuery data.
      ($(window).data('popup') && !$(window).data('popup').closed) 
       || $(window).data('popup', window.open('popup.html','MyPopupWin'));
    
      // Reference the popup window handle.
      var wndPop = $(window).data('popup');
    
      // Waits until popup is loaded and ready, then starts using it
      (waitAndPost = function() {
       // If popup not loaded, Wait for 200 more milliseconds before retrying
       if (!wndPop || !wndPop['ready']) 
        setTimeout(waitAndPost, 200);
    
       else  { 
           // Logic to post (pass args) and display result in popup window...
        // POST args name=John, time=2pm to the process.aspx page...
        $.post('process.aspx', { name: "John", time: "2pm" }, function(data) {
         // and display the response in the popup window <P> element.
         $('p',wndPop.document).html(data);
        });
       }
      })(); //First call to the waitAndPost() function.
    
    
     });
    });
    
    </script>
    </body>
    </html>
    

    popup.html

    这是从主页定位的弹出窗口。您将在主页的 jQuery 脚本中看到对 popup.html 的引用。

    在弹出窗口 DOM 最终加载时设置 window['ready'] = true 有一个“技巧”。主脚本一直检查并等待此弹出窗口准备好。

    <html>
    
    <head>
    <script type="text/javascript" src="jquery-1.3.2.js"></script>
    </head>
    
    <body>
     <!--  The example P element to display HTTP response inside -->
     <p>page is loaded</p>
    </body>
    
    <script>
        $(function() {
         window['ready'] = true;
        });
    </script>
    
    </html>
    

    process.aspx.cs(C# - ASP.NET process.aspx 页面)

    主页面脚本将参数发布到的动态服务器页面。 AJAX 参数到达Page.Request 集合。 对于本示例,输出以纯文本形式返回,但您可以根据应用要求自定义响应。

    public partial class process : System.Web.UI.Page {
    
        protected void Page_Load(object sender, EventArgs e) {
            // Access "name" argument.
            string strName = Request["name"] ?? "(no name)";
            // Access "time" argument. 
            string strTime = Request["time"] ?? "(no time)";
    
            Response.ContentType = "text/plain";
            Response.Write(string.Format("{0} arrives at {1}", strName, strTime));
        }
    
        protected override void Render(System.Web.UI.HtmlTextWriter writer) {
            // Just to suppress Page from outputting extraneous HTML tags.
            //base.Render(writer); //don't run.
        }
    
    }
    

    此结果由原始/主页显示到弹出窗口中。 所以弹出窗口的内容被"[name] arrives at [time]"覆盖了


    主要参考文献:HTTP Made Really EasyjQuery Ajax members and examples.

    【讨论】:

    • 谢谢。我需要从 jQuery 按钮单击处理程序启动目标页面,因为我正在收集 jQuery 按钮单击中几个 HTML 元素的 id 和文本值。其次,我需要启动一个新页面,而不是重定向。 window.open() 为我这样做,但我认为它不支持类似 POST 的行为。
    • 我进行了编辑以包含指向 jQuery POST 示例的链接。我的方向正确吗?
    • 再次感谢。你的大部分回复对我来说很有意义。并且 $.POST() 确实将控制权带到了目标页面。但是控件返回到源页面。此外,目标页面不会作为单独的页面启动。
    • 我还在研究它。代码示例正在进行中...,但是现在有趣的是在主窗口中使用 jQuery 语法 $(element, context) 并通过提供弹出窗口句柄作为上下文 jQuery 正在访问弹出窗口的 DOM 并仅显示内容在弹出窗口中看到。希望 .get 和 .post 也可以用来影响弹出窗口……时间会证明一切。
    • 解决方案完成。它会打开一个弹出窗口并将数据从您的主页发布到它 - 该解决方案根据您的要求使用 jQuery/AJAX。如果只是将源代码复制粘贴到三个文件中,可以自己运行。
    【解决方案2】:

    如果您在打开新窗口时保留对新窗口的引用,即var destWin = window.open(...),那么您可以访问destWin 窗口对象上的变量和方法。或者,您可以使用window.opener 从目标窗口“返回”。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2016-01-24
      • 1970-01-01
      • 2021-01-14
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多