0

formValidation プラグインを使用して、動的フィールドを追加しています。

現在、[追加] をクリックすると、ブートストラップ選択が更新されますが、2 つの選択ドロップダウンが追加され続けます。

ここに画像の説明を入力

誰かが私を正しい方向に向けることができれば、役に立ちます!

JS

// Add work experience handler
            .on('click', '.addWork', function() {
            workindex++;
            var $template = $('#userWork'),
                $clone    = $template
            .clone()
            .removeClass('hide')
            .removeAttr('id')
            .appendTo($("#workAppendContainer"));

            // Update the name attributes
            $clone
                .find('[name="year"]').attr('name', 'userWorkDuration[]').end()
                .find('[name="worklocation"]').attr('name', 'userWorkLocation[]').end()
                .find('[name="workdescription"]').attr('name', 'userWorkDescription[]').end()
                .find('[name="workpositionname"]').attr('name', 'userWorkName[]').end();

            // Add new fields
            // Note that we also pass the validator rules for new field as the third parameter
            $('#rootwizard')
                .formValidation('addField', 'userWorkDuration[]')
                .formValidation('addField', 'userWorkLocation[]')
                .formValidation('addField', 'userWorkDescription[]')
                .formValidation('addField', 'userWorkName[]');

            $('.durationSelect').selectpicker('refresh');

        })

これがクローンに使用しているテンプレートとコンテナです

<div class="form-group hide" id="userWork">
        <div class="row" style="margin-top:15px;">
            <div class="col-md-4">
                <div class="col-md-6" style="padding-left: 0px;">
                      <label>Algus</label>
                        <div class="form-group form-group-custom">
                        <select class="durationSelect selectpicker" data-live-search="true"  name="year">
                          <optgroup class="userWorkYear">
                            <option disabled selected value="">
                                Vali kestvus
                            </option> 
                            <option value="-3">Vähem kui kolm kuud</option>  
                            <option value="3 kuud">3 kuud</option>
                            <option value="6 kuud">6 kuud</option>
                            <option value="9 kuud">9 kuud</option>
                            <option value="1 aasta">1 aasta</option>
                            <option value="2 aastat">2 aastat</option>
                            <option value="3 aastat">3 aastat</option>
                            <option value="3+">Rohkem kui 3 aastat</option>
                          </optgroup>
                        </select>
                        </div>
                </div>
            </div>
   <div id="workAppendContainer">
    </div>
4

0 に答える 0