Bootstrap单选按钮&复选框未显示

时间:2016-08-02 11:59:10

标签: twitter-bootstrap-3

    <div class="form-group" id="q-row5">
    <div class="row">
      <div class="col-sm-5 has-feedback">
        <label for="preferContact" class="control-label">Preferred Contact Method *:</label>    
                                                    <div>
                        <input class="control-label" id="Phone call" name="preferedContact[]" type="checkbox" value="1">
                        <label for="Phone call">Phone call</label>
                    </div>
                                                    <div>
                        <input class="control-label" id="Text" name="preferedContact[]" type="checkbox" value="2">
                        <label for="Text">Text</label>
                    </div>
                                                    <div>
                        <input class="control-label" id="Email" name="preferedContact[]" type="checkbox" value="3">
                        <label for="Email">Email</label>
                    </div>
                                                    <div>
                        <input class="control-label" id="Any" name="preferedContact[]" type="checkbox" value="4">
                        <label for="Any">Any</label>
                    </div>
      </div>
       <div class="col-sm-7 has-feedback">
        <label for="messageType" class="control-label">What type of message may we leave when we contact you? *:</label>       

                    <div style="">
                        <input class="control-label" id="messageTypeValDiscreet" name="messageTypeVal" type="radio" value="1">
                        <label for="messageTypeValDiscreet">Discreet</label>
                    </div>

                    <div style="">
                        <input class="control-label" id="messageTypeValAny" name="messageTypeVal" type="radio" value="2">
                        <label for="messageTypeValAny">Any</label>
                    </div>
      </div>
 </div>
</div>


<script type="text/javascript">
    $(document).ready(function() {
    $('#enrollForm')
        .formValidation({
            framework: 'bootstrap',
            icon: {
                valid: 'glyphicon glyphicon-ok icon-success',
                invalid: 'glyphicon glyphicon-remove icon-fail',
                validating: 'glyphicon glyphicon-refresh'
            },
            fields: {
                  messageTypeVal: {
                    row: '.col-sm-7',
                    validators: {
                        notEmpty: {
                            message: 'Message type is required'
                        }
                    }
                },
        'preferedContact[]': {
            row: '.col-sm-5',
            validators: {
                choice: {
                    min: 1,
                    message: 'Please choose prefered contact atleast 1'
                }
            }
        }
            }
        });
    });
</script>

attached image

我的问题是复选框中的最后一个选项&amp;单选按钮标签仅显示,单选按钮和复选框不显示在两者中。我附上了图片。请告诉我代码中的问题。如果我删除验证它可以工作,否则它无法正常工作。

0 个答案:

没有答案