<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title></title>

    <link href="Resurces/themes/easyui.css" rel="stylesheet" />

    <link href="Resurces/themes/icon.css" rel="stylesheet" />

    <script src="Resurces/Javascript/jquery.min.js"></script>

    <script src="Resurces/Javascript/jquery.easyui.min.js"></script>

    <script>

        $(function () {

            $('#cc').combotree({

                method: 'get', //必须指明

                url: 'Data/tree_data1.json',//必须指明

                editable: true,   //编辑，支持模糊查询

                multiple: true,   //为true，出来多选框，勾选多个

                required: true,

                missingMessage: '不能为空，请选择',

                prompt: '请选择下拉...',

                onHidePanel: function () {

                    var _options = $(this).combobox('options');

                    var _data = $(this).combobox('getData');/* 下拉框所有选项 */

                    var _value = $(this).combobox('getValue');/* 用户输入的值 */

                    var _b = false;/* 标识是否在下拉列表中找到了用户输入的字符 */

                    for (var i = 0; i < _data.length; i++) {

                        if (_data[i][_options.valueField] == _value) {

                            _b = true;

                            break;

                        }

                    }

                    if (!_b) {

                        $(this).combobox('setValue', '');

                    }

                }

            });

            $('#dd').combobox({

                method: 'get', //必须指明

                url: 'Data/combox1.json',//必须指明

                valueField: 'id',

                textField: 'text',

                editable: true,   //编辑，支持模糊查询

                //multiple: true,   //为true，出来多选框，勾选多个

                required: true,

                onChange: function (newValue, oldValue) {

                    reload();//实现联动

                }

            });

        });

        function reload() {

            $('#dd').combobox({

                method: 'reload', //必须指明

                url: 'Data/combox1.json?param='+'这里是传的新值'+'&a='+Math.random()//必须指明

            });

        }

        function GetData() {

            var t = $('#cc').combotree('getData');

            alert(t.length);

        }

        function SetDefault() {

            var t = $('#cc').combotree('getData');

            $('#cc').combotree('select',t[0].id);

        }

        function getValues() {

            var t = $('#cc').combotree('getValues');

            alert(t);

        }

        function getValue() {

            var t = $('#cc').combotree('getValue');

            alert(t);

        }

        function setValues() {

            $('#cc').combotree('setValues', ['111', '112']);

        }

        function setValue() {

            $('#cc').combotree('setValue', '11');

        }

        function disable() {

            $('#cc').combotree('disable');

        }

        function enable() {

            $('#cc').combotree('enable');

        }

    </script>

</head>

<body>

    <form id="form1" runat="server">

        <div>

            <input id="cc" />

            <input id="dd" />

            <input type="button" value="getValue" onclick="getValue()" />

            <input type="button" value="getValues" onclick="getValues()" />

            <input type="button" value="setValue" onclick="setValue()" />

            <input type="button" value="setValues" onclick="setValues()" />

            <input type="button" value="disable" onclick="disable()" />

            <input type="button" value="enable" onclick="enable()" />

        </div>

    </form>

</body>

</html>

easyui combotree combobox 使用例子的更多相关文章

  1. 表单（上）EasyUI Form 表单、EasyUI Validatebox 验证框、EasyUI Combobox 组合框、EasyUI Combo 组合、EasyUI Combotree 组合树

    EasyUI Form 表单 通过 $.fn.form.defaults 重写默认的 defaults. 表单(form)提供多种方法来执行带有表单字段的动作,比如 ajax 提交.加载.清除,等等. ...

  2. easyui combotree模糊查询

    技术交流QQ群:15129679 让EasyUI的combobox和combotree同时支持自定义模糊查询,在不更改其他代码的情况下,添加以下代码就行了: /** * combobox和combot ...

  3. easyui combotree 异步树 前端写法js

    简要说下使用场景: combotree下拉框第一次加载时,请求一个接口,页面上展示顶层节点们(可以理解为最顶层的节点,比如所有的一级公司): 当点击其中一个节点前面的小三角展开时,再次请求服务器接口( ...

  4. easyui的combobox下拉框初始化默认值以及保持该值一直显示的方法

    easyui的combobox下拉框默认初始值是空,下面是实现从远程加载数据之后初始化默认值,以及让该值一直排在下拉框的最顶部的方式. 目前的需求是需要在初始化的时候添加"全部数据库&quo ...

  5. EasyUI ComboTree无限层级异步加载示例

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="EasuUIDemoTree.a ...

  6. EasyUI 中 Combobox里的onChange和onSelect事件的区别

    EasyUI 中 Combobox 选项发生改变时会触发 onChange,onSelect,onClick 3 个事件. 最近要做一个级联的 Combo 菜单,类似于选择地址时让用户填写省,市,区的 ...

  7. Jquery EasyUI Combotree和 EasyUI tree展开所有父节点和获取完整路径

    Jquery EasyUI Combotree展开所有父节点 Jquery EasyUI Combotree获取树完整路径 Jquery EasyUI tree展开所有父节点 Jquery EasyU ...

  8. Jquery EasyUI Combotree根据选中的值展开所有父节点

    Jquery EasyUI Combotree根据选中的值展开所有父节点  Jquery EasyUI Combotree 展开父节点, Jquery EasyUI Combotree根据子节点选中的 ...

  9. Jquery EasyUI Combotree 初始化赋值

    Jquery EasyUI Combotree 初始化赋值 ================================ ©Copyright 蕃薯耀 2018年5月7日 https://www. ...

随机推荐

  1. POJ2104(可持久化线段树)

    K-th Number Time Limit: 20000MS   Memory Limit: 65536K Total Submissions: 58759   Accepted: 20392 Ca ...

  2. 一起来看看JavaScript中==和===有何不同

    '; // => true 如果其中一个值是true,则将其转换为1再进行比较.如果其中一个值是false,则将其转换为0再进行比较: true == 0; // => false fal ...

  3. <Android 基础（三十四）> TabLayout 从头到脚

    1. 简介 1.TabLayout给我们提供的是一排横向的标签页 2.#newTab()这个方法来创建新的标签页,然后用过#setText()和#setIcon方法分别修改标签页的文本和图标,创建完成 ...

  4. Maven学习（一）概念简述和安装教程

    刚开始由.net转向java,公司的项目中就开始使用maven,感觉他就像nuget一样,但是他又比nuget要强大(毕竟他是项目管理工具). maven概述 在这里,就不背书包了,怎么简单直接怎么来 ...

  5. ActiveReports 区域报表中的事件介绍

    1.仅触发一次的事件 以下是在报表的处理过程中仅触发一次的所有事件这些事件在报表的处理周期中仅在最开始和结束前触发一次. ReportStart 该事件在DataInitialize事件触发之前发生. ...

  6. wampserver的配置教程

    对于初做PHP网站的朋友来说,第一步肯定是希望在自己电脑是搭建PHP环境,省去空间和上传的麻烦!但搭建环境也不是件容易的事情,特别是对于新手同学来说!因此在这里跟大家介绍我作为一名新手在使用的方便好用 ...

  7. Flutter Dart中的异步

    以下内容从官网得到: https://webdev.dartlang.org/articles/performance/event-loop Even-Looper Dart是单线程模型,也就没有了所 ...

  8. CSS样式----CSS样式表的继承性和层叠性（图文详解）

    本文最初于2017-07-29发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 本文重点 CSS的继承性 CSS的层叠性 计算权重 ...

  9. 反射式DLL注入--方法

    使用RWX权限打开目标进程,并为该DLL分配足够大的内存. 将DLL复制到分配的内存空间. 计算DLL中用于执行反射加载的导出的内存偏移量. 调用CreateRemoteThread(或类似的未公开的 ...

  10. 使用托管快照创建作为 Azure 托管磁盘存储的 VHD 的副本

    创建快照 创建 OS 或数据磁盘 VHD 的快照,以便将其用作备份或用于排查 VM 问题. 快照是 VHD 的完整只读副本. 使用 Azure 门户创建快照 登录到 Azure 门户. 首先在左上角单 ...