Hidden Rules

README.md

@@ -10,34 +10,9 @@ jQuery plugin offering an simple interface to create complex queries.
 
 [![screenshot](https://raw.githubusercontent.com/mistic100/jQuery-QueryBuilder/master/examples/screenshot.png)](https://querybuilder.js.org)
 
-
-
 ## Documentation
 [querybuilder.js.org](https://querybuilder.js.org)
 
-
-
-## Install
-
-#### Manually
-
-[Download the latest release](https://github.com/mistic100/jQuery-QueryBuilder/releases)
-
-#### With Bower
-
-```bash
-$ bower install jQuery-QueryBuilder
-```
-
-#### With npm
-
-```bash
-$ npm install jQuery-QueryBuilder
-```
-
-#### Via CDN
-
-jQuery-QueryBuilder is available on [jsDelivr](https://www.jsdelivr.com/package/npm/jQuery-QueryBuilder).
 ### Dependencies
  * [jQuery 3](https://jquery.com)
  * [Bootstrap 3](https://getbootstrap.com/docs/3.3) (CSS only)
@@ -49,47 +24,30 @@ jQuery-QueryBuilder is available on [jsDelivr](https://www.jsdelivr.com/package/
 
 ($.extendext and doT.js are directly included in the [standalone](https://github.com/mistic100/jQuery-QueryBuilder/blob/master/dist/js/query-builder.standalone.js) file)
 
-### Browser support
- * Internet Explorer >= 9
- * All other recent browsers
-
-
-
-## Build
-
-#### Prerequisites
-
- * NodeJS + NPM: `apt-get install nodejs-legacy npm`
- * Grunt CLI: `npm install -g grunt-cli`
+### Run
 
-#### Run
+ * `npm install` to install Node dependencies .
+ * `npm run build` to build a standalone builder.
+ * `npm run serve` to open the example page with automatic build and livereload.
 
-Install Node dependencies `npm install` then run `grunt` in the root directory to generate production files inside `dist`.
+#### Options for show/hide feature
 
-#### Options
-
-You can choose which plugins to include with `--plugins` :
-```bash
-# include "sql-support" and "mongodb-support" plugins
-grunt --plugins=sql-support,mongodb-support
-
-# disable all plugins
-grunt --plugins=false
-```
-All plugins are included by default.
-
-You can also include language files with `--languages` :
+You can add feature show hide rule without missing rule in sql generate :
 ```bash
-# include French & Italian translation
-grunt --languages=fr,it
+# set "design_mode": true to declare design mode for QueryBuilder (we use it in design condition page)
+# set "design_mode": false to declare design mode for QueryBuilder (we use it in non design page)
+	var options = {
+    design_mode: true,
+	... }
+
+	$('#builder').queryBuilder(options);
 ```
 
-#### Other commands
-
- * `grunt test` to run jshint/jscs/scsslint and the QUnit test suite.
- * `grunt serve` to open the example page with automatic build and livereload.
- * `grunt doc` to generate the documentation.
+![](images/designmode.png)
+#Design page
 
+![](images/nondesignmode.png)
+#Non-Design page
 
 ## License
 This library is available under the MIT license.

examples/index.html

@@ -152,6 +152,7 @@ <h3>Output</h3>
   var $b = $('#builder');
 
   var options = {
+    design_mode: false,
     allow_empty: true,
 
     //default_filter: 'name',
@@ -393,7 +394,7 @@ <h3>Output</h3>
           step: 0.01
         },
         data: {
-          class: 'com.example.PriceTag'
+          show: true
         }
       },
       /*
@@ -548,56 +549,53 @@ <h3>Output</h3>
   // set rules
   $('.set').on('click', function() {
     $('#builder').queryBuilder('setRules', {
-      condition: 'AND',
-      flags: {
-        condition_readonly: true
+      'condition': 'AND',
+      'flags': {
+        'condition_readonly': true
       },
-      data: {
-        root: true
+      'data': {
+        'root': true
       },
-      rules: [{
-        id: 'price',
-        operator: 'between',
-        value: [10.25, 15.52],
-        flags: {
-          no_delete: true,
-          filter_readonly: true
-        },
-        data: {
-          unit: '€'
+      'flags': {
+        'condition_readonly': true
+      },
+      'not': false,
+      'valid': true,
+      "rules": [
+      {
+        "id": "name",
+        "field": "username",
+        "type": "string",
+        "input": "text",
+        "operator": "equal",
+        "value": "Quan",
+        "data": {
+          "show": true
         }
-      }, {
-        id: 'state',
-        operator: 'equal',
-        value: 'AK'
-      }, {
-        condition: 'OR',
-        not: true,
-        flags: {
-          no_delete: true,
-          no_drop: true,
-          no_sortable: true
-        },
-        rules: [{
-          id: 'category',
-          operator: 'equal',
-          value: 2
-        }, {
-          id: 'coord',
-          operator: 'equal',
-          value: undefined // will use filter's default value
-        }]
-      }, {
-        id: 'name',
-        operator: 'in',
-        value: ['Mistic', 'Damien']
-      }, {
-        id: 'age',
-        operator: 'in',
-        value: [20,21,22]
-      }, {
-        empty: true
-      }]
+      },
+      {
+        "id": "age",
+        "field": "age",
+        "type": "integer",
+        "input": "text",
+        "operator": "equal",
+        "value": 27,
+        "data": {
+          "show": true
+        }
+      },
+      {
+        "id": "continent",
+        "field": "continent",
+        "type": "string",
+        "input": "select",
+        "operator": "equal",
+        "value": "asia",
+        "data": {
+          "show": false
+        }
+      }
+    ]
     });
   });
 

package.json

@@ -10,6 +10,7 @@
   "main": "dist/js/query-builder.js",
   "dependencies": {
     "bootstrap": ">=3.1.0 <4",
+    "bootswatch": "^4.3.1",
     "dot": ">=1.0.3",
     "jquery": "^3.3.1",
     "jquery-extendext": ">=0.1.2",
@@ -21,7 +22,6 @@
     "bootbox": "^4.4.0",
     "bootstrap-select": "^1.12.4",
     "bootstrap-slider": "^10.0.0",
-    "bootswatch-dist": "git+https://github.com/dbtek/bootswatch-dist.git#slate",
     "chosenjs": "^1.4.3",
     "deepmerge": "^2.1.0",
     "foodoc": "^0.0.9",