layui 表格 输入框条件查询问题

直接代码吧！

 

layui.use(['table', 'form', 'jquery', 'layer'], function () {
        var table = layui.table;
        var layer = layui.layer;
        var form = layui.form;
        var $ = layui.jquery;

      var $table  = table.render({
            title: '文章管理',
            id: 'articleTable',
            elem: '#tab',
            skin: 'row',
            size: 'lg',
            page: true,
            toolbar: '#Sech',
            height: 700,
            url: '/article/wzglList?state=1',
            cols: [
                [
                    {checkbox: true},
                    {title: '序号', type: 'numbers'},
                    , {field: 'title', title: '标题', width: 270}
                    , {
                    field: 'creationTime', title: '创建时间', align: 'center', sort: true, templet: function (row) {
                        return createTime(row.creationTime)
                    }
                }
                    , {field: 'readNumber', title: '阅读量', sort: true, align: 'center'}
                    , {field: 'likes', title: '点赞量', align: 'center', sort: true}
                    , {
                    title: '文章分类', align: 'center', templet: function (row) {
                        return zy(row.articleTypes.articleTypeName)
                    }
                }
                    , {title: '操作', toolbar: '#Butt', align: 'center'}

                ]
            ],

        });


        $('.layui-btn').on('click', function(){
       
            $table.reload({
                where:{
                    condition:$("#demoReload").val().trim()
                }

            })
        });

在输入框中输入内容点击查询按钮  通过 layui .table reload()这个方法重新加载表格  把condition:$("#demoReload").val().trim()  参数传递到后台

 

大家可以看一下官方文档下面就是文档的讲解

1. //这里以搜索为例
2. tableIns.reload({
3. where: { //设定异步数据接口的额外参数，任意设
4. aaaaaa: 'xxx'
5. ,bbb: 'yyy'
6. //…
7. }