如果使用jquery验证,如何提交表单?

时间:2016-05-23 13:12:19

标签: javascript php jquery forms validation

我正在用jquery验证表单。因此,当表单提交我在验证表单后使用event.preventDefault();时,表单将提交到相应的操作页面。但在我的情况下它不起作用。

编码我做了什么 -

$('form[name=contact_form]').submit(function(event) {
        event.preventDefault();
        var formData = $('form[name=contact_form]').serialize();
        var phone = $.trim($('form[name=contact_form]').find('input[name=PHONE]').val()).length;
        var intRegex = /[0-9 -()+]+$/;
        var alert = $('#contact_alert');
        var success = $('#contact_success');
        if(phone==0){
            phone.focus();
            alert.html("<p class='alert alert-danger' style='text-align:left;'>Phone number is required</p>");
        }
        else if((phone < 10)){
            phone.focus();
             alert.html("<p class='alert alert-danger' style='text-align:left;'>Please enter a valid phone number</p>");
             return false;
        }else{
            return true;
        }
    });

Html页面:

<?php
echo form_open_multipart('home/inquiry', array('name' => 'contact_form'));
?>
                <div class="row">
                    <div class="col-md-6">
                        <div class="form-group">
                            <input type="hidden" name="form_type" value="C">
                            <input type="text" name="NAME" id="user-name" class="form-control" placeholder="Full Name"/>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="form-group">
                            <input type="text" name="PHONE" id="user-phone" class="form-control" placeholder="Phone"/>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="form-group">
                            <input type="text" name="EMAIL" id="user-email" class="form-control" placeholder="Email"/>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="form-group">
                            <input type="text" name="SUBJECT" id="user-subject" class="form-control" placeholder="Reason for inquiry"/>
                        </div>
                    </div>
                    <div class="col-md-12">
                        <textarea class="form-control" name="MESSAGE" id="user-message"  placeholder="Message"></textarea>
                    </div>
                    <div class="col-md-12 text-left">
                        <div class="form-group">
                            <input type="submit" name="submit"  class="btn btn-warning">
                        </div>
                    </div>
                </div>
                <?php echo form_close(); ?>

4 个答案:

答案 0 :(得分:3)

如果您希望在验证确认后提交表单,请不要致电event.preventDefault();

验证失败后返回false就足够了。

答案 1 :(得分:0)

$(this).submit();

什么时候有效。

答案 2 :(得分:0)

尝试替换return true;

$(this).submit();

答案 3 :(得分:0)

我经常做类似

的事情
$("#submit").submit(function(e){
    if(validateFields() == true){ //If all fields are valid
        $("#submit").submit();
    }
    else{
        e.preventDefault(e);
    }    
});