Yii中Bootstrap Modal和Select2的问题

Question

我已经在Yii开发者论坛发布了这个问题，但迄今为止还没有得到任何答复，所以我认为值得尝试在这里发布静默。

阅读了几个主题和博客文章后，我仍然在为这个问题而苦苦挣扎。

我在一个项目中，我的客户要我准备的应用程序能够使用可编辑网格的中间。出于这个原因，我包括引导和x-editable扩展。为了在网格中创建新记录，我使用了一个按钮，该按钮调用一个模式窗口，在该窗口中，我使用eselect2下拉菜单来渲染控制器/创建动作。

当我打电话给我的控制器/创建从浏览器操作它工作正常，并产生所有eselect2的下拉列表中，但是当我使之成为一个引导模式窗口，它生成简单的HTML选择。

，我读了THISIS现有问题与bootstarp和选择2，另外还有一些解决方法，但我不能让他们没有在所有的工作。

我在生成的HTML认识到，当视图被渲染到模式窗口的eselect2脚本不包含在HTML头部。我手动添加eselect2脚本到标题，但它没有解决我的问题。

有人可以帮忙吗？

请找兹我的代码：

在我的管理视图生成按钮来创建新的项目：

<?php $this->widget('bootstrap.widgets.TbButton', array(
    'label'=>'Új cikk rögzítése', 
    'type'=>'primary', // null, 'primary', 'info', 'success', 'warning', 'danger' or 'inverse' 
    'size'=>'normal', // null, 'large', 'small' or 'mini' 
    'htmlOptions'=>array(
     'data-toggle'=>'modal', 
     'data-target'=>'#myModal', 
     'href'=>$this->createUrl('cikk/create'), 
    ), 
)); ?> 

生成模式在我的管理视图

<?php $this->beginWidget('bootstrap.widgets.TbModal', array(
       'id'=>'myModal', 
       'options' => array(
           'backdrop' => 'static', 
           'keyboard' => true), 
     )); ?> 

<div class="modal-header"> 
    <a class="close" data-dismiss="modal">&times;</a> 
    <h4>Új cikk rögzítése</h4> 
</div> 

<div class="modal-body"> 
    <?php //echo $this->renderPartial('_form', array('model'=>$model),false, true); ?> 
</div> 

<div class="modal-footer"> 
    <?php $this->widget('bootstrap.widgets.TbButton', array(
     'type'=>'primary', 
     'label'=>'Adatok rögzítése', 
     'url'=>'', 
     'htmlOptions'=>array('onclick' => '$("#cikk-form").submit()'), 
    )); ?> 
    <?php $this->widget('bootstrap.widgets.TbButton', array(
     'label'=>'Mégsem', 
     'url'=>'#', 
     'htmlOptions'=>array('data-dismiss'=>'modal'), 
    )); ?> 
</div> 

<?php $this->endWidget(); ?> 

<script type="text/javascript"> 
$("a[data-toggle=modal]").click(function(){ 
    var target = $(this).attr('data-target'); 
    var url = $(this).attr('href'); 
    if(url){ 
     $(target).find(".modal-body").load(url); 
    }}); 

$(function(){$("#myModal").draggable().resizable();}); 

</script> 

我的_form视图呈现在模态窗口中：

<?php $form=$this->beginWidget('bootstrap.widgets.TbActiveForm', array(
     'id'=>'cikk-form', 
     'type'=>'horizontal', 
     // Please note: When you enable ajax validation, make sure the corresponding 
     // controller action is handling ajax validation correctly. 
     // There is a call to performAjaxValidation() commented in generated controller code. 
     // See class documentation of CActiveForm for details on this. 
     'enableAjaxValidation'=>false, 
)); ?> 

     <p class="note">A <span class="required">*</span> -al jelölt mezők kitöltése kötelező.</p> 

     <?php echo $form->errorSummary($model); ?> 
<fieldset> 
     <?php echo $form->textFieldRow($model, 'megnevezes', array('class'=>'span3')); ?> 

     <?php echo $form->labelEx($model,'mertekegyseg'); ?> 
     <?php $this->widget('ext.select2.ESelect2', array(
       'model' => $model, 
       'attribute' => 'mertekegyseg', 
       'data' => Mertekegyseg::model()->getMertekegysegOptions(), 
        'htmlOptions'=>array('empty' => 'Válasszon mértékegységet!') 
      ));?> 
     <?php echo $form->error($model,'mertekegyseg'); ?> 

</fieldset> 
<?php $this->endWidget(); ?> 

SOLUTION：

我在这里复制解决你在下面的评论丢失之前。

在我的情况的问题是，我的一些JavaScript的纠结与其他脚本，这就是为什么选择2未正确放置。

我在_form视图应用Yii::app()->clientscript->scriptMap['*.js'] = false;和解决了我的问题。

大到agriboz帮助我追踪问题！

Answer 1

$('#myModal').on('shown.bs.modal', function (e) { 
    $('selector').select2(); 
}) 

模态显示后，您应该尝试运行select2。

Thorough information.