在MVC中,如何确定部分视图响应是否有效(在客户端)?

时间:2011-11-10 21:28:26

标签: asp.net asp.net-mvc razor

我是MVC的新手,所以希望我的问题能够直截了当。我在想一个用户提交表单(即部分视图)并经过服务器验证的场景。我想知道在提交表单后我将如何知道客户端(javascript)上的验证结果。例如,如果验证失败,我显然希望再次返回部分视图并设置验证消息,但如果它通过验证,我可能不一定要返回局部视图。我可能想要返回带有消息的json对象或隐藏div或其他东西。我希望能够在客户端上确定验证结果。有可能吗?或者我可以用不同的方式处理这个问题吗?

3 个答案:

答案 0 :(得分:3)

AJAX的棘手部分是客户端和服务器都必须就在任何情况下应该从服务器返回的内容达成一致。您有几个选择:

  1. 您的服务器将始终返回HTML,jQuery将始终使用返回的HTML替换编辑器内容。如果模型无效,则返回PartialView结果。如果模型有效,则返回<script>标记,告知页面需要执行的操作(例如,关闭对话框,重定向到其他页面,等等)。当jQuery尝试将它们插入到DOM中时,它将自动运行它在结果中找到的任何脚本。
  2. 您的服务器将始终返回表示发生的事件的JSON对象。在这种情况下,您的客户端JavaScript代码必须足够复杂,以获取结果并修改您的页面以匹配。在正常情况下,这意味着您无法利用MVC的验证功能。
  3. 与2相同,不同之处在于您使用自定义实用程序方法将所需的局部视图呈现为字符串,并使整个字符串成为返回的JSON的一部分。然后javascript代码必须足够聪明,以检查JSON是否显示有效或无效的结果,如果结果有效,则将编辑器区域的内容替换为作为JSON对象的一部分返回的partialview HTML回来了。
  4. 与3相同,不同之处在于您开发了一个基于事件的体系结构,其中所有AJAX请求总是希望通过一个或多个&#34;事件&#34;返回一个JSON对象。在里面。然后可以将AJAX代码合并到一个方法中,将事件移交给事件总线。事件总线然后将事件信息传递给已经&#34;订阅&#34;的回调。对这些事件。这样,根据您从服务器返回的事件类型,您可以在客户端进行不同的操作。这种策略需要更多的前期工作才能到位,但一旦完成,您就可以获得更大的灵活性,客户端代码变得更加可维护。

答案 1 :(得分:2)

部分视图没有布局页面。您可以使用此代码检查视图是否呈现为部分视图。

@if (String.IsNullOrWhiteSpace(Layout))
{
  // Do somthing if it is partial view
}
else
{
     // Do somthing if it is full page view
}

答案 2 :(得分:0)

如果您使用MVC数据注释来验证模型,那么控制器将有一个名为ModelState (typeof(ModelStateDictionary)的属性,它作为IsValid的属性来确定您的模型是否传递给Controller / Action是有效的。

使用IsValid,您可以返回一个Json对象,该对象可以告诉您的Javascript下一步该做什么。

<强>更新

这是一个非常基本的例子(使用jQuery):

[SomeController.cs]
public class SomeController : Controller
{
    public ActionResult ShowForm()
    {
        return View();
    }
    public ActionResult ValidateForm(MyFormModel FormModel)
    {
        FormValidationResults result = new FormValidationResults();
        result.IsValid = ModelState.IsValid;
        if (result.IsValid)
        {
            result.RedirectToUrl = "/Controller/Action";
        }
        this.Json(result);
    }
}

[FormValidationResult.cs]
public class FormValidationResults
{
    public bool IsValid { get; set; }
    public string RedirectToUrl { get; set; }
}

[View.js]
$(document).ready(function()
{
    $("#button").click(function()
    {
        var form = $("#myForm");
        $.ajax(
        {
            url: '/Some/ValidateForm',
            type: 'POST',
            data: form.serialize(),
            success: function(jsonResult)
            {
                if (jsonResult.IsValid)
                {
                    window.location = jsonResult.RedirectToUrl;
                }
            }
        });
    });
});