ブートストラップのチェックボックスで必要なプロパティを設定します

ダニー

テキスト入力と2つのチェックボックスがある単純なフォームがあり、チェックボックスでプロパティ「必須」を設定する必要があります(そのチェックボックスの少なくとも1つがチェックされている必要があります)。

<div class="control-group">
    <label class="control-label" for="inputEmail"><?= $this->labelfieldEmail; ?></label>
    <div class="controls">
        <input type="text" name="email" id="emailField"
        placeholder="Email" required>
    </div>
</div>

<div class="control-group">
    <label class="control-label" for="productField"><?= $this->labelfieldProduct; ?></label>
    <div class="controls" >
        <input type="checkbox" id="inlineCheckbox1" value="widget" name="product[]" <?php if ($this->selectedProduct == "widget") { echo "checked"; }?>/> 
        Widget for website
        <br/>
        <input type="checkbox" id="inlineCheckbox2" value="app" name="product[]" <?php if ($this->selectedProduct == "app") { echo "checked"; }?>/> 
        App mobile
    </div>
</div>

お願い、何か提案はありますか?

編集

次の方法でjqBootstrapValidationライブラリを使用しようとしましたが、機能しません。1。ライブラリを追加します。2。これを<head>タグに追加します。

<script>
$(function () { 
    $("input,select,textarea").not("[type=submit]").jqBootstrapValidation(); 
});
</script>

3これは私のフォームコードです:

<form class="form-horizontal" method="POST" action="<?= $this->baseUrl($this->pathBusinessThankyou);?>">
    <div class="row-fluid">

        <div class="row-fluid">
            <br />
            <div class="control-group">
                <label class="control-label" for="inputName"><?= $this->labelfieldName; ?></label>
                <div class="controls">
                    <input type="text" id="fullnameField" name="fullname" required />
                </div>
            </div>
            <div class="control-group">
                <label class="control-label" for="inputEmail"><?= $this->labelfieldEmail; ?></label>
                <div class="controls">
                    <input type="email" id="emailField" name="email" required />
                </div>
            </div>

            <div class="control-group">
                <label class="control-label" for="productField"><?= $this->labelfieldProduct; ?></label>
                <div class="controls" >
                    <label class="checkbox">
                        <input type="checkbox" 
                        data-validation-minchecked-message="<?= $this->validationOneProduct; ?>" 
                        data-validation-minchecked-minchecked="1" value="widget" name="product[]" 
                        <?php if ($this->selectedProduct == "widget") { echo "checked"; }?> />
                        Widget per il tuo sito
                    </label>
                    <label class="checkbox">
                        <input type="checkbox" value="app" name="product[]" aria-invalid="false"
                        <?php if ($this->selectedProduct == "app") { echo "checked"; }?> />
                        App per il tuo hotel
                    </label>
                </div>
            </div>

            <div class="control-group">
                <label class="control-label" for="inputEmail"><?= $this->labelfieldNote; ?></label>
                <div class="controls">
                    <textarea rows="3" name="comment" id="commentField"></textarea>
                </div>
            </div>
            <div class="control-group">
                <div class="controls">
                    <button type="submit" class="btn input-block-level btn-large btn-success">
                        <?= $this->labelSendRequest; ?>
                        <i class="icon-ok icon-white"></i>
                    </button>
                </div>
            </div>  
        </div>
    </div>
</form>
Arbaoui Mehdi

ブートストラップフォーム用のJQuery検証プラグイン:

http://reactiveraven.github.io/jqBootstrapValidation/

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

ブートストラップVueテーブルの最初のフィールドとしてチェックボックスを設定する方法

分類Dev

ゲッターしかない[オブジェクトオブジェクト]のプロパティスタックを設定できません

分類Dev

Reactでチェックボックスの「チェック」プロパティを設定する

分類Dev

Reactでチェックボックスの「チェック」プロパティを設定する

分類Dev

Reactでチェックボックスの「チェック」プロパティを設定する

分類Dev

Android:プログラムでチェックボックスを設定し、右側にテキストの位置を設定します

分類Dev

mongoose.find()メソッドを使用してコンストラクターでjavascriptオブジェクトプロパティを設定します

分類Dev

[チェックボックス] DOMプロパティにfalseを設定しても、Angularのチェックボックスがオフにならない

分類Dev

[すべてチェック]チェックボックスは、オブジェクトのプロパティを選択から変更しません

分類Dev

LISP-リストのプロパティをリストのオブジェクトに設定します(同じインデックスで購入)

分類Dev

typescript でチェックボックスのプロパティを設定する方法

分類Dev

チェックボックスの[checked]プロパティのメソッドを使用してtrue / falseに設定できますか?

