• 0
  • 0

JQ结合Layui加载列表优化

2019-12-04 994 0 admin 所属分类:HTML

JQ自带表带序列化,前提是要把表单元素放在form标签中.(不能为div)

在LAYUI中通过给容器添加一个样式 .layui-form

然后在按钮添加LAYUI表单监听参数  

lay-submit lay-filter="LAY-user-back-search"
// 监听搜索
form.on('submit(LAY-user-back-search)', function (data) {
    table.reload('table', {
        where: data.field,
        page: {
            curr: 1 //重新从第 1 页开始
        }
    })
});

初始化请求

where: $.extend($('.layui-form').serializeObject(), extra)


而在初始化的时候我们为了避免手工传入表单字段。可以使用JQ序列化功能。

目前JQ 的序列化有两个类型 一个是拼接成GET参数返回 一个是返回数组(存放json对象 )

序列化请求参数

serialize()

序列化数组

serializeArray()

额外封装一个返回JSON对象的序列化操作,方便和LAYUI兼容

$.prototype.serializeObject = function() {
    var a, o, h, i, e;
    a = this.serializeArray();
    o = {};
    h = o.hasOwnProperty;
    for (i = 0; i < a.length; i++) {
        e = a[i];
        if (!h.call(o, e.name)) {
            o[e.name] = e.value;
        }
    }
    return o;
};


返回顶部