【问题标题】:Call Action Method, close dialog and refresh parent调用 Action 方法,关闭对话框并刷新父级
【发布时间】:2015-02-24 16:52:40
【问题描述】:

由于我是 MVC5 的新手,所以我可能会错误地思考这个问题。

我有一个 CustomerInfo.cshtml 视图,其中列出了 CustomerContacts。他们旁边是一个“+”图标,它将打开一个对话窗口并允许他们添加新的 CustomerContact。

在对话框打开时,我调用 CustomerContactController Create GET 方法(将 customerId 设置为我的模型并将其传递给视图)。

在保存时,我调用 CustomerContactController 创建 POST 方法设置值并保存到数据库。

此时我如何关闭对话窗口并刷新父 CustomerInfo.cshtml 页面,以便新联系人出现在列表中。所有的 Action 方法都要求我返回一些东西。

我正在从 CustomerInfo.cshtml 视图中打开我的对话框,如下所示:

@(Html.Kendo().Window()
    .Name("windowContact")
    .Title("New Customer Contact")
     .LoadContentFrom("Create", "CustomerContact", new { customerId = Model.Id })
    .Draggable()
    .Width(680)
    .Visible(false)
    .Events(events => events.Open("centerWindow"))
)

在对话框窗口中,我有一个剃刀表单。这是对话框的底部:

            <input type="submit" value="Save" id="btnSave" class="btn btn-primary" />
            <input type="button" value="Cancel" id="btnCancel" class="btn btn-default" />
}

<script>
    $("#btnCancel").click(function () {
        $("#windowContact").data("kendoWindow").close();
    });
</script>

这是我目前正在做的事情,它让我回到 CustomerInfo 视图,但刷新了。是使用 AJAX 顺利完成的唯一方法吗?

return RedirectToAction("CustomerInfo", "Customer", new { id = custContact.CustomerId });

【问题讨论】:

  • 你能发布你的代码吗?打开对话框?您使用的是哪个对话框?
  • 使CustomerInfo.cshtml 成为局部视图,一旦您添加新客户并关闭对话框,在jQuery Ajax 调用的帮助下再次加载CustomerInfo.cshtml 局部视图。
  • 我发布了我的代码。我设置了我的取消按钮,但在保存时我不知道在调用 Create POST 操作并将联系人保存到数据库后该怎么做。

标签: javascript jquery asp.net-mvc razor asp.net-mvc-5


【解决方案1】:

通过 jQuery Ajax 发布 Create 视图的表单数据。喜欢:

$.ajax({
  url: '/Create/CustomerContact',
  type: 'post',
  contentType: "application/x-www-form-urlencoded",
  data: $form.serialize(),
  success: function (data, status) {
    // here close the window and refresh parent  
    // if your new window is opened in iframe  
    window.parent.location.reload();
    $("#windowContact").data("kendoWindow").close();

    // if your new window is opened by window.open() method.
    window.opener.location.reload();
    self.close();
  },
  error: function (xhr, desc, err) {
    alert("Desc: " + desc + "\nErr:" + err);
  }
});

希望它对你有用,谢谢。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2017-06-13
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多