【问题标题】:All checkboxes are checked on page load in bootstrap-table在引导表中的页面加载时检查所有复选框
【发布时间】:2021-05-24 13:32:46
【问题描述】:

我正在使用引导表,数据正在从 URL 加载。在表中,我为 ID 列设置了复选框。我的问题是页面加载时所有复选框都被选中。我在这里找到了这个question,但它不能帮助我解决我的问题。

这是我的 JS:

var $_bsTable = $('#table')
$_bsTable.bootstrapTable({
  toggle: "table",
  url: "./includes/view_suppliers.inc.php",
  
  columns: [{
      field: 'sid',
      checkbox: true,
      printIgnore: true,
      //width: 64
    },
    {
      field: 'image',
      title: 'Image',
      sortable: false,
      align: 'center'
    },            
    {
      field: 'name',
      title: 'Supplier Name',
      sortable: true
    },
    {
      field: 'address',
      title: 'Address',
      sortable: true
    }
  ],

  icons: {
    columns: 'fa-th-list text-orange-d1',
    detailOpen: 'fa-plus text-blue',
    detailClose: 'fa-minus text-blue',
    export: 'fa-download text-blue',
    print: 'fa-print text-purple-d1',
    fullscreen: 'fa fa-expand',
    search: 'fa-search text-blue'
  },

  toolbar: "#table-toolbar",
  theadClasses: "bgc-white text-grey text-uppercase text-80",
  
  //clickToSelect: true,
  checkboxHeader: true,

  search: true,
  searchAlign: "left",
  //showSearchButton: true,
  sortable: true,
  //detailView: true,
  //detailFormatter: "detailFormatter",

  pagination: true,
  sidePagination: 'client',
  // serverSort: false,
  paginationLoop: false,

  showExport: true,
  showPrint: true,
  showColumns: true,
  showFullscreen: true,

  mobileResponsive: true,
  //checkOnInit: true,
})

希望有人可以帮助我。

【问题讨论】:

  • 您需要取消选中它们吗?
  • @Swati 是的,页面加载时未选中
  • 使用:$(".bs-checkbox input").prop("checked",false) 在初始化你的 boostrap 表之后。工作code
  • @Swati 是的,我使用的是 HTML 数据。但不是服务器端数据
  • @Swati 您可以通过将data-checkbox="true" 添加到id 列来检查此示例:https://live.bootstrap-table.com/example/welcomes/from-url.html。你可以在那里看到问题。

标签: javascript jquery bootstrap-table


【解决方案1】:

您是否可能为 HTML 中的复选框赋予了价值? 来自官方文档:

如果给定一个值,复选框会自动选中。也可以通过使用格式化程序来选中/取消选中复选框(返回 true 来选中,返回 false 来取消选中)。

这里你可以看到一个例子:https://examples.bootstrap-table.com/#column-options/checkbox.html

【讨论】:

  • 我没有为复选框创建任何 HTML。它由 JS 动态填充。这是我所有关于<table class="table " id="table"><!-- table --> </table>的HTML
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2011-03-08
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2020-08-27
相关资源
最近更新 更多