大佬教程收集整理的这篇文章主要介绍了jquery – 当动态选项设置时,select2 allowClear未启用,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
如果我在选择中构建select2,销毁它,更新html并重建它似乎并不重要:
var enableSelect2 = function () { $(this).select2({ width: '200px',allowClear: true,minimumResultsForSearch: 7,formatResult: function (result,container,query,escapeMarkup) { var markup = []; markMatchedSelect2Text(result.text,query.term,markup,escapeMarkup); return markup.join(''); } }); },populateDropdown = function () { var filterBy = this.id,t = $(this); $.ajax({ type: 'post',url: '/search/get' + (filterBy === 'panel_id' ? 'Isps' : 'Packages') + '/' + t.val(),success: function (data) { var toRebuild,target; if (filterBy === 'panel_id') { toRebuild = $('#isp_id,#package_id'); target = $('#isp_id'); } else { toRebuild = $('#package_id'); target = $('#package_id'); } toRebuild.each(function () { $(this).select2('destroy'); }); target.html(data); if (filterBy === 'panel_id') { $('#package_id').html($(document.createElement('option')).attr('value',0).text('Select ISP first\u2026')); } toRebuild.each(enableSelect2); } }); }; $('body').on('change','#searchForm #isp_id,#searchForm #panel_id',populateDropdown);
或者如果我使用带有隐藏输入的JSON:
$(function() { var data = [ [{id:0,text:'black'},{id:1,text:'blue'}],[{id:0,text:'9'},text:'10'}] ]; $('#attribute').select2({allowClear: true}).on('change',function() { $('#value').removeClass('select2-offscreen').select2({data:data[$(this).val()],allowClear: true}); }).trigger('change'); });
http://jsfiddle.net/eGXPe/116/
任何想法为什么清除按钮消失?
编辑:
道歉,我没有澄清我的html。在我的代码中,每个选择都有一个数据占位符属性。这不是我提供的小提琴,因为它不是我的小提琴,而是从另一个SO问题借来的。我现在已经更新了数据占位符,它的作品:http://jsfiddle.net/eGXPe/119/。
这是我以前没有包含的html的twig代码:
<li> <label for="edit[panel_id]" class="hidden">Edit Panel ID?</label> <input type="checkBox" id="edit[panel_id]" name="edit[panel_id]" /> <label for="panel_id">Panel:</label> <select id="panel_id" name="panel_id" data-placeholder="Select a panel"> <option></option> {% for panel in related.panel_id %} <option value="{{ panel.value }}">{{ panel.name }}</option> {% endfor %} </select> </li> <li> <label for="edit[isp_id]" class="hidden">Edit ISP ID?</label> <input type="checkBox" id="edit[isp_id]" name="edit[isp_id]" /> <label for="isp_id">ISP:</label> <select id="isp_id" name="isp_id" data-placeholder="Select an ISP"> <option></option> {% for isp in related.isp_id %} <option value="{{ isp.value }}">{{ isp.name }}</option> {% endfor %} </select> </li> <li> <label for="edit[package_id]" class="hidden">Edit Package ID?</label> <input type="checkBox" id="edit[package_id]" name="edit[package_id]" /> <label for="package_id">Package:</label> <select id="package_id" name="package_id" data-placeholder="Select a package"> <option></option> <option value="0">Select ISP first…</option> </select> </li>
–
所以你的代码应该是这样的:
$('#attribute').select2({ allowClear: true,placeholder: "Select an attribute" }).on('change',function() { $('#value') .removeClass('select2-offscreen') .select2({ data:data[$(this).val()],placeholder: "Select a value" }); }).trigger('change');
以上是大佬教程为你收集整理的jquery – 当动态选项设置时,select2 allowClear未启用全部内容,希望文章能够帮你解决jquery – 当动态选项设置时,select2 allowClear未启用所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。