ホーム エクスプローラ ヘルプ
サインイン
githab
/
bootstrapvalidator
2
0
Fork 0
ファイル 課題 0 プルリクエスト 0 Wiki
ソースを参照

#201: choice validator now supports select element

nghuuphuoc 11 年 前
親
395ffae0a4
コミット
56f3b93ae8
5 ファイル変更、136 行追加、9 行削除
一括表示 差分情報を表示
  1. 1 0
      CHANGELOG.md
  2. 128 0
      demo/choice.html
  3. 3 4
      dist/js/bootstrapValidator.js
  4. 1 1
      dist/js/bootstrapValidator.min.js
  5. 3 4
      src/js/validator/choice.js

+ 1 - 0
CHANGELOG.md
ファイルの表示 

@@ -5,6 +5,7 @@
 
 * [#77](https://github.com/nghuuphuoc/bootstrapvalidator/issues/77): Add ```file``` validator
 
 * [#77](https://github.com/nghuuphuoc/bootstrapvalidator/issues/77): Add ```file``` validator
 
 * [#179](https://github.com/nghuuphuoc/bootstrapvalidator/issues/179): Add ```vat``` validator, support 32 countries
 
 * [#179](https://github.com/nghuuphuoc/bootstrapvalidator/issues/179): Add ```vat``` validator, support 32 countries
 
 * [#198](https://github.com/nghuuphuoc/bootstrapvalidator/pull/198): Add Canadian Postal Code support for the [```zipCode``` validator](http://bootstrapvalidator.com/validators/zip-code/), thanks to [@Francismori7](https://github.com/Francismori7)
 
 * [#198](https://github.com/nghuuphuoc/bootstrapvalidator/pull/198): Add Canadian Postal Code support for the [```zipCode``` validator](http://bootstrapvalidator.com/validators/zip-code/), thanks to [@Francismori7](https://github.com/Francismori7)
 
+* [#201](https://github.com/nghuuphuoc/bootstrapvalidator/issues/201): ```choice``` validator supports select element
 
 * [#202](https://github.com/nghuuphuoc/bootstrapvalidator/issues/202): Activate tab containing the first invalid field
 
 * [#202](https://github.com/nghuuphuoc/bootstrapvalidator/issues/202): Activate tab containing the first invalid field
 
 * [#205](https://github.com/nghuuphuoc/bootstrapvalidator/issues/205): Plugin method invocation
 
 * [#205](https://github.com/nghuuphuoc/bootstrapvalidator/issues/205): Plugin method invocation
 
 * [#210](https://github.com/nghuuphuoc/bootstrapvalidator/issues/210): ```isbn``` validator accepts letters and special characters
 
 * [#210](https://github.com/nghuuphuoc/bootstrapvalidator/issues/210): ```isbn``` validator accepts letters and special characters

+ 128 - 0
demo/choice.html
ファイルの表示 

@@ -0,0 +1,128 @@
 
+<!DOCTYPE html>
 
+<html>
 
+<head>
 
+    <title>BootstrapValidator demo</title>
 
+
 
+    <link rel="stylesheet" href="../vendor/bootstrap/css/bootstrap.css"/>
 
+    <link rel="stylesheet" href="../dist/css/bootstrapValidator.css"/>
 
+
 
+    <script type="text/javascript" src="../vendor/jquery/jquery-1.10.2.min.js"></script>
 
+    <script type="text/javascript" src="../vendor/bootstrap/js/bootstrap.min.js"></script>
 
+    <script type="text/javascript" src="../dist/js/bootstrapValidator.js"></script>
 
+</head>
 
+<body>
 
+    <div class="container">
 
+        <div class="row">
 
+            <section>
 
+                <div class="col-lg-8 col-lg-offset-2">
 
+                    <div class="page-header">
 
+                        <h2>choice validator</h2>
 
+                    </div>
 
+
 
+                    <form id="interviewForm" method="post" class="form-horizontal" action="target.php">
 
+                        <div class="form-group">
 
+                            <label class="col-lg-3 control-label">Programming Languages</label>
 
+                            <div class="col-lg-4">
 
+                                <div class="checkbox">
 
+                                    <label>
 
+                                        <input type="checkbox" name="languages[]" value="net" /> .Net
 
+                                    </label>
 
+                                </div>
 
+                                <div class="checkbox">
 
+                                    <label>
 
+                                        <input type="checkbox" name="languages[]" value="java" /> Java
 
+                                    </label>
 
+                                </div>
 
+                                <div class="checkbox">
 
+                                    <label>
 
+                                        <input type="checkbox" name="languages[]" value="c" /> C/C++
 
+                                    </label>
 
+                                </div>
 
+                                <div class="checkbox">
 
+                                    <label>
 
+                                        <input type="checkbox" name="languages[]" value="php" /> PHP
 
+                                    </label>
 
+                                </div>
 
+                                <div class="checkbox">
 
+                                    <label>
 
+                                        <input type="checkbox" name="languages[]" value="perl" /> Perl
 
+                                    </label>
 
+                                </div>
 
+                                <div class="checkbox">
 
+                                    <label>
 
+                                        <input type="checkbox" name="languages[]" value="ruby" /> Ruby
 
+                                    </label>
 
+                                </div>
 
+                                <div class="checkbox">
 
+                                    <label>
 
+                                        <input type="checkbox" name="languages[]" value="python" /> Python
 
+                                    </label>
 
+                                </div>
 
+                                <div class="checkbox">
 
+                                    <label>
 
+                                        <input type="checkbox" name="languages[]" value="javascript" /> Javascript
 
+                                    </label>
 
+                                </div>
 
+                            </div>
 
+                        </div>
 
+
 
+                        <div class="form-group">
 
+                            <label class="col-lg-3 control-label">Editors</label>
 
+                            <div class="col-lg-4">
 
+                                <select class="form-control" name="editors[]" multiple="multiple" style="height: 200px;">
 
+                                    <option value="" disabled>Choose 2 - 3 editors</option>
 
+                                    <option value="atom">Atom</option>
 
+                                    <option value="eclipse">Eclipse</option>
 
+                                    <option value="netbeen">NetBean</option>
 
+                                    <option value="nodepadplusplus">Nodepad++</option>
 
+                                    <option value="phpstorm">PHP Storm</option>
 
+                                    <option value="sublime">Sublime</option>
 
+                                    <option value="webstorm">Web Storm</option>
 
+                                </select>
 
+                            </div>
 
+                        </div>
 
+
 
+                        <div class="form-group">
 
+                            <div class="col-lg-9 col-lg-offset-3">
 
+                                <button type="submit" class="btn btn-primary">Submit</button>
 
+                            </div>
 
+                        </div>
 
+                    </form>
 
+                </div>
 
+            </section>
 
+        </div>
 
+    </div>
 
+
 
+<script type="text/javascript">
 
+$(document).ready(function() {
 
+    $('#interviewForm').bootstrapValidator({
 
+        feedbackIcons: {
 
+            valid: 'glyphicon glyphicon-ok',
 
+            invalid: 'glyphicon glyphicon-remove',
 
+            validating: 'glyphicon glyphicon-refresh'
 
+        },
 
+        fields: {
 
+            'languages[]': {
 
+                validators: {
 
+                    choice: {
 
+                        min: 2,
 
+                        max: 4,
 
+                        message: 'Please choose 2 - 4 programming languages you are good at'
 
+                    }
 
+                }
 
+            },
 
+            'editors[]': {
 
+                validators: {
 
+                    choice: {
 
+                        min: 2,
 
+                        max: 3,
 
+                        message: 'Please choose 2 - 3 editors you know'
 
+                    }
 
+                }
 
+            }
 
+        }
 
+    });
 
+});
 
+</script>
 
+</body>
 
+</html>

+ 3 - 4
dist/js/bootstrapValidator.js
ファイルの表示 

@@ -927,10 +927,9 @@
 
          * @returns {Boolean}
 
          * @returns {Boolean}
 
          */
 
          */
 
         validate: function(validator, $field, options) {
 
         validate: function(validator, $field, options) {
 
-            var numChoices = validator
 
-                                    .getFieldElements($field.attr('data-bv-field'))
 
-                                    .filter(':checked')
 
-                                    .length;
 
+            var numChoices = $field.is('select')
 
+                            ? validator.getFieldElements($field.attr('data-bv-field')).find('option').filter(':selected').length
 
+                            : validator.getFieldElements($field.attr('data-bv-field')).filter(':checked').length;
 
             if ((options.min && numChoices < options.min) || (options.max && numChoices > options.max)) {
 
             if ((options.min && numChoices < options.min) || (options.max && numChoices > options.max)) {
 
                 return false;
 
                 return false;
 
             }
 
             }

ファイルの差分が大きいため隠しています
+ 1 - 1
dist/js/bootstrapValidator.min.js


+ 3 - 4
src/js/validator/choice.js
ファイルの表示 

@@ -19,10 +19,9 @@
 
          * @returns {Boolean}
 
          * @returns {Boolean}
 
          */
 
          */
 
         validate: function(validator, $field, options) {
 
         validate: function(validator, $field, options) {
 
-            var numChoices = validator
 
-                                    .getFieldElements($field.attr('data-bv-field'))
 
-                                    .filter(':checked')
 
-                                    .length;
 
+            var numChoices = $field.is('select')
 
+                            ? validator.getFieldElements($field.attr('data-bv-field')).find('option').filter(':selected').length
 
+                            : validator.getFieldElements($field.attr('data-bv-field')).filter(':checked').length;
 
             if ((options.min && numChoices < options.min) || (options.max && numChoices > options.max)) {
 
             if ((options.min && numChoices < options.min) || (options.max && numChoices > options.max)) {
 
                 return false;
 
                 return false;
 
             }
 
             }