给easyui datagrid添加搜索栏

最新推荐文章于 2022-05-09 17:22:30 发布

weixin_33895516

最新推荐文章于 2022-05-09 17:22:30 发布

阅读量218

点赞数

CC 4.0 BY-SA版权

文章标签： javascript python ViewUI

原文链接：https://my.oschina.net/u/818848/blog/123997

本文介绍如何在EasyUI的Datagrid组件中添加搜索功能。通过简单的代码实现了一个搜索框，用户可以通过输入姓名或拼音进行查询，并且可以通过按下回车键触发搜索函数。

2019独角兽企业重金招聘Python工程师标准>>>

最近使用easyui，发现datagrid默认toolbar没有搜索输入栏，经过反复实验终于添加上了，分享给各位。先上图看一下效果

$("<td style='padding: 0 8px;'><input class='easyui-searchbox' style='width: 200px;' " +
                "prompt='请输入姓名或拼音查询' searcher='person.search'></td>").
                prependTo(".datagrid-toolbar table tbody tr");

var person = {
        search: function (value) {
            $("#personList").datagrid("load", {
                index: value
            });
        }
}

很简单吧，可以用回车键触发搜索函数

转载于:https://my.oschina.net/u/818848/blog/123997