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

￡神魔★判官ぃ 2024-02-19 19:11 51阅读 0赞

直接代码吧！

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.  \}