Permalink
Browse files

added button text filter to the php version

  • Loading branch information...
1 parent f83aff0 commit 3632348617cc7485e7e37c828b3468aa12200441 @1rosehip committed Aug 30, 2016
@@ -0,0 +1,243 @@
+<!doctype html>
+<html>
+ <head>
+ <title>Button Text Filter | jPList - jQuery Data Grid Controls</title>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+
+ <!-- font libs -->
+ <link href="//fonts.googleapis.com/css?family=Lato" rel="stylesheet" type="text/css" />
+ <link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet" />
+
+ <!-- demo page styles -->
+ <link href="../../dist/css/jplist.demo-pages.min.css" rel="stylesheet" type="text/css" />
+
+ <!-- jQuery lib -->
+ <script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
+
+ <!-- jPList core js and css -->
+ <link href="../../dist/css/jplist.core.min.css" rel="stylesheet" type="text/css" />
+ <script src="../../dist/js/jplist.core-ajax.min.js"></script>
+
+ <!-- jplist toggle bundle -->
+ <script src="../../dist/js/jplist.filter-toggle-bundle.min.js"></script>
+ <link href="../../dist/css/jplist.filter-toggle-bundle.min.css" rel="stylesheet" type="text/css" />
+
+ <!-- preloader -->
+ <script src="../../dist/js/jplist.preloader-control.min.js"></script>
+ <link href="../../dist/css/jplist.preloader-control.min.css" rel="stylesheet" type="text/css" />
+
+ <!-- Handlebars Templates Library: //handlebarsjs.com -->
+ <script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/2.0.0-alpha.4/handlebars.min.js"></script>
+
+ <script>
+ $('document').ready(function () {
+
+ var $list = $('#demo .list')
+ , template = Handlebars.compile($('#jplist-template').html());
+
+ //init jplist with php + mysql data source, json and handlebars template
+ $('#demo').jplist({
+
+ itemsBox: '.list'
+ , itemPath: '.list-item'
+ , panelPath: '.jplist-panel'
+
+ //data source
+ , dataSource: {
+
+ type: 'server'
+ , server: {
+
+ //ajax settings
+ ajax: {
+ url: '../../server/server-json.php'
+ , dataType: 'json'
+ , type: 'POST'
+ }
+ }
+
+ //render function for json + templates like handlebars, xml + xslt etc.
+ , render: function (dataItem, statuses) {
+ $list.html(template(dataItem.content));
+ }
+ }
+
+ });
+ });
+ </script>
+
+ <!-- handlebars template -->
+ <script id="jplist-template" type="text/x-handlebars-template">
+ {{#each this}}
+
+ <div class="list-item box">
+ <div class="img left">
+ <img src="{{image}}" alt="" title=""/>
+ </div>
+
+ <div class="block right">
+ <p class="title">{{title}}</p>
+ <p class="desc">{{description}}</p>
+ <p class="like">{{likes}} Likes</p>
+ <p class="theme">{{keyword1}}, {{keyword2}}</p>
+ </div>
+ </div>
+
+ {{/each}}
+ </script>
+
+ </head>
+ <body>
+
+ <!-- top bar -->
+ <div id="black-top-bar" class="box">
+ <div class="center">
+ <div class="box">
+
+ <!-- left menu -->
+ <ul id="black-top-bar-left-menu" class="hmenu left iphone-hidden">
+ <li class="glow">
+ <a title="" href="//github.com/no81no/jplist/issues?state=open">
+ <i class="fa fa-asterisk"></i> Request a feature / <i class="fa fa-bug"></i> Report a bug
+ </a>
+ </li>
+ </ul>
+
+ <!-- social menu -->
+ <ul id="social-menu" class="hmenu right">
+ <li class="glow"><a title="" href="//www.facebook.com/jplist"><i class="fa fa-facebook"></i>&nbsp;</a></li>
+ <li class="glow"><a rel="publisher" title="" href="//plus.google.com/+Jplistjs"><i class="fa fa-google-plus"></i></a></li>
+ <li class="glow"><a title="" href="//twitter.com/jquery_jplist"><i class="fa fa-twitter"></i></a></li>
+ <li class="glow"><a title="" href="//github.com/no81no/jplist"><i class="fa fa-github"></i></a></li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <!-- header -->
+ <header id="header" class="box">
+ <div id="header-box" class="box">
+ <div class="center">
+ <div class="box">
+
+ <!-- logo -->
+ <div class="align-center text-shadow" id="logo">
+ <p>
+ <img title="jPList - jQuery Data Grid Controls" alt="jPList - jQuery Data Grid Controls" src="//jplist.com/content/img/common/rocket.png" />
+ <a title="" href="//jplist.com">jPList - jQuery Data Grid Controls</a>
+ </p>
+ <h1 class="h1-30-normal">PHP and MySQL with JSON and Handlebars Templates</h1>
+ </div>
+
+ </div>
+ </div>
+ </div>
+ </header>
+
+ <!-- main content -->
+ <div class="box">
+ <div class="center">
+ <!--<><><><><><><> DEMO START <><><><><><><><><>-->
+
+ <div id="demo" class="box jplist">
+
+ <!-- ios button: show/hide panel -->
+ <div class="jplist-ios-button">
+ <i class="fa fa-sort"></i>
+ jPList Actions
+ </div>
+
+ <!-- panel -->
+ <div class="jplist-panel box panel-top">
+
+ <!-- Button Text Filters Control -->
+ <div class="jplist-group">
+ <ul>
+ <li>
+ <span
+ data-control-type="button-text-filter"
+ data-control-action="filter"
+ data-control-name="architecture-btn"
+ data-path=".block"
+ data-text="architecture">
+ <i class="fa fa-caret-right"></i>
+ Architecture
+ </span>
+ </li>
+
+ <li>
+ <span
+ data-control-type="button-text-filter"
+ data-control-action="filter"
+ data-control-name="christmas-btn"
+ data-path=".block"
+ data-text="christmas">
+ <i class="fa fa-caret-right"></i>
+ Christmas
+ </span>
+ </li>
+
+ <li>
+ <span
+ data-control-type="button-text-filter"
+ data-control-action="filter"
+ data-control-name="nature-btn"
+ data-path=".block"
+ data-text="nature">
+ <i class="fa fa-caret-right"></i>
+ Nature
+ </span>
+ </li>
+
+ <li>
+ <span
+ data-control-type="button-text-filter"
+ data-control-action="filter"
+ data-control-name="lifestyle-btn"
+ data-path=".block"
+ data-text="lifestyle">
+ <i class="fa fa-caret-right"></i>
+ Lifestyle
+ </span>
+ </li>
+ </ul>
+ </div>
+
+ <!-- preloader for data sources -->
+ <div
+ class="jplist-hide-preloader jplist-preloader"
+ data-control-type="preloader"
+ data-control-name="preloader"
+ data-control-action="preloader">
+ <img src="../img/common/ajax-loader-line.gif" alt="Loading..." title="Loading..." />
+ </div>
+
+ </div>
+
+ <!-- ajax content here -->
+ <div class="list box text-shadow"></div>
+
+ <!-- no result found -->
+ <div class="box jplist-no-results text-shadow align-center jplist-hidden">
+ <p>No results found</p>
+ </div>
+
+ </div>
+
+ <!--<><><><><><><> DEMO END <><><><><><><><><>-->
+ </div>
+ </div>
+
+ <!-- footer -->
+ <footer class="box" id="footer">
+ <div class="center">
+ <div class="box">
+ <p id="footer-content" class="align-center glow">
+ <a href="//jplist.com" title="">Copyright &copy; <script>document.write(new Date().getFullYear())</script> <b>jPList Software</b></a>
+ </p>
+ </div>
+ </div>
+ </footer>
+ </body>
+</html>
@@ -0,0 +1,79 @@
+<?php
+
+ /**
+ * get button text filter control query
+ * @param {Object} $status
+ * @return {Object}
+ * status example
+ * {
+ * "action": "filter",
+ * "name": "lifestyle-btn",
+ * "type": "button-text-filter",
+ * "data": {
+ * "path": ".title",
+ * "ignore": "[~!@#$%^&*()+=`'\"/\\_]+",
+ * "value": "",
+ * "selected": true
+ * "mode": "contains"
+ * "filterType": "TextFilter"
+ * },
+ * "cookies": true
+ * }
+ */
+ function buttontextfilter($status){
+
+ $data = $status->data;
+ $result = null;
+
+ if($data->selected){
+
+ $result = new FilterResultCollection('or');
+ $fields = array('title', 'Description', 'Keyword1', 'Keyword2');
+
+ switch($data->mode){
+
+ case "startsWith":{
+
+ foreach ($fields as &$value) {
+
+ $model = new FilterResultModel();
+
+ $model->param = "%$data->value%"."%";
+ $model->query = " $value like ? ";
+ array_push($result->filterResults, $model);
+ }
+ break;
+ }
+
+ case "endsWith":{
+
+ foreach ($fields as &$value) {
+
+ $model = new FilterResultModel();
+
+ $model->param = "%"."%$data->value%";
+ $model->query = " $value like ? ";
+ array_push($result->filterResults, $model);
+ }
+
+ break;
+ }
+
+ default: {
+
+ foreach ($fields as &$value) {
+
+ $model = new FilterResultModel();
+
+ $model->param = "%$data->value%";
+ $model->query = " $value like ? ";
+ array_push($result->filterResults, $model);
+ }
+ }
+ }
+
+ }
+
+ return $result;
+ }
+?>
@@ -45,7 +45,9 @@ protected function getData(){
if($this->sorting->sortQuery){
$query .= " " . $this->sorting->sortQuery . " ";
}
-
+
+ //error_log(print_r($this->filter->filterQuery));
+
if($this->pagination->paginationQuery){
$query .= " " . $this->pagination->paginationQuery . " ";
}
@@ -21,6 +21,7 @@
require "controls/filterselect.php";
require "controls/range-slider.php";
require "controls/range-filter.php";
+ require "controls/button-text-filter.php";
class jPListHTML extends jPListServer{
@@ -19,6 +19,7 @@
require "controls/checkboxgroupfilter.php";
require "controls/filterdropdown.php";
require "controls/filterselect.php";
+ require "controls/button-text-filter.php";
class jPListJSON extends jPListServer{
@@ -19,6 +19,7 @@
require "controls/checkboxgroupfilter.php";
require "controls/filterdropdown.php";
require "controls/filterselect.php";
+ require "controls/button-text-filter.php";
class jPListXML extends jPListServer{

0 comments on commit 3632348

Please sign in to comment.