layui查询多条输入框的数据并且显示表格

可以使用layui的table组件和form组件来实现查询多条输入框的数据并显示表格的功能。

首先，需要在HTML页面中添加多个输入框和查询按钮，并在表格容器中添加table组件的HTML结构，如下所示：

<div class="layui-form">
  <div class="layui-form-item">
    <label class="layui-form-label">姓名</label>
    <div class="layui-input-inline">
      <input type="text" name="name" placeholder="请输入姓名" autocomplete="off" class="layui-input">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">年龄</label>
    <div class="layui-input-inline">
      <input type="text" name="age" placeholder="请输入年龄" autocomplete="off" class="layui-input">
    </div>
  </div>
  <div class="layui-form-item">
    <div class="layui-input-block">
      <button class="layui-btn" lay-submit lay-filter="search">查询</button>
    </div>
  </div>
</div>

<table id="dataTable" lay-filter="data"></table>

然后，需要在JavaScript中初始化form组件，并监听查询按钮的点击事件，根据输入框的值发送请求获取数据并渲染到表格中，如下所示：

// 初始化form组件
layui.use(['form', 'table'], function(){
  var form = layui.form;
  var table = layui.table;

  // 监听查询按钮的点击事件
  form.on('submit(search)', function(data){
    // 获取输入框的值
    var name = data.field.name;
    var age = data.field.age;

    // 发送请求获取数据
    $.ajax({
      url: '/getData',
      type: 'GET',
      data: {
        name: name,
        age: age
      },
      success: function(res){
        // 渲染表格
        table.render({
          elem: '#dataTable',
          data: res.data,
          cols: [[
            {field: 'name', title: '姓名'},
            {field: 'age', title: '年龄'}
          ]]
        });
      }
    });

    return false;
  });
});

上面的代码中，需要根据自己的项目路径修改ajax请求的url，以及表格渲染的列数和列名。此外，还需要在后端编写获取数据的接口。