ASP.NET MVC中的jQuery AJAX响应

时间:2009-08-12 05:55:19

标签: jquery asp.net-mvc ajax validation response

甚至不确定这是否是标题问题的正确方法。我知道我的AJAX调用都是错误的...这就是我现在正在做的事情(顺便说一句,我使用的是ASP.NET MVC后端):

我使用jQuery.ajax将一些数据发布到一个动作,这将加载我在响应中捕获的视图。它基本上是为一个动作提供了一些数据,并且还带回了一些HTML。

假设我想创建一个经过验证的Ajax调用。如何在出错时收回验证消息?例如,Ajax登录表单。如果用户无法验证,我想告诉他们......而不是简单地无所事事。

很抱歉这个天真的问题,我只是不知道如何在Google上找到解决方案。

提前谢谢!

4 个答案:

答案 0 :(得分:7)

首先,如果您希望AJAX调用返回您计划在脚本中使用的数据(并且使用我的意思是更复杂,然后在div中显示该数据),您应该返回JSON数据而不是来自服务器的HTML。 JSON实际上是一个JS对象,所以它可以在收到它的时候用在JS中。

因此,如果您返回数据,即

{id: 1, status: 'ok'}

你可以使用这样的东西来使用这些数据。

$.ajax({
    url: "your/script/url",
    type: "POST",
    data: {login : 'foo', pass: 'bar'}, // whatever the data is
    dataType: "json",
    success: function(data){
        if (data.status === 'ok') {
            console.log('success');
        } else {
            console.log('error');
        }
    }

});

答案 1 :(得分:5)

您需要为回复返回多条信息。幸运的是,你可以使用JSON轻松地做到这一点,如果你告诉它响应类型是json,jQuery会自动为你处理它。进入ajax回调函数的对象将包含您需要的所有数据作为不同的属性。

我建议养成每次ajax调用返回“成功”或“失败”状态代码的习惯,以及一系列错误。 See this awesome blog post了解有关我的意思的更多信息。

这样做的原因是ajax调用总是从根本上“成功”,除非服务器实际上无法处理请求并返回失败的http状态代码。如果请求的结果类似于验证错误,但服务器仍然返回某种文本响应,那么即使应用程序操作失败,仍然认为ajax调用已成功。

因此,如果在操作方法中,如果返回了这样的对象,而不是在动作结果中返回html数据:

public class AjaxResponse
    {
        /// <summary>
        /// Initializes a new instance of the <see cref="AjaxResponse"/> class.
        /// This creates an AjaxResponse that by default indicates SUCCESS.
        /// </summary>
        public AjaxResponse()
        {
            Success = true;
            Data = new List<object>();
        }

        /// <summary>
        /// Initializes a new instance of the <see cref="AjaxResponse"/> class.
        /// This creates an AjaxResponse that indicates FAILURE.
        /// </summary>
        /// <param name="exception">The exception.</param>
        public AjaxResponse(Exception exception)
            : this()
        {
            Success = false;
            Errors = new [] { exception.Message };
        }

        /// <summary>
        /// Initializes a new instance of the <see cref="AjaxResponse"/> class.
        /// This creates an AjaxResponse that indicates SUCCESS.
        /// </summary>
        /// <param name="data">The data.</param>
        public AjaxResponse(object data)
            : this()
        {
            Data = data;
        }

        /// <summary>
        /// Gets or sets a value indicating whether this <see cref="AjaxResponse"/> is success.
        /// </summary>
        /// <value><c>true</c> if success; otherwise, <c>false</c>.</value>
        public bool Success
        {
            get; set;
        }

        /// <summary>
        /// Gets or sets the data.
        /// </summary>
        /// <value>The data.</value>
        public object Data
        {
            get; set;
        }

        /// <summary>
        /// Gets or sets the errors.
        /// </summary>
        /// <value>The errors.</value>
        public string[] Errors
        {
            get; set;
        }
    }

这将转换为具有“.Success”,“。Data”和“。Errors”属性的javascript对象。

因此,如果您的验证代码已填充Errors数组并包含所有验证错误,那么您的ajax回调函数将很容易

  1. 确定调用的预期目的失败,因为SUCCESS属性设置为“失败”。

  2. 获取所有相关的错误字符串。

  3. 您可以在动作方法中使用这种模式轻松完成此操作:

        try
        {
            instance.Validate();
            return Json(new AjaxResponse(myHtmlData));
        }
        catch(Exception ex)
        {
            var response = new AjaxResponse(ex);
    
            // Get your validation errors here, put them into
            // your ajax response's Errors property.
    
            return Json(response);
        }
    

答案 2 :(得分:2)

blogged about this same situation。也许它会在你的情况下帮助你。它基本上是关于具有自定义异常类和将返回错误的异常操作属性。因此,您可以使用success来电的error$.ajax选项。在我看来,这是正确的做法。

$.ajax调用确实提供了处理成功和错误响应的功能。无需始终返回成功,并设置了必须在客户端上检查的错误标志。

答案 3 :(得分:0)

我不确定我是否完全明白你的意思。但是关于错误的验证消息的示例不会像下面这样工作:

  1. 用户点击某些按钮/链接导致操作的任何内容
  2. asynchronouse帖子已经回到服务器,传输用户ID(你应该知道这里的安全性)
  3. 在服务器上完成必要的验证并发回一个响应(在XML中,Json,直接编码为HTML的消息)
  4. 回到客户端,您可以在JavaScript代码中获得响应并将其正确放置在页面上
  5. 希望有所帮助。