Question

我正在使用Jquery Mobile和ASP.NET MVC4为iPad编写一个Web应用程序。

我的一个视图中有一个表单，如下所示：

@using (Html.BeginForm("UpdateClose", "WO", FormMethod.Post, new { id = "CloseForm" })) {
  <input type="hidden" name="idNumber" value="@Model.idNumber">              
  <a href="#popupCloseDialog" data-rel="popup" data-role="button" data-inline="true" data-position-to="window" data-transition="pop" style="width:96%; margin-top: 4px">Close</a>
}

上述表单中的＆lt; a href>在同一视图中调用弹出式对话框，如下所示：

<div data-role="popup" id="popupCloseDialog" data-overlay-theme="a" data-theme="b" data-dismissible="false"
    style="max-width:416px;" class="ui-corner-all">
        <div data-role="header" data-theme="a" class="ui-corner-top" >       
            <h1 class="ui-title" style="width:80%; margin-left:40px">Confirm</h1>        
        </div> 
        <div data-role="content" data-theme="a" class="ui-corner-bottom ui-content">      
            <h3 class="ui-title" style="text-align:center; height:22px;">Are you sure you want to close Order # @Model.idNumber?</h3>
            <br />                                             
            <a id="popupCloseSubmit" data-role="button" data-inline="true" data-rel="back"
            data-mini="true" data-theme="b" style="width:175px;" type="button">OK</a>
            <a href="#" data-role="button" data-inline="true" data-rel="back" 
                data-mini="true" data-transition="flow" style="width:175px; margin-left:10px" data-theme="b" >Cancel</a>                 
        </div>                   
</div>

请注意，此弹出窗口位于“CloseForm”之外。

当单击弹出窗口中的按钮时，我有简单的jquery提交“CloseForm”。这是：

$(document).on('pageinit', function () {
 $("#popupCloseSubmit").on("tap", pwHandler);
   function pwHandler(event) {
     try {
       $("#CloseForm").submit();
     }
     catch (e) {
       alert(e.Message);
     }
   }
});

现在，大部分时间都可以使用。单击表单中的“关闭”按钮时将调用“对话框”。一旦在弹出窗口内单击“popCloseSubmit”按钮，就会提交CloseForm，代码将进入“WO”控制器中的“UpdateClose”操作。但是，有时这个过程会挂起，网站就会挂起并且什么都不做。我已将事件日志记录放入我的Controller Action和我的数据库中，因此我可以确认当发生“挂起”行为时，代码永远不会进入“UpdateClose”操作。

这种行为的不一致令我感到困惑。似乎没有押韵或理由为什么会发生这种情况。

有没有人有任何想法？我还有另一种方法是从jquery移动弹出窗口提交表单吗？

请注意，我只是在iPad上进行测试 - 因为这是我们运作所需的唯一地方。提前感谢任何指示。

Answer 1

这个答案完全归功于@Omar，他提出了解决方案。经过多次测试，我可以说这就是我的答案。

当表单提交“挂断”时，这是因为表单试图在Jquery Mobile弹出框关闭之前提交。正如@Omar指出的那样，当弹出窗口打开时，URL会发生变化。

因此，我的解决方案是在表单提交之前强制关闭弹出窗口。

以下是代码：

$(document).on('pageinit', function () {
 var srclicked;
 $("#popupCloseSubmit").on("tap", srsubHandler);

   function srsubHandler(event) {
       srclicked = true;
   }

   $("#popupCloseDialog").on("popupafterclose", pcHandler);

   function pcHandler(event) {
       if (srclicked) {
           $("#CloseForm").submit();
           srclicked = false;
        }
   }
});

因此，弹出窗口#popupCloseDialog包含一个提交按钮（#popCloseSubmit）和一个取消按钮。单击submit（#popupCloseSubmit）按钮时，我将变量（srclicked）标记为true。每次#popupCloseDialog关闭时，“popupafterclose”事件都会触发。因此，当弹出窗口关闭时，我检查变量srclicked是否为真。如果是，我关闭表单（#CloseForm）并将变量设置为false。

我希望这有助于其他人。很多，非常感谢@Omar花时间在聊天中与我讨论这个问题。

从Jquery Mobile Pop-up提交表单

1 个答案: