0

我正在使用与 Select2 插件一起使用的Yii2 和 Kartik DepDrop 。我想要的是使用 jQuery 或纯 JavaScript 获取 select2 插件的所有选定值(因为它是多选)。

这是我的 DepDrop:

echo $form->field($model, 'tags')->widget(DepDrop::classname(), [
        'data' => $listTag,
        'type' => DepDrop::TYPE_SELECT2,
        'options' => ['multiple' => true,'id'=>'tbpoint-tags'],
        'select2Options'=>['options' => ['multiple' => true],'pluginOptions'=>['allowClear'=>true]],
        'pluginOptions'=>[
            'depends'=>['tbpoint-categoria','tbpoint-sub_categoria'],
            'placeholder'=>'Select...',
            'url'=>Url::to(['/site/deptag'])
        ]
    ]);

这是 html 在网页中的样子:

     <div class="form-group field-tbpoint-tags">
    <label class="control-label col-sm-3" for="tbpoint-tags">Tags</label>
    <div class="col-sm-9">
    <span id="parent-s2-togall-tbpoint-tags" style="display:none"></span><input name="TbPoint[tags]" value="" type="hidden">

<select id="tbpoint-tags" class="form-control select2-hidden-accessible" name="TbPoint[tags][]" multiple="" size="4" data-krajee-depdrop="depdrop_bfb7e005" data-s2-options="s2options_c4acac00" data-krajee-select2="select2_c7fb3810" style="display:none" tabindex="-1" aria-hidden="true"><option value="">Select...</option><option value="7">Tag 1</option><option value="5">Tag 1-1</option>
</select>

<span class="select2 select2-container select2-container--krajee select2-container--above select2-container--focus" dir="ltr" style="width: 100%;"><span class="selection"><span class="select2-selection select2-selection--multiple" role="combobox" aria-haspopup="true" aria-expanded="false" tabindex="-1"><ul class="select2-selection__rendered"><span class="select2-selection__clear">×</span><li class="select2-selection__choice" title="Tag 1"><span class="select2-selection__choice__remove" role="presentation">×</span>Tag 1</li><li class="select2-selection__choice" title="Tag 1-1"><span class="select2-selection__choice__remove" role="presentation">×</span>Tag 1-1</li><li class="select2-search select2-search--inline"><input class="select2-search__field" tabindex="0" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" role="textbox" aria-autocomplete="list" placeholder="" style="width: 0.75em;" type="search"></li></ul></span></span><span class="dropdown-wrapper" aria-hidden="true"></span></span>

    <div class="help-block"></div>
    </div>
    </div>

我已经按照其他几个页面、论坛和 stackoverflow 问题中的说明进行操作。我在我的 javascript 中尝试了以下操作:

1. var selectedTags = $('#tbpoint-tags').select2().val();
2. var selectedTags = $('#tbpoint-tags').select2('val');
3. var selectedTags = $('#tbpoint-tags').select2('data');
4. var selectedTags = $('#tbpoint-tags').val();

但他们都没有帮助我。使用 console.log() 打印时,selectedTags 总是“不可用”。

最奇怪的部分是当我尝试这个时:

var selectedTags = $('#tbpoint-tags');
console.log(selectedTags);

它还返回“不可用”,但 id 为“tbpoint-tags”的 html 元素确实存在。

任何帮助将不胜感激。

4

1 回答 1

-1

形式:

'echo $form->field($model, 'id_beneficiario')->widget(DepDrop::classname(), [
'options'=>['id'=>'beneficiario-id', 'style'=>'width:300px;'],
'type'=>DepDrop::TYPE_DEFAULT,
'pluginOptions'=>[
    'depends'=>['cliente-id','producto-id'],
    'placeholder'=>'Seleccione el Beneficiario',
    'url'=>Url::to(['/xxx/yyy/zzz]
 ]);
]
]);'

Firefox 中的 F12:

'<select
id="beneficiario-id" 
class="form-control" name="xxxxx" 
style="width:300px;" 
data-krajee-depdrop="depdrop_c24f0747" aria-invalid="false">
    <option value="">Seleccione el ..</option>
    <option value="51">A</option>
    <option value="53">c</option>
    <option value="52">b</option>
    <option value="206">d</option>
</select>'

JavaScript:

'var vIntBeneficiario = $("#beneficiario-id").val();'
于 2018-08-15T14:57:59.943 回答