Question

我有一个提交表单的按钮，我想首先触发jquery验证并检查表单是否有效。我尝试在下面执行此操作但没有任何作用，即使在控制台中没有显示任何内容。

HTML：

    <form method="POST" action="<?php echo $url;?>" id="add_group" class="add_group">
    <!-- My other fields-->
<input class="btn btn-primary" type="button" name="submit" id="submit" value="Submit">
</form>

JQuery的 AJAX致电：

$('#submit').click(function(){
        formSubmit();
    });
function formSubmit()
    {
        var group_url = "{{ url('admin/groups/add') }}";
        var redirect_group_url = "{{ url('admin/groups') }}";
        var token = $('#token').val();
        $.ajax({
            headers: {
                'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
            },

            url: group_url,
            type: 'POST',
            data: $("#add_group").serialize(),            
            success: function (data) {
                data = JSON.parse(data);
                console.log(data);
                if(data.status == 'failed' || data.status == false)
                {
                    $('.alert-danger').show();
                    $('.alert-danger').html(data.message);
                } else 
                {                    
                    window.location.href = redirect_group_url;
                    /*$('.alert-success').show();
                    $('.alert-success').html(data.message);*/                    
                }
            },
            error: function (data) {                
                $('.alert-danger').show();
                $('.alert-danger span.show_error_msg').html(data.message);
            }
        });
        setTimeout(function() { $(".alert").hide(); }, 3000);
    }

我的Jquery验证我保留了document.ready功能

$('.add_group').on('click','#submit', function(){
        //var $this = $(this);
        $("#add_group").validate({
            rules: {
                group_title: {   
                    required: true,
                }, 

                group_id:{
                    required: true,
                },
            },       
            messages: {

                group_title: {
                    required: "Please enter group title",
                },

                group_id:{
                    required: "Please choose group",
                },
            },
            errorPlacement: function (error, element) {
                var attr_name = element.attr('name');
                error.insertAfter(element);            
            }
        });

        });

谁能告诉我哪里错了？

Answer 1

$('#add_group').submit(function(){
          $("#add_group").validate({
            rules: {
                group_title: {   
                    required: true,
                }, 

                group_id:{
                    required: true,
                },
            },       
            messages: {

                group_title: {
                    required: "Please enter group title",
                },

                group_id:{
                    required: "Please choose group",
                },
            },
            errorPlacement: function (error, element) {
                var attr_name = element.attr('name');
                error.insertAfter(element);            
            }
        });

        });
    });

//按原样尝试，但更改按钮类型以提交

表格验证＆amp; Ajax Call on Same Button Click

1 个答案: