There are two comboboxes and one tree involved in the linkage:

<input id="combobox1" class="easyui-combobox" name="combobox1" style=" width:120px;" />
<input id="combobox2" class="easyui-combobox" name="combobox2" style=" width:120px;" />
<div id="tree1" class="easyui-tree"></div>
Copy the code

\

Linkage process:

Combobox1 controls combobox2 and combobox2 controls Tree1

Linkage code:

<script type="text/javascript">
    // Write the subject first, then write the controller. Because the controller calls the controlled. Of course, that doesn't seem to matter
    $("#combobox2").combobox({
        url:"".method: "get".valueField: 'Id'.textField: 'Name'.onSelect: function (record) {// Control tree <----------------------
            var url = "/api/customview/Tree? Id=" + record.Id;
            $('#tree1').tree({
                animate: true.checkbox: true.lines: true.url:url,
                method:"get".onLoadSuccess: function (row, data) {$(this).tree("collapseAll");// All tree nodes are closed
                },
                toolbar: [{
                    text: 'Add Group'.iconCls: 'icon-folder-add'.handler: function () {
                        alert('Add Group'); }}}); },onLoadSuccess: function () { // After loading, select the first item
            var val = $(this).combobox("getData");
            for (var item in val[0]) {
                if (item == "Id") {$(this).combobox("select", val[0][item]); }}}}); $("#combobox1").combobox({
        url: "/api/customview/Item1".method: "get".valueField: 'Id'.textField: 'Name'.onSelect: function (record) {// control combobox2 <----------------------
            var url = "/api/customview/Item2? Id=" + record.Id;
            $("#combobox2").combobox('reload', url); },onLoadSuccess: function () { // After loading, select the first item
            var val = $(this).combobox("getData");
            for (var item in val[0]) {
                if (item == "Id") {$(this).combobox("select", val[0][item]); }}}}); </script>Copy the code


\

\