zoukankan      html  css  js  c++  java
  • bootstrap-table设置select过滤器值(filterData)

    filterControl设置select(选择控件),默认是数据当前不重复,但如果是分页或者筛选数据时,select的数据就不完整

    filterData

    bootstrap-table官网上有三种方法设置select过滤器的值,用于var:variable从变量url:http://www.example.com/data.json加载或从远程json文件json:{key:data}加载或从json字符串加载。

    1、var格式

    <th data-field="grade" data-sortable="true" data-filter-control="select" data-filter-data="var:grade">評級</th>
    var grade = {
        "A": "A",
        "A+": "A+",
        "B": "B",
        "B+": "B+",
        "C": "C",
    };

    2、URL格式(不推荐)

    控制器格式键值对,否则url就获取不到

        public function options()
        {
            $list = User::order("name asc")->column('name', 'uid');return json($list);
        }

    HTML:

    <th data-field="users" data-filter-control="select" data-filter-data="url:http://localhost:8080/index/users/options">用户</th>

    注:如果网络有延迟,不推荐使用url

    3、json格式

    控制器:

    public function getImmigrant()
    {
        $where2 = [
            ["module_name", '=', 'customer'],
            ["type_id", '=', 'immigrant'],
        ];
        $immigrant = Mapping::where($where2)->column("name", "name");
        View::assign([
            'getImmigrant'=>$immigrant
        ]);
        return View::fetch('index');
    }

    JS:

    var getImmigrant = {:json_encode($getImmigrant)};
    
    
    {
        field: 'immigrant',
        title: '移民國家',
        filterControl: 'select',
        filterData:"json:"+JSON.stringify(getImmigrant)
    }

    注:getImmigrant要经过转码,因为直接输出json和数组会报错

    官网文档:https://www.bootstrap-table.com.cn/examples/methods/get-all-selections/

  • 相关阅读:
    事物的五种配置方式(转载)
    Spring入门
    leetcode刷题3
    LeetCode刷题2
    LeetCode刷题1
    bootstraptable使用总结之前端样式设计
    初识Handsontable
    Java之file类
    OpenCV学习系列教程第五篇:测试和提高代码的效率
    OpenCV学习系列教程第四篇:图像的算术操作
  • 原文地址:https://www.cnblogs.com/bushui/p/13591003.html
Copyright © 2011-2022 走看看