bootstrap-table无法按预期方式显示结果的问题

Question

问题遇到的现象和发生背景

数据库中有多条单号记录，但是在网页端通过多个单号查询时，数据可以成功从后台查询到，但是在bootstrap-table中无法显示正确的结果

前端代码

var table
var data
var codes = []

$(function () {
  moment.locale('zh-CN')

  let columns = []
  for (let i = 0; i < 11; i++) { columns.push({ formatter: formatter, }) }

  //初始化表格 
  table = $('#dataTable').bootstrapTable({
    buttonsOrder: ['refresh'],
    onSearch: onSearch,
    formatSearch: () => { return '测试 },
  })

  if (kw) {
    $('.search-input').val(kw)
    let url = `/api/purchases_personal/search?kw=${kw}&t=${t}`
    table.bootstrapTable('refresh', { url: url, })
  }
})
function onSearch(text) {
  if (text) {
    let url = `/api/purchases_personal/search`
    table.bootstrapTable('refresh', { url: url, })
  }
}

运行结果及报错内容

数据库的单号格式是20220800001这样的，所以我在前端用20220800001/20220800002的格式向后端发送查询，数据能正常查在服务器查询到，但是无法在前端页面bootstrap-table中显示，提示没有查询到内容，所以感觉还是前端bootstrap-table的问题

我的解答思路和尝试过的方法

我尝试让后台自动推送了包含20220800001、20220800002两个单号的数据，在前端页面输入2022或202208这样共有的字符时，两个条数据都可以查询的到，但是输入20220800001则只能查询到20220800001这一条数据，我查看了下代码，bootstrap-table没有filterby的设置，只有refresh设置，所以不知道为啥会被筛选，而不是后台返回的数据直接全部体现在bootstrap-table上

我想要达到的结果

想要在前端如输入20220800001/20220800002后，后台查询的包含这两个单号的数据可以正常在bootstrap-table中显示出来
我是超级小小白，感谢各位可以给与指点~~

Answer 1

感谢各位，问题已经解决，是由于bootstraptable自带的data-searh输入框的问题，后台取到了这个输入框的内容，但这个输入框也自带了全文搜索功能，我通过隐藏了搜索框然后自己单独增加一个textarea文本框解决了这个问题

Answer 2

f12查看请求返回结果是否正确

Answer 3

根据你的语言逻辑没有看出什么问题，不过前端代码部分感觉不太对，我加了变量t const t = Date.now()

var table
var data
var codes = []
 
$(function () {
  moment.locale('zh-CN')
 
  let columns = []
  for (let i = 0; i < 11; i++) { columns.push({ formatter: formatter, }) }
 
  //初始化表格 
  table = $('#dataTable').bootstrapTable({
    buttonsOrder: ['refresh'],
    onSearch: onSearch,
    formatSearch: () => { return '测试 },
  })
  if (kw) {
    $('.search-input').val(kw)
    const t = Date.now()
    let url = `/api/purchases_personal/search?kw=${kw}&t=${t}`
    table.bootstrapTable('refresh', { url: url, })
  }
})
function onSearch(text) {
  if (text) {
    const kw = text
    const t = Date.now()
    let url = `/api/purchases_personal/search?kw=${kw}&t=${t}``
    table.bootstrapTable('refresh', { url: url, })
  }
}

Answer 4

不知道你这个问题是否已经解决, 如果还没有解决的话:

• 这篇博客也许可以解决你的问题👉 ：Bootstrap——table标签使用横向滚动条解决方案

如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^

Answer 5

兄弟，你这个问题，是不是出在分页上了。前端虽然没写什么过滤器，但是默认显示的分页不是第一页