php jquery-在页面加载时禁用复选框组的必需属性

时间:2018-11-27 13:00:33

标签: javascript jquery html

我有一个复选框组,需要在其中禁用页面加载时所需的验证检查。

我尝试过如下操作,但是仍然出现“必需”检查。

下面是在{strong>浏览器控制台中显示的div,如下所示:

<div class="key-class-div">Key :
<select class="targetSelect" name="Keys[]" id="key_H3UKE01hlI" rel="H3UKE01hlI" onchange="return getPreferenceValues(this, 'H3UKE01hlI');">
    <option value="">Choose one</option>
    <option value="25/checkbox//" alt="25">Gender</option>
    <option value="26/checkbox//" alt="26" selected="">Marital Status</option>
    <option value="27/radio//" alt="27">Education Status</option>
    <option value="28/checkbox//" alt="28">Employment Status</option>
    <option value="29/checkbox//" alt="29">Professional Status</option>
    <option value="30/checkbox//" alt="30">Interests</option>
    <option value="31/checkbox//" alt="31">Age</option>
    <option value="40/date/range/" alt="40">DOB</option>
    <option value="52/text//" alt="52">Home City/Town</option>
    <option value="53/text//" alt="53">Year of Birth</option>
</select>
<span style="color:red;" class="key-error-class" id="key_error_H3UKE01hlI"></span>

<span id="valueResponse_H3UKE01hlI" class="valueResponse-class">
     Value :
    <label id=""><input class="targetSetting" type="checkbox" name="Values[26][]" checked="" id="value_H3UKE01hlI" value="211">Single</label>
    <label id=""><input class="targetSetting" type="checkbox" name="Values[26][]" id="value_H3UKE01hlI" value="212">Married</label>
    <label id=""><input class="targetSetting" type="checkbox" name="Values[26][]" id="value_H3UKE01hlI" value="0">Any</label>
    <span style="color:red;" class="value-error-class" id="value_error_H3UKE01hlI">Required</span>
</span>

HTML :(已经提到“下面的问题”)

<input type="submit" name="submit" id="SaveSettings" value="<?php echo $this->translate('Update'); ?>" class="update bdr_rds2" onclick="if($('input[name=target_criteria]:checked').val() == 'optedin_users')
                                                                                                                                                {
                                                                                                                                                    return optinUpdateUsersFun()
                                                                                                                                                } 
                                                                                                                                                else if($('input[name=target_criteria]:checked').val() == 'registered_users')
                                                                                                                                                {
                                                                                                                                                    return registeredUsersUpdateFun()
                                                                                                                                                }
                                                                                                                                                else if($('input[name=target_criteria]:checked').val() == 'preference_based_users')
                                                                                                                                                {
                                                                                                                                                    return validateForm()   //Problem here
                                                                                                                                                }
                                                                                                                                                else{
                                                                                                                                                    return false;
                                                                                                                                                }
    ">

单击按钮将调用JS函数。 在此将验证检查为“ 必需” (已经粘贴了整个功能-很大)

validateForm = function()
{
    console.log('not---');

        var validation = true;
        var Keys = $('select[name="Keys[]"]');

        jQuery.each(Keys,function( key, object )
        {
            var preferenceData = $("#"+object.id).find('option:selected').attr("value");
            var keyId = $("#"+object.id).attr("rel");

            $("#key_error_"+keyId).html("");
            $("#value_error_"+keyId).html("");
            $("#startValue_error_"+keyId).html("");
            $("#endValue_error_"+keyId).html("");

            var res = preferenceData.split("/");
            var preferenceId = res[0];
            var dataType = res[1];
            var EqualRange = res[2];
            var SingleMultiple = res[3];

            var value = $(this).val();
            if (value.length ==0)
            {                            
                $("#key_error_"+keyId).html("Required");
                validation = false;
            }

            var arrayDataTypesOne = [ "number", "date", "time", "text", "dropdown" ];
            var arrayDataTypestwo = [ "checkbox", "radio" ];

            if (jQuery.inArray(dataType, arrayDataTypesOne) > -1)
            {     
                if (EqualRange == 'equal' || EqualRange == '')
                {
                    if (SingleMultiple == "single")
                    {
                        preferenceValue = jQuery("#value_"+keyId).val();
                        if (preferenceValue.length == 0)
                        {
                            $("#value_error_"+keyId).html("Required");
                            validation = false;
                        }
                    }else if (SingleMultiple == "multiple")
                    {
                        preferenceValue = jQuery("#value_"+keyId).val();
                        if (preferenceValue.length == 0)
                        {
                            $("#value_error_"+keyId).html("Required");
                            validation = false;
                        }
                    }
                }else if (EqualRange == 'range')
                {
                    StartValue = jQuery("#startValue_"+keyId).val();
                    EndValue = jQuery("#endValue_"+keyId).val();
                    if (StartValue.length == 0)
                    {
                        $("#startValue_error_"+keyId).html("Required");
                        validation = false;
                    }
                    if (EndValue.length == 0)
                    {
                        $("#endValue_error_"+keyId).html("Required");
                        validation = false;
                    }
                }

            }else if (jQuery.inArray(dataType, arrayDataTypestwo) > -1)
            {           
                Values = $('input[name="Values['+preferenceId+'][]"]');
                if(!Values.is(':checked'))
                {
                    $("#value_error_"+keyId).html("Required");
                    validation = false;
                }
            }

            //alert(dataType+'/'+SingleMultiple);

        });

       // alert(validation);return false;
        if (validation == false )
        {
            return false;
        }else{
            return true;
        }
}

PHP phtml相同的代码(部分代码-与浏览器控制台进行比较)

<div class="key-class-div">Key :

<select class="targetSelect" name="Keys[]" id="key_<?php echo $randomString; ?>" class="key-class" rel="<?php echo $randomString; ?>" onchange="return getPreferenceValues(this, '<?php echo $randomString; ?>');">
    <option value="">Choose one</option>
    <?php foreach ($AdminpreferncesData as $value) { ?>
        <option value="<?php echo $value['id'] . '/' . $value['FieldType'] . '/' . $value['EqualRange'] . '/' . $value['SingleMultiple']; ?>" alt="<?php echo $value['id']; ?>" <?php if ($value['id'] == $Fields['PreferenceFieldID']) { ?> selected <?php } ?> ><?php echo $value['FieldName']; ?></option>
    <?php } ?>
</select>
<span style="color:red;" class="key-error-class"  id="key_error_<?php echo $randomString; ?>" ></span>

<span id="valueResponse_<?php echo $randomString; ?>" class="valueResponse-class">

    <?php
    $Options = explode(',', $Fields['options']);
    $OptionIds = explode(',', $Fields['optionIds']);
    $expOptions = array_combine($OptionIds, $Options);
    $divid = $randomString;
    ?>


    <?php if ($Fields['FieldType'] == "text") { ?> 
        Value :<label id="">
            <input  class="targetSetting"  type="text" name="Values[<?php echo $Fields['PreferenceFieldID']; ?>][]" id="value_<?php echo $divid; ?>" value="<?php echo $Fields['KeyValue']; ?>">
            <span style="color:red;" class="value-error-class"  id="value_error_<?php echo $divid; ?>" ></span>
        </label>

        ...

这是我尝试使用jQuery禁用页面加载时的'required'属性的方法。

$(document).ready(function() {
    //Tried using this
    $('.targetSetting').removeAttr('required');​​​​​  //not working

    $('.valueResponse-class').prop('disabled',true);   //not working
});

我想在单击“更新”按钮时禁用所有复选框/单选按钮的必填属性(上面已发布了更新按钮代码的HTML)

enter image description here

0 个答案:

没有答案