jQuery选择-更新选择列表而不丢失选择 [英] jQuery Chosen - update select list without losing selections

问题描述

我正在尝试使用jQuery插件选择"

( http://harvesthq.github.com/chosen/和来更新列表，但是不幸的是，所有选择都被删除了.

有人知道如何在不丢失所选数据的情况下更新所选列表吗?

从理论上讲，我可以手动删除所有选择的生成的

元素，然后填充新的元素，但这是获取SELECT值"数据的问题.

解决方案

如果保存所选项目，这应该非常简单.例如:

<select data-placeholder="Choose a country..." style="width:350px;" multiple="true"  class="chosen-select">
$(".chosen-select").chosen();

现在，在更新所选内容之前，请确保已保存所选的项目，如下所示:

var chosenSelectedItems = $(".chosen-select").val(); // this gets you the select value data
// Update the select items
$('.chosen-select').trigger('liszt:updated');
$(".chosen-select").val(chosenSelectedItems);

这应该能够在更改之前重置原始值.

I'm trying to use jQuery plugin "Chosen"

(http://harvesthq.github.com/chosen/ and https://github.com/harvesthq/chosen)

in my project.

What I'm trying to achieve is update list basing on user selection (ajax call (tree based structure))

This is no bigger problem, because i can use .chosen().change(function()) and remove all unused select items and then .append new ones.

Then I can use .trigger("liszt:updated") to update list, but unfortunately all selections are deleted..

Does anyone know a way how to update chosen list without loosing selected data?

In theory I can manually remove all chosen generated

elements and then populate with new ones, but then is a problem with getting SELECT "value" data.

解决方案

This should be fairly simply if you save the items selected. For example:

<select data-placeholder="Choose a country..." style="width:350px;" multiple="true"  class="chosen-select">
$(".chosen-select").chosen();

Now, before updating the chosen, make sure you save the items selected like this:

var chosenSelectedItems = $(".chosen-select").val(); // this gets you the select value data
// Update the select items
$('.chosen-select').trigger('liszt:updated');
$(".chosen-select").val(chosenSelectedItems);

This should be able to reset the original values before the change.

这篇关于jQuery选择-更新选择列表而不丢失选择的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！