日期范围筛选BootstrapTable数据功能故障求助

1. 检查前端参数传递逻辑 #

• 点击刷新按钮时，先确认正确获取日期输入框的起始、结束值，比如用原生JS或jQuery：

  $('#refreshBtn').click(function() {
    const startDate = $('#startDate').val();
    const endDate = $('#endDate').val();
    // 调用BootstrapTable刷新方法并携带参数
    $('#your-table-id').bootstrapTable('refresh', {
      query: {
        start: startDate,
        end: endDate
      }
    });
  });
  

• 打开浏览器F12的Network面板，查看刷新后的请求，确认start和end参数是否出现在请求URL的Query String里，值是否和输入框一致。

2. 验证后端PHP参数接收 #

• 在查询PHP文件开头，先打印接收的参数，确认是否拿到前端传递的值：

  // 根据请求方式用$_GET或$_POST，这里假设是GET
  var_dump($_GET['start'], $_GET['end']);
  exit;
  

• 如果参数为空，检查前后端参数名是否完全一致（比如前端传startDate，后端不能写成start），或者请求方式是否匹配（前端AJAX用POST的话，后端要用$_POST）。

3. 修正SQL查询逻辑 #

• 不要直接拼接SQL（避免注入风险），用预处理语句，同时确保日期格式和数据库字段匹配：

  $start = $_GET['start'];
  $end = $_GET['end'];
  // 假设用PDO连接数据库
  $stmt = $pdo->prepare("SELECT * FROM your_table WHERE create_time BETWEEN ? AND ?");
  // 如果数据库是datetime类型，前端只传日期的话，补全时间范围
  $stmt->execute([$start . ' 00:00:00', $end . ' 23:59:59']);
  $data = $stmt->fetchAll(PDO::FETCH_ASSOC);
  echo json_encode($data);
  

• 测试时可以把生成的SQL语句打印出来，手动在数据库客户端执行，看是否能返回预期数据。

4. 检查BootstrapTable刷新配置 #

• 确保表格初始化时没有硬编码日期参数，且刷新时用bootstrapTable('refresh')方法，而非重新初始化表格：

  $('#your-table-id').bootstrapTable({
    url: 'your-query.php',
    // 其他配置...
  });
  

• 如果开启了服务器端分页（sidePagination: 'server'），要确保后端在处理分页参数（page、limit）的同时，也带上日期筛选条件。

5. 排查控制台错误 #

• 打开浏览器F12的Console面板，查看是否有JS报错（比如变量未定义、AJAX请求失败），这些错误会直接中断刷新逻辑。

内容的提问来源于stack exchange，提问作者Acelando