select2 bei bootstrap modal

Kalito

Erfahrenes Mitglied
Hallo,

ich verwende für meine Selectboxen die select2-Klasse von jquery. Bei den normalen Formularen wird alles korrekt über die komplette Breite angezeigt. Wenn ich jedoch dies in einem Modal anwende, wird die Select-Box extrem verkürzt angezeigt.

in beiden Versionen sieht mein Befehl wie folgt aus:
PHP:
echo $this->Form->input('part.status_id', ['options' => $statuses,'empty'=>true,'type'=>'select', 'class'=>'select2']);

Im Formular ist die Ausgabe wie folgt:
HTML:
<div class="form-group select"><label class="control-label" for="release-id">Release</label><select name="release_id" class="select2 form-control select2-hidden-accessible" =""="" id="release-id" tabindex="-1" aria-hidden="true"><option value=""></option><option value="1" selected="selected">Testrelease</option></select><span class="select2 select2-container select2-container--default select2-container--below select2-container--focus" dir="ltr" style="width: 1623px;"><span class="selection"><span class="select2-selection select2-selection--single" role="combobox" aria-haspopup="true" aria-expanded="false" tabindex="0" aria-labelledby="select2-release-id-container"><span class="select2-selection__rendered" id="select2-release-id-container" title="Testrelease">Testrelease</span><span class="select2-selection__arrow" role="presentation"><b role="presentation"></b></span></span></span><span class="dropdown-wrapper" aria-hidden="true"></span></span></div>

bei einem modal sieht die Ausgabe anders aus:
HTML:
<div class="form-group select"><label class="control-label" for="part-scope-id">Scope</label><select name="part[scope_id]" class="select2 form-control select2-hidden-accessible" id="part-scope-id" tabindex="-1" aria-hidden="true"><option value=""></option><option value="8">Manuell</option><option value="9">Automatisiert</option></select><span class="select2 select2-container select2-container--default select2-container--focus" dir="ltr" style="width: 100px;"><span class="selection"><span class="select2-selection select2-selection--single" role="combobox" aria-haspopup="true" aria-expanded="false" tabindex="0" aria-labelledby="select2-part-scope-id-container"><span class="select2-selection__rendered" id="select2-part-scope-id-container"><span class="select2-selection__placeholder">Bitte eine Auswahl treffen</span></span><span class="select2-selection__arrow" role="presentation"><b role="presentation"></b></span></span></span><span class="dropdown-wrapper" aria-hidden="true"></span></span></div>


Irgendwie werde ich nicht schlau, warum das so ist.
 

Anhänge

  • modal.PNG
    modal.PNG
    2,3 KB · Aufrufe: 3
  • form.PNG
    form.PNG
    3,9 KB · Aufrufe: 3
Zurück