1

プラスボタンをクリックしたときに Jquery select 2 を生成したい。以下のスクリーンショットを参照してください

ここに画像の説明を入力

追加機能と行の削除は、側面から完全に機能しています。

HTML を追加するために、display none で div を初期化しています。

以下のように、、、

<div class="newbrndsrs" style="display:none">
    <div class="row">
        <div class="col-md-5" style="margin-bottom: 15px;">
            <div class="form-group">
                <label for="" class="col-lg-4 col-sm-4" style="text-align: right;">Trade/Brand Name</label>
                <div class="col-lg-8 col-sm-8 prepend-icon">
                    <select name="brandfk[]" class="form-control form-white modlfetch" data-placeholder="Trade/Brand Name">
                        <option value=""></option>
                            <?php
                            while($row9=mysql_fetch_assoc($brandfetchAjax)){ ?>
                                <option value="<?php echo $row9['ID'];?>"><?php echo $row9['BrandName'];?></option>
                            <?php } ?>
                    </select>
                </div>
            </div>
        </div>
        <div class="col-md-5" style="margin-bottom: 15px;">
            <div class="form-group">
                <label for="" class="col-lg-4 col-sm-4" style="text-align: right;">Series Name</label>
                <div class="col-lg-8 col-sm-8">
                    <select name="brand[]" class="form-control form-white slctjpmodelname">
                    </select>
                </div>
            </div>
        </div>
        <span class="btn btn-primary addline"><i class="glyphicon glyphicon-minus"></i></span>
    </div>
</div>

ボタンプラスをクリックすると、上記の HTML を取得してプラスボタンの下部にバインドします。

  <div class="row apndarea">
                                <div class="col-md-5" style="margin-bottom: 15px;">
                                    <div class="form-group">
                                        <label for="" class="col-lg-4 col-sm-4" style="text-align: right;">Trade/Brand Name</label>
                                        <div class="col-lg-8 col-sm-8 prepend-icon">
                                            <select name="brandfk[]" class="form-control form-white modlfetch" data-placeholder="Trade/Brand Name">
                                                <option value=""></option>
                                                <?php
                                                while($row2=mysql_fetch_assoc($brandfetch)){ ?>
                                                <option value="<?php echo $row2['ID'];?>"><?php echo $row2['BrandName'];?></option>
                                                <?php } ?>
                                            </select>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-5" style="margin-bottom: 15px;">
                                    <div class="form-group">
                                        <label for="" class="col-lg-4 col-sm-4" style="text-align: right;">Series Name</label>
                                        <div class="col-lg-8 col-sm-8">
                                            <select name="brand[]" class="form-control form-white slctjpmodelname">
                                                <option value="">Series </option>
                                                <option value="">Series </option>
                                                <option value="">Series </option>
                                            </select>
                                        </div>
                                    </div>
                                </div>
                                <span class="btn btn-primary addline"><i class="glyphicon glyphicon-plus"></i></span>
                            </div>

Jクエリ....

  $(".addline").click(function(){
                var eqtype      = $("select[name=EquipmentTypeID]").val();
                if(eqtype == ""){
                    $("select[name=EquipmentTypeID]").next().show();
                    return false;
                }else{
                    $(".form-error").hide();
                    $(".apndarea").after($(".newbrndsrs").html());
                }

            });

しかし、新しいダイナミック Select2 が機能しない....

なかなかクリックできない…

どうした ？

4

2 に答える 2

2 
$(document).on('click',".addline", function(){
                var eqtype      = $("select[name=EquipmentTypeID]").val();
                if(eqtype == ""){
                    $("select[name=EquipmentTypeID]").next().show();
                    return false;
                }else{
                    $(".form-error").hide();
                    $(".apndarea").after($(".newbrndsrs").html());
                }

            });

クリックは動的に作成されたオブジェクトにバインドされていません。使用してくださいon

于 2016-01-25T07:41:48.727 に答える
0

Use Event deligation

 $(document).on('click', ".addline", function () {
            var eqtype = $("select[name=EquipmentTypeID]").val();
            if (eqtype == "") {
                $("select[name=EquipmentTypeID]").next().show();
                return false;
            } else {
                $(".form-error").hide();
                $(".apndarea").after($(".newbrndsrs").html());
            }

        });
于 2016-01-25T08:06:25.917 に答える