目标是一个订阅页面,用户可以在其中选择要订阅的属性。这工作。
我有:我正在使用Geodan的插件,能够从左侧列表框(未选中)中选择项目,并将它们移动到右侧列表框(已选中)。左边的列表框是通过JSON填充的,如下所示:
<div class="form-group">
<label for="properties">Properties</label>
<div id="dual-list-box" class="form-group row">
<select class="filter" name="dropdown[]" multiple="multiple" data title="Properties"
data-source="properties.json" data-value="index" data-text="name"></select>
</div>
</div>
然后像这样调用:
$(document).ready(function() {
$('.filter').DualListBox();
});
这很好。您可以从属性中移动属性。Json到右边的列表框。
我想要达到的目标:
尽管这个初始订阅页面工作得很好,但是假设用户想要编辑他们的订阅。也许他们最初订阅了10个属性,但现在他们想再增加10个。你想要的是:
-一个单独的页面,左侧列表框填充属性。json
-通过PHP生成的单独JSON文件填充右侧列表框(获取JSON文件很容易):但我不确定这个插件是否允许从外部源填充右侧列表框。
我大约一周前给Geodan发了邮件,但没有收到回复。
任何帮助我正在努力实现的是感激。我也开放使用其他插件,如果这将是一个更容易的路线。
不需要为左右列表框生成单独的JSON。您只需要将"selected"属性添加到右侧的选项中。
的例子:
<select id="ItemIds" name="ItemIds" multiple="multiple" data-title="Items" data-horizontal="false" data-json="false">
<option value="1">Item 1</option>
<option value="1" selected="selected">Item 2</option>
<option value="3">Item 2</option>
<option value="4" selected="selected">Item 4</option>
</select>
<script type="text/javascript">
jQuery(document).ready(function () {
jQuery('#ItemIds').DualListBox();
});
</script>
参考https://github.com/Geodan/DualListBox/issues/5