【PHP】fastadmin中获取选项卡的值

概要

在后台开发中，fastadmin支持tab选项卡的切换,这个切换通常可以将列表数据分门别类的显示，比较好用，但想在控制器中拿到它的值就没那么容易了。本文中将在关键js部分中添加一段代码，以达到控制器可以轻松获取tab的值的效果。

技术细节

第一步是在html页面中加入选项卡的代码:

   <div class="panel-heading">
        {:build_heading(null,FALSE)}
        <ul class="nav nav-tabs" data-field="status">
            <li class="{:$Think.get.status === null ? 'active' : ''}"><a href="#t-all" data-value="" data-toggle="tab">{:__('All')}</a></li>
            {foreach name="shopStatusList" item="vo"}
            <li class="{:$Think.get.status === (string)$key ? 'active' : ''}">
                <a href="#t-{$key}" data-value="{$key}" data-toggle="tab">{$vo}</a></li>
            {/foreach}
        </ul>
    </div>

第二步是在控制器中，定义声明shopStatusList集合:

    public function _initialize()
    {
        parent::_initialize();
        $this->model = new \app\admin\model\Shop;
        $this->view->assign("shopStatusList", $this->model->getShopStatusList());
    }

第三部是交代实体类中对应的方法定义:

   public function getShopStatusList()
    {
        return ['1' => __('正常'), '2' => __('已过期')];
    }

第四步是对关键js文件路径:public/assets/js/require-table.js (第288行左右) 进行拓展，也是本文的精华所在:

   // 绑定TAB事件
$('.panel-heading [data-field] a[data-toggle="tab"]', table.closest(".panel-intro")).on('shown.bs.tab', function (e) {
      var field = $(this).closest("[data-field]").data("field");
      var value = $(this).data("value");
      var object = $("[name='" + field + "']", table.closest(".bootstrap-table").find(".commonsearch-table"));
      if (object.prop('tagName') == "SELECT") {
          $("option[value='" + value + "']", object).prop("selected", true);
      } else {
          object.val(value);
      }
	//========拓展代码:获取url参数并加到URL参数中=========
      var tabStr = $(this).attr('href').replace('#', '');
      if(tabStr.startsWith('t-')) {
          tabStr = tabStr.substring(2);
      }
      var options = table.bootstrapTable('getOptions');
      options.pageNumber = 1;
      options.queryParams = function (params) {
          params.tab = tabStr;
          return params;
      };
//=======================
      table.trigger("uncheckbox");
      table.bootstrapTable('refresh', {pageNumber: 1});
      return false;
  });

第五步,编写php对于ajax的请求逻辑:

if ($this->request->isAjax()) {
    if ($this->request->request('keyField')) {
          return $this->selectpage();
      }
    // list($where, $sort, $order, $offset, $limit) = $this->buildparams();
      $filter = $this->request->get("filter", '');
      $filter = (array)json_decode($filter, true);
      //获取分页
      $offset = $this->request->get("offset", 0);
      $limit = $this->request->get("limit", 0);
	  //获取排序
      $sort = $this->request->get("sort", 'id');
      $order = $this->request->get("order", 'desc');

      $tab = $this->request->request("tab");//获取选项卡参数值

小结

最终效果：

这样就可以轻松拿到选项卡选中的值了，也可以在where语句中使用了。