easyui combobox实现搜索下拉补全功能

来源:互联网 发布:淘宝手绘素描造假 编辑:程序博客网 时间:2024/05/20 05:25

  最近公司对后台进行改版,使用的是easyui+thinkphp来实现,之前也没接触过easyui,结果一用感觉特恶心,一个是官方文档并不完善,另外一个则是这种动态生成html的前端框架在需要对html用js动态操作的需求时,往往会跟其他js框架产生冲突。吐槽这么多,需求还是得做的,先来讲讲用combobox实现搜索下拉框。

  首先,在不了解某类技术的时候,最重要最重要的就是去看API文档,即使它写得再不好。。。

  在easyui官网找到Combobox 组合框的说明页,先仔细将combobox的属性,方法,事件的说明看一遍,想想有没有符合自己需求的。然后就在属性说明中的loader发现它可以远程加载数据,下图就是对loader的一个说明:

然后下载easyui官方demo找到combobox里面有个demo页remotejsonp.html,里面给出的远程加载数据的方案就是封装一个myloader方法对远程接口进行访问,处理后返回给combobox。

  如上图就是封装好的loader函数,可以用这个作为模板针对实际需求改动,与combobox绑定则参考下图代码:

valueField和textField分别对应loader中success返回的id和name。

下面是效果图:

原创粉丝点击