分類Dev

チェックボックスReactでオブジェクトプロパティの値を変更します

分類Dev

スイートアラート内でチェックボックスのプロパティをtrueまたはfalseに変更する方法

分類Dev

インストーラーはプロパティをバックオーダーで設定します

分類Dev

ネストされたオブジェクトの各オブジェクトのインデックスをプロパティに設定します

分類Dev

特定のクラスのセットのブールプロパティをチェックボックスにバインドする

分類Dev

asp.netチェックボックスコンポーネントでブートストラップ3チェックボックスプロパティを適切に使用するにはどうすればよいですか?

分類Dev

チェックボックスの計算プロパティをv-modelでどのように設定しますか?

分類Dev

ブートストラップカスタムチェックボックスでチェックボックスラベルを左に移動します

分類Dev

Androidチェックボックスボックスの色をプログラムで変更しますか(サポートライブラリ)?

分類Dev

プログラムでテキストボックスの完全性をチェックします

分類Dev

AngularJSコントローラーでチェックボックスの値を取得する必要がありますが、最初は[チェック済み]に設定するチェックボックスが必要です

分類Dev

ブートストラップとブートボックス:ダイアログボックスを画面の中央に設定します

分類Dev

InnoSetupの「終了」ページでチェックボックスコントロールのプロパティにアクセスします

分類Dev

テキストプロパティを大きな文字列に設定すると、WPFテキストボックス要素がフリーズします

分類Dev

チェックボックスプロパティをコントローラーに取得する方法

分類Dev

チェックボックスを介してブートストラップ-vueテーブルの行選択を選択できますか

分類Dev

ブートストラップアラートボックスの幅を設定します

Related 関連記事

  1. 1

    ブートストラップVueテーブルの最初のフィールドとしてチェックボックスを設定する方法

  2. 2

    ゲッターしかない[オブジェクトオブジェクト]のプロパティスタックを設定できません

  3. 3

    Reactでチェックボックスの「チェック」プロパティを設定する

  4. 4

    Reactでチェックボックスの「チェック」プロパティを設定する

  5. 5

    Reactでチェックボックスの「チェック」プロパティを設定する

  6. 6

    Android:プログラムでチェックボックスを設定し、右側にテキストの位置を設定します

  7. 7

    mongoose.find()メソッドを使用してコンストラクターでjavascriptオブジェクトプロパティを設定します

  8. 8

    [チェックボックス] DOMプロパティにfalseを設定しても、Angularのチェックボックスがオフにならない

  9. 9

    [すべてチェック]チェックボックスは、オブジェクトのプロパティを選択から変更しません

  10. 10

    LISP-リストのプロパティをリストのオブジェクトに設定します(同じインデックスで購入)

  11. 11

    typescript でチェックボックスのプロパティを設定する方法

  12. 12

    チェックボックスの[checked]プロパティのメソッドを使用してtrue / falseに設定できますか?

  13. 13

    チェックボックスReactでオブジェクトプロパティの値を変更します

  14. 14

    スイートアラート内でチェックボックスのプロパティをtrueまたはfalseに変更する方法

  15. 15

    インストーラーはプロパティをバックオーダーで設定します

  16. 16

    ネストされたオブジェクトの各オブジェクトのインデックスをプロパティに設定します

  17. 17

    特定のクラスのセットのブールプロパティをチェックボックスにバインドする

  18. 18

    asp.netチェックボックスコンポーネントでブートストラップ3チェックボックスプロパティを適切に使用するにはどうすればよいですか?

  19. 19

    チェックボックスの計算プロパティをv-modelでどのように設定しますか?

  20. 20

    ブートストラップカスタムチェックボックスでチェックボックスラベルを左に移動します

  21. 21

    Androidチェックボックスボックスの色をプログラムで変更しますか(サポートライブラリ)?

  22. 22

    プログラムでテキストボックスの完全性をチェックします

  23. 23

    AngularJSコントローラーでチェックボックスの値を取得する必要がありますが、最初は[チェック済み]に設定するチェックボックスが必要です

  24. 24

    ブートストラップとブートボックス:ダイアログボックスを画面の中央に設定します

  25. 25

    InnoSetupの「終了」ページでチェックボックスコントロールのプロパティにアクセスします

  26. 26

    テキストプロパティを大きな文字列に設定すると、WPFテキストボックス要素がフリーズします

  27. 27

    チェックボックスプロパティをコントローラーに取得する方法

  28. 28

    チェックボックスを介してブートストラップ-vueテーブルの行選択を選択できますか

  29. 29

    ブートストラップアラートボックスの幅を設定します

ホットタグ

アーカイブ