Search code examples
jqueryasp.nettwitter-bootstrapjquery-ajaxq

How to NOT show glyphicon-ok if field is left empty?


enter image description hereI have a "txtPhone" input filter that is NOT mandatory, but can accept only Phone Numbers, so:

 <label class="control-label">Phone</label>
<input type="text" id="txtPhone" class="form-control intonly" maxlength="12" placeholder="Phone" name="Phone">

Bootstrap Validation

Phone: {
                        validators: {
                            regexp: {
                                regexp: /^((091|\+91)?|\((091|\+91)?\)|(91)?|\(91\)|0)? ?[7-9][0-9]{9}$/,
                                message: 'The Indian Phone No must contain 10 digits'
                            },

                        }
                    },

But when i clicking submit button tick shown in textbox.


Solution

  • After Long struggling JesusGrace i find the answer

      Bootstrap Validation
    
         Phone: {
                         enabled: false,
                        validators: {
                            regexp: {
                                regexp: /^((091|\+91)?|\((091|\+91)?\)|(91)?|\(91\)|0)? ?[7-9][0-9]{9}$/,
                                message: 'The Indian Phone No must contain 10 digits'
                            },
    
                        }
                    },
    
    
            .on('keyup', '[name="Phone"]', function () {
                    var isEmpty = $(this).val() == '';
                    $('#form1')
                           .formValidation('enableFieldValidators', 'Phone', !isEmpty);
                    // Revalidate the field when user start typing in the Phone field
                    if ($(this).val().length == 1) {
                        $('#form1').formValidation('validateField', 'Phone')
                    }
                })