我正在使用select2库的
它工作得很好,但是一旦保存后,顺序就会被打乱并按字母顺序排序。
我想知道是否有可能在
请给出建议。
select2()
字段,并启用了拖放排序功能。它工作得很好,但是一旦保存后,顺序就会被打乱并按字母顺序排序。
我想知道是否有可能在
select2()
字段中以任何方式保存拖放后的元素顺序。请给出建议。
select2()
字段,并启用了拖放排序功能。select2()
字段中以任何方式保存拖放后的元素顺序。我可以为您提供两种可能适用的选项:
选项1:简单易行
检查您输入控件的顺序,特别是:
$("#e15").select2({tags:["red", "green", "blue", "orange", "white", "black", "purple", "cyan", "teal"]});
$(function(){
if ($.cookie('OrderedItemList') != null){
$("#e15").select2({tags: $.cookie('OrderedItemList').split(',')});
}
$("#e15").on("change", function() {
$("#e15_val").html($("#e15").val());
$.cookie('OrderedItemList', $("#e15").val(), { expires: 365 });
});
});
我曾经也遇到过你的问题。我用类似以下方法解决了它...
$("#reports").on('change', function(){
var data = $(this).select2('data');
var array = [];
$.each(data, function(index, val) {
array[index]=val.id;
});
array.join(',');
$("input[name=reports]").val( array );
});
<form class="form-horizontal form-bordered" action="#something" method="post" accept-charset="utf-8" target="_blank" >
<input type="text" name="reports" >
<select id="reports" class="form-control select2me" multiple >
<? foreach ($Balance::getSeparators() as $key => $value ) { ?>
<option value="<?=( $key )?>"><?=( $value )?></option>
<? } ?>
</select>
</form>
这样,input[name=reports]
将会向您的页面发送正确的顺序。
<select/>
和<option/>
标签,而不是<input/>
标签。我针对版本4解决了这个问题,方法如下:
$(".select2").select2().on('select2:select', function(e){
var $selectedElement = $(e.params.data.element);
var $selectedElementOptgroup = $selectedElement.parent("optgroup");
if ($selectedElementOptgroup.length > 0) {
$selectedElement.data("select2-originaloptgroup", $selectedElementOptgroup);
}
$selectedElement.detach().appendTo($(e.target));
$(e.target).trigger('change');
})
在我的情况下,隐藏字段解决方案是一个好的解决方案,但Select2插件仍然保持数字/字母顺序,而不是用户选择的顺序。
我找到了一个解决方案,解决了我所有的需求。
在我的Symfony表单声明中,将有一个名为selectOrder
的隐藏字段,用于保存当前顺序:
$("#form_people").on('change', function(){
var data = $(this).select2('data');
var array = [];
$.each(data, function(index, val) {
array[index]=val.id;
});
array.join(',');
$("#selectOrder").val( array );
});
在表单声明后的javascript部分,有我的多选Select2:
var sel = $("#form_people").select2({
maximumSelectionSize: 3,
minimumInputLength: 1,
escapeMarkup: function(m) { return m; },
});
然后
//After reloading page you must reselect the element with the
//right previous saved order
var order = $("#selectOrder").val().split(",");
var choices = [];
for (i = 0; i < order.length; i++) {
var option = $('#form_people option[value="' +order[i]+ '"]');
choices[i] = {id:order[i], text:option[0].label, element: option};
}
sel.select2('data', choices);
这正是我所需要的,也许可以帮助其他开发者