1

我目前正在使用 MVC4 和 Jquery Mobile 为 iPad 构建移动应用程序。我有一个由 jquery 函数打开的弹出框(由用户单击视图中 iFrame 内的页面上的项目触发的函数)。弹出窗口出现后,用户可以单击“是”或“否”(作为确认)。如果用户单击“是”,我将在我的控制器中触发一个动作以执行一些数据库工作。一旦 Action 的工作完成,我将返回到我开始时的同一个视图,只是在我的模型中显示我现在想要显示的新信息。这大部分都有效。

正确触发了弹出窗口,单击“是”时会适当地触发该操作,我可以逐步执行该操作并查看我的数据库工作正确完成并使用新信息重新加载我的模型。我什至可以逐步查看它在返回视图时调用了正确的视图,并且新模型信息正在到达 HTML 帮助程序。

但是,Safari 中的页面从不刷新。它仍然和我去我的行动之前一样。我什至尝试完全返回另一个视图,看看是否会导致它刷新,但旧页面顽固地留在那里。

这是我认为的相关代码(WOTest):

@section Header 
{
   <script type="text/javascript">
        $(document).ready(function () {
            $('#popupSubmit').bind('click', function () {
                 $.post('@Url.Action("LoadTestData", "WO")', 
                 {CompKey:lblCompKey.innerHTML, ServiceRequestNumber:lblServiceRequestNum.innerHTML}); 
               });                              
        });



        function newWorkOrder(compkey, comptype, unitid) {
                        $('#popupDialog').popup('open');
                        $('#lblCompKey').html(compkey);
                        $('#lblCompType').html("CompType: " + comptype);
                        $('#lblUnitID').html("Unit ID: " + unitid);
       }


    </script>     
}

