jquery UI级联自动完成小部件

Question

我正在尝试构建级联自动完成组合框。

http://jsfiddle.net/BurritoWhisperer/zbjk1ss1/3/

我希望看到当我从第一个选择中选择一个项目时（id =＆＃34; one＆＃34;），我希望看到第二个选择的UI更新（id =＆＃34; 2＆＃34;）。

if (arg1 == "1") {
    $("#two").append($('<option selected></option>').val('1.1').html('1.1');

    $("#two").append($('<option></option>').val('1.2').html('1.2');
} else if (arg1 == "2") {
    $("#two").append($('<option selected></option>').val('2.1').html('2.1');

    $("#two").append($('<option></option>').val('2.2').html('2.2');
}

我可以看到触发器发生，但UI永远不会更新。

有什么想法吗？

Answer 1

缺少3件事。

https://jsfiddle.net/mindlessbaby/zbjk1ss1/70/

1）用ui-widget类

包装组合框

<div class="ui-widget">
<select id="one"></select>
<br/>
<select id="two"></select>

2）// added- inserted refresh function -BD refresh: function () { selected = this.element.children(":selected"); this.input.val(selected.text()); },

3）// added- update second box value and refresh ui -BD $("#two").val("").combobox("refresh");