如果是条件,则从控制器返回JsonResult中的模态确认框

时间:2016-09-15 14:41:01

标签: javascript ajax asp.net-mvc

大家好我有以下情况:我有一个视图,其中有一个保存按钮,序列化一个表单,并通过Ajax发送到Controller中的JsonResult。在这个JsonResult里面,我在数据库中添加/编辑表。我的问题是,如果存在某种条件,是否可以向视图返回一个确认框。贝娄是我的代码。 谢谢你的进步:)

这是我视图中的javascript,它是通过ajax将表单数据发送到控制器。

None

这是我接收表单数据的Controller代码:

<script>
    function submitForm() {
        $.ajax({
            type: 'POST',
            url: '@Url.Action("UpdateEvent", "EventCalendar")',
            data: $('#UpdateEventForm').serialize(),
            success: function (eventoId) {
                $('#modal-edit-event').modal('hide');
                $('#calendar').fullCalendar('refetchEvents');

            }
        });
    }

}

1 个答案:

答案 0 :(得分:0)

是的,这是可能的。您所要做的就是返回在模式对话框中显示所需的HTML标记。

在这里,我使用的是RenderRazorViewToString方法(来自Ben Lesh's上的Render a view as a string答案)

public string RenderRazorViewToString(string viewName, object model)
{
    ViewData.Model = model;
    using (var sw = new StringWriter())
    {
        var viewResult = ViewEngines.Engines.FindPartialView(ControllerContext,
                                                                    viewName);
        var viewContext = new ViewContext(ControllerContext, viewResult.View,
                                        ViewData, TempData, sw);
        viewResult.View.Render(viewContext, sw);
        viewResult.ViewEngine.ReleaseView(ControllerContext, viewResult.View);
        return sw.GetStringBuilder().ToString();
    }
}

现在,您只需要根据需要调用此方法来获取viewresult的字符串版本

public ActionResult UpdateEvent()
{

    if (SomeConditionHere)
    {
       var modalMarkup = RenderRazorViewToString("MyModalView", null);
       return Json(new { status = "failed", data = modalMarkup },
                                                            JsonRequestBehavior.AllowGet);
    }
    return Json(new { status = "success", eventId = 123 }, JsonRequestBehavior.AllowGet);
}

假设您有一个名为MyModalView.cshtml的视图,其中包含引导模式对话框所需的标记,如下所示

<div class="modal-content">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                   <span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Modal title</h4>
    </div>
    <div class="modal-body">
        <h2>Modal content</h2>
    </div>
    <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
    </div>
</div>

确保您的ajax调用的成功事件回调方法正在检查返回的json数据,并根据status属性值,根据需要使用data / eventId。

success: function (res) {
    $("#myModal").remove();
    if (res.status === "failed") {
        $('<div id="myModal" class="modal fade"><div class="modal-dialog" role="document">'
                +res.data 
                +'</div></div>')
            .modal();
    } else {
        alert("eventId is : "+ res.eventId);
    }

}