@section Content 
{ 
    <div data-role="content" data-theme="c">
        @using (Html.BeginForm("CreateSRTemp", "WO", FormMethod.Post))
        {           

            <div class="ui-grid-c" style="margin-bottom:6px;">  
                <div class="ui-block-a" style="width:32%; padding-right:2%;">  
                    <label id="lblAddress" style="font-weight:bold; color:#28608E;">Asset Address:<br /></label> 
                    @Html.TextBox("AssetAddress", Model.AssetAddress, new Dictionary<string, object>() { 
                    { "readonly", "true" }, { "data-mini", "true" } })  
                </div> 
                <div class="ui-block-b" style="width:22%; padding-right:2%;"> 
                    <label id="lblAsset" style="font-weight:bold; color:#28608E;">Asset:<br /></label>
                    @Html.TextBox("Asset", Model.Asset, new Dictionary<string, object>() { 
                    { "readonly", "true" }, { "data-mini", "true" } }) 
                </div> 
                <div class="ui-block-c" style="width:15%; padding-right:2%;">  
                    <label id="lblAssetID" style="font-weight:bold; color:#28608E;">Asset ID:<br /></label>
                    @Html.TextBox("AssetID", Model.AssetID, new Dictionary<string, object>() { 
                    { "readonly", "true" }, { "data-mini", "true" } })   
                </div> 
                <div class="ui-block-d" style="width:31%;">  
                    <label id="lblLogComment" style="font-weight:bold; color:#28608E;">Log Comment:<br /></label>
                    @Html.TextArea("LogComment", new Dictionary<string, object>() { { "data-mini", "true" } })   
                </div> 
            </div>  
            <div class="ui-grid-c"> 
                <div class="ui-block-a" style="width:25%; margin-top:8px;">
                    <label id="lblAssignedTo" style="font-weight:bold; color:#28608E;">Assigned To:<br /></label>
                     @Html.DropDownList("assignedTo", Model.listOfActiveEmps, "Select Employee", new { data_mini = "true" }) 
                </div> 
                <div class="ui-block-b" style="width:20%; margin-left:5px; margin-top:8px;">
                   <label id="lblPriority" style="font-weight:bold; color:#28608E;">Priority:<br /></label> 
                   @Html.DropDownList("priority", Model.listOfPriorities, "Select Priority", new { data_mini = "true" }) 
                </div> 
                <div class="ui-block-c" style="width:25%; margin-top:8px; margin-left:5px;">
                   <label id="lblWOType" style="font-weight:bold; color:#28608E;">WO Type:<br /></label> 
                   @Html.DropDownList("woType", Model.listOfWOTypes, "Select WO Type", new { data_mini = "true" }) 
                </div> 
                <div id="divCreateButton" class="ui-block-d" style="float:right; margin-top:27px;">                  
                    <input id="btnCreateWO" data-mini="true" data-theme="b" type="submit" style="height:35px;" value="Create WO" />               
                </div> 
            </div>
        }      

        <div data-role="popup" id="popupDialog" 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>Asset Selection <label id="lblServiceRequestNum" style="text-align:left;  height:22px; font-size:14px;">@Model.ServiceRequestNumber</label> </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?</h3>                             
                    <label id="lblCompKeyLabel" style="text-align:left;  height:22px; font-size:14px; margin-left:95px;">Comp Key: </label>                  
                    <label id="lblCompKey" style="text-align:left;  height:22px; font-size:14px;"></label>  
                    <label id="lblCompType" style="text-align:left;  height:22px; font-size:14px; margin-left:95px;"></label>                   
                    <a id="popupSubmit" data-role="button" data-inline="true" data-rel="back"
                    data-mini="true" data-theme="b" style="width:150px;" type="submit">Yes</a>
                    <a href="#" data-role="button" data-inline="true" data-rel="back" 
                        data-mini="true" data-transition="flow" data-theme="b" style="width:150px;">No</a> 
                </div> 

        </div>         

    </div>  
    <h5>@ViewBag.Message</h5>             

    <div class="ui-grid-solo"> 
        <div id="mapDiv" class="ui-block-a" style="margin-top:8px; width:100%;">  
            @{  
                string xPoint = "?xPoint=" + @Model.XCoordinate;
                string yPoint = "&yPoint=" + @Model.YCoordinate;
                string _uri = "/test/Map.htm" + xPoint + yPoint;
                if (Request.IsLocal)
                    _uri = "../../Map.htm" + xPoint + yPoint; 
                <iframe id="mapIframe" width="100%" src="@_uri"></iframe>
             }  
        </div> 
    </div>

弹出窗口在 WOController 中调用此操作:

    [HttpPost]
    public ActionResult LoadTestData(string CompKey, string ServiceRequestNumber)
    {
       //Do Database stuff, load model properties with new info
       return View("WOTest", srModel); 

     }

此操作应返回与模型中的新信息相同的视图 (WOTest)。我已经逐步完成了操作代码,它按预期工作。最后发送给 WOTest 的 srModel 具有正确的新信息……有人知道为什么它没有显示在 WOTest 中吗?就好像 WOTest 根本不刷新一样。

我试过使用 ModelState.Clear,但这没有帮助。

任何帮助将不胜感激。谢谢!

4

1 回答 1

0

如果有人发现这一点,我最终通过将需要更新的视图部分分离为部分视图来解决我自己的问题。然后我在我的主视图 (WOTest) 中放置了一个占位符 div (#detailsDiv)。我还将我的操作 (LoadTestData) 更改为返回部分视图而不是返回主视图。因此,我更改了我的 jquery,以便在单击弹出窗口的提交按钮时加载部分视图,如下所示:

    $(function () {
        $("#popupSubmit").bind("tap", tHandler);

        function tHandler(event) {
            $.post('@Url.Action("LoadTestData", "WO")', { CompKey: lblCompKey.innerHTML, ServiceRequestNumber: lblServiceRequestNum.innerHTML }, 
            function (data) { $('#detailsDiv').html(data); $('#detailsDiv').trigger("create"); });
        }
    });

不幸的是,这只解决了我在桌面 Safari 中的问题……我必须为 iPad 找到另一个解决方案。

于 2013-08-16T19:25:43.873 回答