Yii gridview implements time period filtering function-PHP Tutorial-php.cn

Home

Backend Development

PHP Tutorial

Yii gridview implements time period filtering function

不言

May 03, 2018 pm 05:45 PM

ieperiod

This article mainly introduces in detail the time period filtering function of yii gridview, an input box, and automatic submission function. It has certain reference value. Interested friends can refer to it

yii Gridview is powerful, but time filtering is troublesome, and it is related to the storage format of the database. The time format in this article is date type

. Then the problem comes, Yii only provides text search format about time, that is, it can only find accurate The date is such as 2017-8-10. Almighty's customer said this won't work, I want to search for a time period! I just want an input box! I want to submit automatically!

Points to note:

1. First, introduce relevant js into the gridview to implement double dates. Here we chose jquery.daterangepicker.js , simple and generous (disadvantages: you cannot select the year, you need to click manually, I will not greatly span the years, it is available)

2. To process the data in the search model, perform time query

3. Pitfall: After selecting the date, the input box has no cursor, and you need to click twice and then press Enter to refresh the data, which is quite different from the original gridview experience.

4. Ladder: When the input date data is detected Finally, use jq to simulate the carriage return submission action, which perfectly realizes the original experience similar to gridview, silky smooth

view中

<?php

//use yii\web\View;
use kartik\grid\GridView;
use yii\bootstrap\Html;
use common\helps\ArrayHelper;
use yii\helpers\Url;

