首页 > 解决方案 > Jquery - 检查不同父母的必填字段

问题描述

我有多个部分的表格。

在每个部分的末尾,我都有下一部分的 NEXT 按钮

我也有用于字段验证的 jquery 脚本。

我想“告诉”脚本是否应该检查所有表单或仅检查特定部分。为此,我需要使用一些获取父名称的函数。

我怎样才能“告诉”某个函数谁是包含这些字段的父级?

查询:

$( '#regForm' ).submit( function( event ) {

    $( '#regForm' ).find( 'select, textarea, input' ).each(function(){


        if ( $(this).parents(".form-group").attr("data-required") == "required")
        {

            if ( ! $( this ).val() )
            {

                $( this ).parents(".form-group").find('.field-msg').html('required field');

                flag = false;

            }   

        }

    });

}); 

HTML

<form method="post" action="index.php" id="regForm">

        <div class="row form_section form_section_block">

            <div class="form-group" data-required="required">
                INPUT FIELD HERE
            </div>

            <div class="form-group" data-required="required">
                FIELD HERE
            </div>          

            <button class="btn btn-primary btn_next">CHECK SECTION VALIDETION AND GO NEXT SECTION</button>

        </div>

        <div class="row form_section form_section_block"  data-secID="10">

            <div class="form-group" data-required="required">
                INPUT FIELD HERE
            </div>

            <button class="btn btn-primary btn_next">CHECK SECTION VALIDETION AND GO NEXT SECTION</button>

        </div>


        <button class="btn btn-danger" id="btn_submit">CHECK ALL SECTION AND SUBMIT</button>    

</form>

标签: jqueryhtml

解决方案


您需要在上面的代码中防止表单的默认行为:

event.preventDefault()

要获取父部分,您可以使用:

$parent = $(this).parents(".form_section");

推荐阅读