Layui修改刷新当前页面记录搜索值

2022-12-02 阅读：2421 类型：前端分类：Layui 标签： layui.js html Layui

在开发项目中，我们需要保存成功之后，刷新父页面，也就是重新加载并保存之前搜索数据，可以使用那面的代码实现

1、监听搜索操作，保存到sessionStorage

// 监听搜索操作
    form.on('submit(data-search-btn)', function (data) {
      var result = JSON.stringify(data.field);
      // layer.alert(result, {
      //   title: '最终的搜索信息'
      // });
      // 将电话，卡号，姓名保存到sessionStorage
       sessionStorage.setItem('telValue', JSON.stringify(data.field.tel));
       sessionStorage.setItem('cardValue', JSON.stringify(data.field.card));
       sessionStorage.setItem('nameValue', JSON.stringify(data.field.name));

      //执行搜索重载
      table.reload('currentTableId', {
        page: {
          curr: 1
        }
        , where: {
          searchParams: result
        }
      }, 'data');

      return false;
    });

2、刷新select选择框渲染，给表单赋值

     // 刷新select选择框渲染
     form.render('select');
     //给表单赋值
     form.val("filter", { //filter 即 class="layui-form" 所在元素属性 lay-filter="" 对应的值
       "tel": JSON.parse(sessionStorage.getItem('telValue')),
       "card": JSON.parse(sessionStorage.getItem('cardValue')),
       "name": JSON.parse(sessionStorage.getItem('nameValue')),
     });
    //从表单取值
     var data1 = form.val("filter");//filter 即 class="layui-form" 所在元素属性 lay-filter="" 对应的值
     console.log(data1);
      var result = {card: JSON.parse(sessionStorage.getItem('cardValue')), tel: JSON.parse(sessionStorage.getItem('telValue')), name: JSON.parse(sessionStorage.getItem('nameValue'))};
      var result2 = JSON.stringify(result);

      console.log(result2)

      //执行搜索重载
      table.reload('currentTableId', {
        page: {
          curr: 1
        }
        , where: {
          searchParams: result2
        }
      }, 'data');