首页 > 解决方案 > 联系表格 7 是必需的,即使它不是必填字段

问题描述

有人会向我解释为什么即使我在联系表 7 上输入 required="false" 仍然需要我的字段吗?我的代码如下。尝试解决它几天,但仍然无法正常工作。我希望有人能在这方面帮助我。

对于公司名称和电子邮件,一切都很好,因为它是必需的。但是对于我输入 required="false" 的姓名和号码,它仍然是必需的,我需要填写所有表格,只有我可以按我的提交。

<div class="wpcf7">
    <form id='paymentForm'>
        <p style="font-weight: 500;">
            &nbsp;Your Company<br>
            <span class="wpcf7-form-control-wrap company">
                <input type="text" name="company" value="" size="40" class="wpcf7-form-control wpcf7-text style1" required="true" aria-invalid="false" placeholder="Company Name" style="border-radius: 8px;">
            </span>
        </p>
        <p style="font-weight: 500;">
            &nbsp;Your Email:<br>
            <span class="wpcf7-form-control-wrap email">
                <input type="email" name="email" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-email style1" required="true" aria-invalid="false" placeholder="E-mail" style="border-radius: 8px;">
            </span>
        </p>

        <div class="recurringPlan" style="width: 100%; border-radius: 8px; background-color: #f2f2f2; text-align: left;">
          <p style="padding: 12px; padding-left: 25px;">Why not enroll in our <b>monthly maintenance fee Recurring Plan?</b>
          <i style="font-size: 12px; color: #666666;"><br>You will get to enjoy <b>10% off</b> on your monthly maintenance fee <s style="color: #bb3430;">RM26.50</s> <b>RM23.85</b></i></br>
          <i style="font-size: 12px; color: #666666;">(inclusive of 6% sst) with our monthly maintenance fee recurring plan.</i><br>
        <input type="checkbox" id="recurringTNC" value="recurringTNC">
          <label for="recurringTNC" style="font-size: 13px;"> <b>Yes. I'd like to opt for the monthly maintenance fee recurring plan.</b></label>
        </div>
        
        <div class="enrolment-method" style="display: none;">
            <div class="title" style="font-size: 15px; color: #13133b; margin-bottom: 5px; margin-left: 7px;">Enrolment Payment Method</div>
            <div class="first checkbox" style="border: 1px solid #e6e6e6; border-radius: 8px; margin-bottom: 10px; padding-top: 10px; padding-bottom: 10px; font-size: 13px; padding-left: 15px;">
                <label>
                    <input id="enrolCc" class="inputCheckbox" type="radio" name="EnrolCc">
                    <div for="enrolCc">
                    <div class="enrol-title" style="margin-left: 35px; margin-top: -25px;">Enrol with Credit Card / Debit Card</div>
                    <div class="all-fields" style="display: none;">
                    <div class="field-row field-name">
                        <div class="field-title" style="margin-left: 34px; ">Your Name</div>
                        <input type="name" name="name" required="false" class="wpcf7-form-control wpcf7-text wpcf7-name style1" placeholder="Your Name" style="background: #f2f2f2; margin-left: 33px; border: 1px solid #f2f2f2; border-radius: 4px; width: 64%; padding-top: 7px; padding-bottom: 7px; font-size: 13px; font-style: italic; padding-left: 20px; margin-bottom: 7px;">
                        
                        <div class="field-row field-phone">
                            <div class="field-title" style="margin-left: 34px;">Your Phone Number</div>
                            <input type="phonenum" name="phonenum" required="false" class="wpcf7-form-control wpcf7-text wpcf7-phonenum style1" placeholder="Phone Number" style="background: #f2f2f2; margin-left: 33px; border: 1px solid #f2f2f2; border-radius: 4px; width: 64%; padding-top: 7px; padding-bottom: 7px; font-size: 13px; font-style: italic; padding-left: 20px; margin-bottom: 7px;">
                        </div>
                    </div>
                    </div>
                    </div>
                </label>
            </div>

        <input type="checkbox" id="TNC" value="TermAndCond" checked>
        <label for="TNC" style="font-size: 10px; font-weight: bold;"> I/We have  read, understand & agree to <a href="https://stg.e-ghl.com/TermsOfConditions.htm" onclick="window.open(this.href,'targetWindow','toolbar=no,location=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=520,height=540'); return false;">T&C</a> of the automated Monthly/Yearly fee collection.</label>
        </div>
        <script type="text/javascript">
            jQuery(function($) {
                $(document).ready(function(){
                    $('input#recurringTNC').click(function(){
                        $(this).toggleClass('checked').promise().done(function(){
                            if ($('input#recurringTNC').hasClass('checked')) {
                                $('.enrolment-method').css('display', 'block',).promise().done( function(){
                                    $('.enrolment-method .checkbox').each(function(){
                                        $(this).find('input.inputCheckbox').click(function(){
                                            var group = "input.inputCheckbox";
                                        $(group).prop('checked', false).removeClass('checked').parents('label').find('.all-fields').css('display', 'none');
                                            $(this).toggleClass('checked').prop('checked', true).promise().done(function(){

                                                if ($(this).hasClass('checked')) {
                                                    $(this).parents('label').find('.all-fields').css('display', 'block');
                                                } else {
                                                    $(this).parents('label').find('.all-fields').css('display', 'none');
                                                }

                                            })

                                        })
                                    })
                                });
                            } else {
                                $('.enrolment-method').css('display', 'none');
                            }

                        });
                    })
                });
            })
            
        </script>
        <p>
            <input type="button" id="btn-paymentForm" value="Proceed Payment" class="wpcf7-form-control wpcf7-submit button-style2 full-width-button" style="border-radius: 8px; font-weight: bold;">
            <span class="ajax-loader"></span>
        </p>
    </form>
</div>

标签: phpwordpresscontent-management-systemcontact-form-7

解决方案


推荐阅读