$ajax 命令和 Json 响应答案

【问题标题】：$ajax command and Json response$ajax 命令和 Json 响应
【发布时间】：2012-12-19 16:35:52
【问题描述】：

在我的 django 应用程序中，我尝试使用 ajax 来检查用户名是否已经存在，如果是则显示错误。

这就是我所拥有的

html:

 <form  method="post" id='my_form'>
 {% csrf_token %}
    <input id='username' type="text" name="username"/>
 <button type="submit">Valider</button>
 </form>

js:

  $('#my_form').submit(function(){
    var username = $('#username').val();
    if (username == ''){
       alert('please enter username');
       return false;
    }

    $.ajax({
           type: "POST",
           url: "/auth_validate",
           data: {'username': $('#username').val(), 'csrfmiddlewaretoken': '{{csrf_token}}'},
           dataType: "text",
           success: function(response) {
                  var response = $.parseJSON(response);
                  if (response.success){
                      return true;
                  }
                  else{
                      alert(response.error);
                      return false;
                  }
            },
            error: function(rs, e) {
                   alert(rs.responseText);
                   return false;
            }
      }); 
})

观看次数：

def auth_validate(request):
    error = ''
    success = False
    if request.method == 'POST':
        username = request.POST.get('username', None)
        if not username:
            error = _('Please enter username')
        elif User.objects.filter(username__exact=username).exists():
            error = _('Sorry this username is already taken')
        else:
            success = True

    ajax_vars = {'success': success, 'error': error}
    return HttpResponse(simplejson.dumps(ajax_vars), mimetype='application/javascript')

当我输入用户名（如果存在或不存在）时，会出现一个空警报，当我单击“确定”时，会提交表单。而且，错误不会出现。

知道为什么它不起作用吗？

感谢您的帮助。

【问题讨论】：

你应该总是在你的 $.ajax 块之后添加一个 return false ，否则你无论如何都会提交你的表单。
@SamueleMattiuzzo 我编辑了它。但什么都没有改变。

标签： jquery ajax django

【解决方案1】：

您的视图和模板看起来不错我建议您使用原生的JSON 处理函数并序列化表单，而不是手动“发送”data。另请注意事件回调结束时的return false，而不是success 和error 回调内。

$('#my_form').on('submit', function(){
    var $form = $(this);
    $.ajax({
        type: "POST",
        url: "/auth_validate",
        data: $form.serialize(),
        dataType: "json",
        success: function(response) {
            if (!response.success) {
                alert(response.error);
            } else {
                alert('This username is available!');
            }
        },
        error: function(rs, e) {
            alert(rs.responseText);
        }
    });
    return false;
});

祝你好运:)

更新：

请检查成功回调中的 else ;)

【讨论】：

感谢您的帮助。当我尝试这个解决方案时，我有一个巨大的警告框出现一个非常大的错误消息，开头是这样的： TypeError at /auth_validate/ is not JSON serializable 关于问题出处的任何想法来自哪里？
您能否提供一个包含完整堆栈跟踪的 dpaste/gist 的链接，以便我或其他人可以提供帮助？（请不要在这里粘贴）
好的，它工作。我刚刚收到了一个非常大的 error_message，因为我在本地工作并且调试为 True。非常感谢您的帮助。
但是我没有文本“请输入用户名”或“对不起这个用户名...”当用户名为空或被占用时，我只是有一个内部服务器错误，如果用户名未被占用。
如果出现服务器错误，您的视图不会返回任何这些错误消息；您正在通过HttpResponses 处理验证错误，因此您应该分开处理服务器错误。我的意思是，错误消息都在成功回调中处理。错误回调适用于请求因任何原因崩溃时。

【解决方案2】：

因为这部分：

         var response = $.parseJSON(response);
          if (response.success){
              return true;
          }
          else{
              alert(response.error);
          }

response 没有值“success”，因此会弹出一个 emply 警报对话框。 jQuery 已经注意了，这个检查只在请求成功时进行，所以你不要这样做。

如果您不想使用for的浏览器提交，请在函数末尾添加return false;以防止浏览器默认行为。

【讨论】：

我不确定这是不是问题，因为弹出的警报是错误功能之一。如果我删除函数的第一部分（成功：函数...），仍然会出现空警报。
我试图把一个 return false;在我的 ajax 函数结束时。但是当我发布一些内容时，我现在遇到了 403 错误，并弹出一个解释这是由于 csrf 令牌问题引起的。

【解决方案3】：

django 响应的 JSON 是什么样的？

你知道哪个警报被调用了吗？是错误函数还是成功函数中的那个？

我认为你不需要这条线

var response = $.parseJSON(response);

响应应该已经是 JSON。

【讨论】：