jQuery-QueryBuilder Demo

Demonstrates select2 and bootstrap-selectpicker support and QueryBuilder invalidates issue #794 (https://github.com/mistic100/jQuery-QueryBuilder/issues/794)

by mjraval

HTML

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/query-builder.default.min.css">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/query-builder.standalone.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.7/css/select2.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.7/js/select2.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.13.10/css/bootstrap-select.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.13.10/js/bootstrap-select.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2-bootstrap-theme/0.1.0-beta.10/select2-bootstrap.min.css">
<p>
The pre selected value in Second rule must be 3MTO , the second option of dropdown. And the alert must return 1. look at line 326 in JS . Click on Set Rules, to test Again.
<br/>
<br/>
This is an issue, when setting rules form JSON. Othewise evertying works just fine.
</p>
<div id="queryBuilderUI">
  
</div>

<div class="btn-group">
      <button class="btn btn-warning" id="btn-reset">Reset</button>
      <button class="btn btn-success" id="btn-set">Set rules</button>
      <button class="btn btn-primary" id="btn-get">Get rules</button>
</div>

JavaScript

let brands = {
  '023dc07b-2aef-479e-8e5c-7029367d3ab8': 'OnePlus',
  '0a9cb28e-2cf9-4dfc-b85f-46fd6bfe2ca5': 'HTC',
  '10aeaef8-59b0-4178-a59b-41f0d5631ef9': 'Generic',
  '17e4c889-d295-4a35-bb74-7e2e22f9dadd': 'Packard Bell',
  '1ae3d2a7-4074-4fa0-b022-dd4ed4fe8d58': 'iPad Mini',
  '20d69055-1e9f-47c5-97b8-d888161760ed': 'Google',
  '2e7fe8cc-2ed8-4754-8987-fcbbe798516e': 'iPhone',
  '2f5b2543-3c88-40f4-946f-e8a485e08939': 'Beats',
  '3a3907e3-d9f1-4308-bf61-e495dbb5a01b': 'Bose',
  '3e575573-b741-4a16-ae0b-76722c4b576f': 'Gateway',
  '46dcdcb0-c6ff-4dc7-9d10-7813adbb35a2': 'Compaq',
  '4d997748-b4ca-4629-80f5-46d3c53ef8cf': 'iPad',
  '51f0aaec-9db3-4db8-90a4-5c3032d101b6': 'Blackberry',
  '64e89985-c9b2-44f8-9c17-b03201ef9282': 'Motorola',
  '682b1a8e-eee1-4218-846a-5721caa3599f': 'iPad Pro',
  '710bff77-50fa-44d3-9b00-1ef25a87f052': 'Monster',
  '727ebb70-6f6e-4b8c-a100-1ef69a1e0412': 'Macbook',
  '78374d62-2770-4955-91f3-03fbd99d6388': 'MSI',
  '7da067b2-7b6d-4e0d-b5c7-4de51bb54ee3': 'Generic',
  '852b5169-4e4e-4f39-84f4-9bd01709c3a3': 'Samsung',
  '898d772a-a8ce-46f7-b9c7-6307137f9c26': 'IBM',
  '8b450a6c-09a3-4d41-81c7-8a42716f918d': 'Nokia',
  '9a71589a-04fe-4c88-965d-86c09f90d08f': 'LG',
  '9abc5733-5286-4699-978f-8cdb799acf29': 'Microsoft',
  'a13f2e55-9333-47cf-b9b4-2b9eec30f6d3': 'Test Brand',
  'a3d8248e-0630-44b6-aca4-50af7f1bf0ed': 'Dell',
  'a4a92a9f-6d0a-4043-ba43-c559f5035107': 'ASUS',
  'b427d79e-0347-4b4f-89da-d1576c7d30a9': 'iPad Air',
  'b59a60af-3c1b-46ac-b9df-6e34bd1ea8a6': 'Acer',
  'b74564a3-9ea2-4efb-876e-35438e5ffadd': 'HP',
  'c547b82b-4561-4b3f-bf51-a1c1ece211ef': 'Xiaomi',
  'c68d1a43-c60c-4a19-b5c3-c6b154bb4931': 'Toshiba',
  'cd9970b4-9a35-4f46-9856-53f777371e41': 'Panasonic',
  'd3e172ba-8192-4253-adfd-c7cd670d5f5f': 'Huawei',
  'd42f173a-f516-4b91-b788-ff4322e4d1ca': 'Emachines',
  'da2474f8-50ee-49b0-8176-220642f26cad': 'Sony',
  'dca43bb4-4ead-45b4-8c86-d85e06397f8f': 'Fujitsu',
  'f1e081dd-86a1-41ea-bc88-cbb3912b2f48': 'Apple...