//引入时间段js，这里使用了jquery.daterangepicker.js
$this->registerCssFile(&#39;/plugins/datep/css/daterangepicker.css&#39;);
$this->registerJsFile(&#39;/plugins/datep/js/moment.min.js&#39;);
$this->registerJsFile(&#39;/plugins/datep/js/jquery.daterangepicker.js&#39;);
$this->registerJsFile(&#39;/plugins/datep/js/demo.js&#39;);
?>

<body class="gray-bg">
  <p class="wrapper wrapper-content animated fadeInRight">
    <p class="row">
      <p class="col-sm-12">
        <p class="ibox float-e-margins">
           <?= backend\widgets\TitleBack::widget([&#39;title&#39;=>&#39;记录管理&#39;]) ?>
           
          <p class="ibox-content">  
            
          <?php
                   
            echo GridView::widget([
                &#39;dataProvider&#39; => $dataProvider,
                &#39;filterModel&#39; => $searchModel,
     
                &#39;columns&#39; => [
                  
                  [&#39;class&#39; => &#39;yii\grid\SerialColumn&#39;],
                  [&#39;class&#39; => &#39;yii\grid\CheckboxColumn&#39;],
                  &#39;title&#39;,
                  
                  [
                    
　　　　　　　　　　　　　　　　　　　　　　　　&#39;label&#39;=>&#39;下发时间&#39;,
　　　　　　　　　　　　　　　　　　　　　　　　&#39;attribute&#39;=>&#39;issued&#39;,
                    　&#39;value&#39; => function ($data) {
                      return ArrayHelper::get_date_time($data->issued);
                    },                    
                  ],
                ]
             ]);
          
          ?>
            </p>
            </p>
          </p>
        </p>
      </p>

    </p>
  </p>
</body>

demo.js is put at the end, let’s talk about PatentDataBdSearch first. The data sent from the input box is processed, and the database is queried during the time period

//时间段筛选
    if($this->issued){
      $time= explode(&#39;~&#39;, $this->issued);
      $query->andFilterWhere([&#39;between&#39;, &#39;patent_data.issued&#39;, $time[0],$time[1]]); 
    }

demo.js Implements data detection and simulates the carriage return operation

$(function(){
  
  /*
  define a new language named "custom"  插件设置
  */

  $.dateRangePickerLanguages[&#39;custom&#39;] = 
  {
    &#39;selected&#39;: &#39;Choosed:&#39;,
    &#39;days&#39;: &#39;Days&#39;,
    &#39;apply&#39;: &#39;Close&#39;,
    &#39;week-1&#39; : &#39;Mon&#39;,
    &#39;week-2&#39; : &#39;Tue&#39;,
    &#39;week-3&#39; : &#39;Wed&#39;,
    &#39;week-4&#39; : &#39;Thu&#39;,
    &#39;week-5&#39; : &#39;Fri&#39;,
    &#39;week-6&#39; : &#39;Sat&#39;,
    &#39;week-7&#39; : &#39;Sun&#39;,
    &#39;month-name&#39;: [&#39;January&#39;,&#39;February&#39;,&#39;March&#39;,&#39;April&#39;,&#39;May&#39;,&#39;June&#39;,&#39;July&#39;,&#39;August&#39;,&#39;September&#39;,&#39;October&#39;,&#39;November&#39;,&#39;December&#39;],
    &#39;shortcuts&#39; : &#39;Shortcuts&#39;,
    &#39;past&#39;: &#39;Past&#39;,
    &#39;7days&#39; : &#39;7days&#39;,
    &#39;14days&#39; : &#39;14days&#39;,
    &#39;30days&#39; : &#39;30days&#39;,
    &#39;previous&#39; : &#39;Previous&#39;,
    &#39;prev-week&#39; : &#39;Week&#39;,
    &#39;prev-month&#39; : &#39;Month&#39;,
    &#39;prev-quarter&#39; : &#39;Quarter&#39;,
    &#39;prev-year&#39; : &#39;Year&#39;,
    &#39;less-than&#39; : &#39;Date range should longer than %d days&#39;,
    &#39;more-than&#39; : &#39;Date range should less than %d days&#39;,
    &#39;default-more&#39; : &#39;Please select a date range longer than %d days&#39;,
    &#39;default-less&#39; : &#39;Please select a date range less than %d days&#39;,
    &#39;default-range&#39; : &#39;Please select a date range between %d and %d days&#39;,
    &#39;default-default&#39;: &#39;This is costom language&#39;
  };
  
  
  //下面设置称自己的输入框选择器
  $("input[name=&#39;PatentDataBdSearch[issued]&#39;]").dateRangePicker(
  {
　　　　 //时间段的类型设置，这里是输入框时间段以~分隔，选择时间后自动消失弹出框
     separator : &#39; ~ &#39;,
     autoClose: true
  }).bind(&#39;datepicker-change&#39;,function(e,r)
  {
    try
    {
      console.log(r);
            //重要：如果检测有输入值了，就在输入框显示光标，或者模拟回车事件，自动提交，像gridview原生功能
　　　　　　　　　　　　　　//不添加下面的代码，将无法自动提交，
            var issued=$("input[name=&#39;PatentDataBdSearch[issued]&#39;]").val();
            console.log(issued);
            if(issued){
              //输入之后显示光标
              //$("input[name=&#39;PatentDataBdSearch[issued]&#39;]").focus();
　　　　　　　　　　　　　　　　//模拟回车操作，输入后自动提交，刷新数据,一定要设置时间计数器，否则将无法提交

              setTimeout(function(){
                e = jQuery.Event("keydown");
                e.keyCode = 13; //enter key
                jQuery("input[name=&#39;PatentDataBdSearch[issued]&#39;]").trigger(e);

              },100);
            }
    }catch(e){}
  });
});

Related recommendations:

Yii implements the method of adding default values to model

The above is the detailed content of Yii gridview implements time period filtering function. For more information, please follow other related articles on the PHP Chinese website!

Statement

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

发抖音的4个最佳时间段是什么时候？凌晨发抖音会被推荐吗？Mar 07, 2024 pm 02:00 PM

随着社交媒体的快速发展，抖音已经成为了许多人记录生活、分享创意和展示才华的热门平台。对于想要在抖音上获得更多曝光和粉丝的用户来说，选择合适的发布时间是至关重要的。毕竟，不同时间段的用户活跃度和关注度是有差异的。那么，发抖音的4个最佳时间段是什么时候呢？一、发抖音的4个最佳时间段是什么时候？在确定发布抖音视频的最佳时机时，需要综合考虑用户的在线时间和活跃度。通过分析统计数据和用户行为，可以确定四个最佳时间段，让您的视频在抖音上获得更多曝光和吸引更多粉丝。晚上8点至10点是许多人下班或放学后的宝贵休

Internet Explorer 打开 Edge：如何停止 MS Edge 重定向Apr 14, 2023 pm 06:13 PM

长期以来，InternetExplorer的失宠一直不是秘密，但随着Windows11的到来，现实开始了。Edge将来不再有时取代IE，它现在是微软最新操作系统中的默认浏览器。目前，您仍然可以在Windows11中启用InternetExplorer。但是，IE11（最新版本）已经有了一个正式的退役日期，即2022年6月15日，时间在流逝。考虑到这一点，您可能已经注意到InternetExplorer有时会打开Edge，而您可能不喜欢它。那么为什么会这样呢？在

win11无法使用ie11浏览器怎么办？(win11用不了ie浏览器)Feb 10, 2024 am 10:30 AM

越来越多的用户开始升级win11系统，由于每个用户的使用习惯不同，还是有不少用户在使用ie11浏览器，那么win11系统用不了ie浏览器，该怎么办呢？windows11还支持ie11吗？下面就来看看解决办法。win11无法使用ie11浏览器的解决方法1、首先右键开始菜单，选择“命令提示符（管理员）”打开。2、打开之后，直接输入“Netshwinsockreset”，回车确定。3、确定之后再输入“netshadvfirewallreset&rdqu

ie快捷方式无法删除如何解决Jan 29, 2024 pm 04:48 PM

ie快捷方式无法删除的解决办法：1、权限问题；2、快捷方式损坏；3、软件冲突；4、注册表问题；5、恶意软件；6、系统问题；7、重新安装IE；8、使用第三方工具；9、检查快捷方式的目标路径；10、考虑其他因素；11、咨询专业人士。详细介绍：1、权限问题，右键点击快捷方式，选择“属性”，在“安全”选项卡中，确保有足够的权限删除该快捷方式，如果没有，可以尝试以管理员身份运行等等。

Win10打开IE自动跳转到Edge怎么取消_IE浏览器页面自动跳转的解决办法Mar 20, 2024 pm 09:21 PM

近期不少的win10用户们在使用电脑浏览器的时候发现自己的ie浏览器总是自动的跳转到edge浏览器，那么win10打开ie自动跳转edge怎么关闭?。下面就让本站来为用户们来仔细的介绍一下win10打开ie自动跳转edge关闭方法吧。1、我们登录edge浏览器，点击右上角...，找下拉的设置选项。2、我们进入设置后，在左侧栏点击默认浏览器。3、最后我们在兼容性中，勾选不允许IE模式下重新加载网站，重启ie浏览器即可。

一个时代的结束：Internet Explorer 11 已退役，这是你需要知道的Apr 20, 2023 pm 06:52 PM

2022年6月15日是Microsoft结束对InternetExplorer11(IE11)的支持并关闭其旧版浏览器章节的日子。一段时间以来，该公司一直在提醒用户注意这一生命周期结束日期，并呼吁他们计划迁移到MicrosoftEdge。Microsoft将IE11与Windows8.1捆绑在一起，作为Windows的现代默认Web浏览器。尽管它从未达到Chrome的（当前）高度，但它是2014年使用量第二大的桌面浏览器，仅次于IE8。当然，随着20

如何启用IE的加速功能Jan 30, 2024 am 08:48 AM

ie加速功能怎么开？ie打开网页的速度太慢，我们可以在里面开启硬件加速模式。很多小伙伴反应说在使用ie浏览器的时候，打开网页的速度特别的慢，这样对我们浏览网页也造成了一定影响。就想询问小编有什么解决办法，这种情况是可以开启ie浏览器的硬件加速模式，小编下面整理了ie开启加速功能方法，感兴趣的话一起往下看看！ie开启加速功能方法打开IE安全浏览器，点击右上角齿轮状的“设置”图标，选择“Internet选项”进入，如图所示。2、在Internet选项的窗口头部的标签导航中点击“高级”，如图所示。3、

win10家庭版IE浏览器突然打不开了Jan 18, 2024 pm 02:57 PM

或许有部分朋友日常工作或因个人需求而深谙于使用InternetExplorer(IE)浏览器。然而，在Windows系统版本升级至Windows10之后，他们可能会不期然遭遇IE无法正常运行之烦扰。在此种情况下，可以尝试依据Microsoft官方网站所提供的"帮助与支持中心"中的解决方案，来设法排除此问题。win10家庭版IE浏览器突然打不开了1、打开Internet选项，然后切换到连接2、再点击下面的局域网设置3、然后把这里的选项都取消勾选4、然后以管理员身份运行cmd，再输入netsh回车5

See all articles

Hot AI Tools

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress images for free

Clothoff.io

AI clothes remover

AI Hentai Generator

Generate AI Hentai for free.

Hot Article

R.E.P.O. Energy Crystals Explained and What They Do (Yellow Crystal)

2 weeks agoBy尊渡假赌尊渡假赌尊渡假赌

How Long Does It Take To Beat Split Fiction?

1 months agoByDDD

R.E.P.O. Best Graphic Settings

2 weeks agoBy尊渡假赌尊渡假赌尊渡假赌

Assassin's Creed Shadows: Seashell Riddle Solution

1 weeks agoByDDD

R.E.P.O. How to Fix Audio if You Can't Hear Anyone

2 weeks agoBy尊渡假赌尊渡假赌尊渡假赌

Hot Tools

MinGW - Minimalist GNU for Windows

This project is in the process of being migrated to osdn.net/projects/mingw, you can continue to follow us there. MinGW: A native Windows port of the GNU Compiler Collection (GCC), freely distributable import libraries and header files for building native Windows applications; includes extensions to the MSVC runtime to support C99 functionality. All MinGW software can run on 64-bit Windows platforms.

DVWA

Damn Vulnerable Web App (DVWA) is a PHP/MySQL web application that is very vulnerable. Its main goals are to be an aid for security professionals to test their skills and tools in a legal environment, to help web developers better understand the process of securing web applications, and to help teachers/students teach/learn in a classroom environment Web application security. The goal of DVWA is to practice some of the most common web vulnerabilities through a simple and straightforward interface, with varying degrees of difficulty. Please note that this software