Ajax没有使用jquery validate plugin

Ajax not working with jquery validate plugin

我的Ajax成功/失败事件没有触发。我正在使用jquery验证,在内部,我正在使用ajax进行表单提交。我的表单将被提交,但返回值(JSON数据)并没有如Ajax中所描述的那样显示。

我试图使用alert(),但它也没有启动。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
<script type="text/javascript">
$('document').ready(function()
{

    $("#alert-form").validate({
          ignore: '',
          messages: {
            select2Start: {
              required:"Please select your starting point.",

            }
          },

        //});
        submitHandler: function(form) {

                e.preventDefault;
                var btn = $('#publish');
                btn.button('loading');
                alert('valid form submission');

                $.ajax({
                    type: 'post',
                    url:$('form#alert-form').attr('action'),
                    cache: false,
                    dataType: 'json',
                    data: $('form#alert-form').serialize(),
                    beforeSend: function() {
                        $("#validation-errors_alert").hide().empty();
                    },
                    success: function(data) {
                        if(data.success == false)
                            {
                                var arr = data.errors;
                                $.each(arr, function(index, value)
                                {
                                    if (value.length != 0)
                                    {
                                        $("#validation-errors_alert").append(''+ value +'');
                                    }
                                });
                                $("#validation-errors_alert").show();  
                                btn.button('reset');                            
                            }else{
                            //  alert("Job Alert Configured successfully.");
                                 $("#job_success_alert").append('Alert Configured successfully.');
                            }
                    },
                    error: function(xhr, textStatus, thrownError) {
                    alert('Something went to wrong.Please Try again later...');
                        alert(thrownError);
                        btn.button('reset');

                    }
                });            
                return false;
        }
            });

        });


正如巴默在他的第一次评论中指出的,这个代码有几个问题…

1
2
3
 submitHandler: function(form) {
     e.preventDefault;
     ....
  • submitHandler函数中不存在变量e

  • 你没有在.preventDefault()中包含括号。

  • 在这个上下文中不需要.preventDefault(),因为插件已经阻塞了默认提交。完全拆下此管路。

  • 笔记:

    为了提高可读性,不要将Allman与1tbs样式的代码格式混合使用…只是要始终如一。另外,最好避免在JavaScript中使用Allman。