1

我正在尝试在 Jquery Mobile 面板中打开一个新的 Web 表单。我正在尝试在 webform3.aspx 上打开一个面板,并尝试从 webform3.aspx 调用一个名为 webform2.aspx 的新 Web 表单。下面是我的代码:

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
      <title>Panel</title>
      <meta name = "viewport" content = "width = device-width, initial-scale = 1">
      <link rel = "stylesheet" href = "https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
      <script src = "https://code.jquery.com/jquery-1.11.0.min.js"></script>
      <script src = "https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
</head>
<body>
    <form id="form1" runat="server">

          <div id="languagePanel" class="ss-panel-language ui-panel ui-panel-position-right ui-panel-display-overlay ui-panel-closed ui-body-inherit ui-panel-fixed ui-panel-animate" data-role="panel" data-position="right" data-display="overlay" data-position-fixed="true">
           <div class="ui-panel-inner"><div id="languagePanelInternal" class="ss-panel-language-internal"></div></div>
        </div>
         

          <a href="#languagePanel" class="ss-header-actions-language ui-link">
              test
         </a>
         
        <script>

var languageUrl = "WebForm2.aspx";
            $("#languagePanel").on("panelbeforeopen", function () {
                $("#languagePanelInternal").load(languageUrl, function () {
                    $("#languagePanelInternal").trigger("create");
                    $("#languagePanel").trigger("updatelayout");
                    $.mobile.activePage.trigger("pagecreate");
                });
            });
        </script>
    

     
    </form>
</body>
</html>

在 WebForm2.aspx 上,我只有两个简单的单选按钮和一个提交按钮,下面是我的代码:

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <div >
            <asp:RadioButton ID="rdbEng" runat="server" Text="English" GroupName="lang"   />
             <asp:RadioButton ID="rdbspan" runat="server" Text="Español" GroupName="lang"  />
        </div>
        <div >
            <asp:Button runat="server" Text="Submit" OnClick="Submit_Click"   />
        </div>
        </div>
    </form>
</body>
</html>

webform3.aspx 上的面板工作正常,单选按钮也显示良好,但是当我单击提交按钮时,什么也没有发生。代码不去后面的代码。提交按钮背后的代码如下:

protected void Submit_Click(object sender, EventArgs e)
        {

            if (rdbEng.Checked == true)
            {
                Session["language"] = "en-US";


            }
            else if (rdbspan.Checked == true)
            {
                Session["language"] = "es-MX";


            }
        }

下面是我所看到的屏幕截图,单击提交按钮没有做任何事情。我希望控件在单击提交按钮时执行 Submit_Click 事件。

在此处输入图像描述

4

1 回答 1

1

JQM 面板需要一些标记,而不是整个 HTML 页面。

因此,jQueryload需要正确的选择器:

var languageUrl = "WebForm2.aspx #form1";

这是 jQuery 文档:jQuery .load()

我坚信您还需要仔细检查您的页面标记以及您如何调用面板的增强功能。

避免在内部使用两次id form1WebForm2.aspx,并且只使用您需要的内容(即单选按钮)填充您的面板。

此外,我相信您的 JavaScript 代码适用于旧的 JQM 版本。对于 JQM 1.4.5$("#languagePanelInternal").enhanceWithin();就足够了。

于 2020-07-30T06:40:50.417 回答