2016-09-21 8 views
0

Ich verwende select2 in einem bootstrap form-group, der eine datepicker und eine select2 enthält. Wenn ich die Formulargruppe geklont habe, kann nur die datepicker funktionieren, die select2 kann überhaupt nicht arbeiten.Clonted Select2 reagiert nicht

ich fast alle versuchen, die Antwort auf Stackoverflow, jedes Mal wenn ich versuche, es wird verschiedene Fehlermeldung angezeigt, wie „style Fehler“, „Ereignis kann nicht funktionieren“, „klicken Sie auf die geklonten select2 aber responsed zum Ursprung select2 ".

Mein Code ist wie folgt:

HTML-Code:

<div class="form-group drive-item"> 
     <label class="col-md-2 col-sm-3 col-xs-12 control-label">试驾时间: </label> 
     <fieldset> 
     <div class="control-group"> 
      <div class="controls"> 
      <div class="col-md-3 has-feedback"> 
       <input type="text" class="form-control has-feedback-left drive-date" name="drive_date" placeholder="试驾日期" aria-describedby="inputSuccess2Status"> 
       <span class="fa fa-calendar-o form-control-feedback left" aria-hidden="true"></span> 
       <span id="inputSuccess2Status" class="sr-only">(success)</span> 
      </div> 
      <div class="col-md-4 col-sm-6 col-xs-12"> 
       <select class="select2_one form-control select2-gentlla" tabindex="-1" name="drive_time" multiple="multiple"> 
       <option value=""></option> 
       <foreach name="hour_list" item="hour"> 
        <option value="{$hour}">{$hour}</option> 
       </foreach> 
       </select> 
      </div> 
      </div> 
     </div> 
     <span aria-hidden="true" class="glyphicon glyphicon-plus glyphicon-margin"></span> 
     </fieldset> 
    </div> 

Der JS-Code:

$('.drive-item').on('click', '.glyphicon-plus', function(){ 
    $form_group = $(this).parent().parent(); 
    $clone = $form_group.clone(); 

    $datepicker = $clone.find('.drive-date'); 
    $datepicker.daterangepicker('destroy'); 
    $datepicker.removeAttr('id'); 
    $datepicker.daterangepicker(datepicker_option); 

    $select2_origin = $form_group.find('.select2_one'); 
    $select2_origin.select2('destroy'); 

    $select2_clone = $select2_origin.clone(); 
    console.log($select2_origin); 
    console.log($select2_clone); 

    $form_group.after($clone); 

    $select2_origin.select2(); 
    $select2_clone.select2(); 

}); 

Jede Hilfe/Anregung spürbar sein wird.

löste ich dieses Problem nach diesem Thread gelesen:
Select2 clone is working only twice

+0

Lösen Sie diese initialisieren [http://stackoverflow.com/questions/29252443/select2-clone-is-working-only- zweimal] (http://stackoverflow.com/questions/29252443/select2-clone-is-working-only-twice) – tdycss

+0

Wenn Sie gelöst haben, bitte, beantworten Sie Ihre Frage, entlarven, was Sie getan haben, lösen Sie die Frage statt bearbeite deinen Beitrag und lege die Lösung ein. Danke –

Antwort

0

Der Klon Sie hat genau die gleiche Markup wie das Original hergestellt. Wenn man also .select2() aufruft, weiß man nicht, welcher zu initialisieren ist, und es tritt ein Fehler auf.

Verwendung

$('select').select2(); 

Dadurch werden alle Instanzen von <select> auf der Seite

+0

Ich versuchte dieses, es fügt zusätzlichen Eingang hinzu – tdycss