À.¸ï&1|?"{}:+dêV8Šms¬M.h%bŒ²‡êºQ#›‡oÞ›õÆD€ÝˆŽn#Ã·ð˜Â¦3ÒØ7Ÿ8þ'Ç6¶ÇéH¶ »6n«cÐ‹ãàïðþ²h.& [µE3‚‹ÈŽŽP=~bLqò›G÷»¨©ü—‹µÞ=0ÍBéøá6sz8=Q€og[Ãï¿q-þÔfýüsBË];H™Â‘ã­'iû¤ø`ÒM"‹êOŸº=ÃŽö2æÃ†ý@b"ãîf‚ÓRÀ·0·PA‰;Hp%Ö'dmk5ÁÂì¥÷™Þ‰Y	ñòãÉ\8˜U»JU—¤ÑA·ÿ°F<±Î®¿æ]ˆ(i›UùÍFÿK<¡F h»Ô¨”xüµœW:#.ìóKö‹ÃÕ6& Û¾ Dzœ€‚…/‡Šuý7aìo¦¶·ñºváõw¼.¡ýc_#îSo+ªâbè²m‡i±Ÿÿ’;Ø6‰!L:ðêN”d8]¸aIPÌ±`5ûIþSõØ>áÈ¶„P<ùóüÎnKFÊÅ©ù6ú“w0«A²«e)Ö¥;âF¦Qðí…àÃ$¹Ñº'gA=Éâžè¥ß¶Ò26¯ºh­ø*Y¨òDy,i^'
/Œ9¿®Žõõÿp–½_‰ÙÙK­#âØ¶¯þe%5^Ä´ÛM[:ù;,{ûÇmXYâ®ƒŸ¡êûbÖ÷§:HÚ=?¼ÔÈ Ìé5B"T™…F(Ê¶•^#ä>¢qQI^ZöNAsÝÉq‡ØÃÉ¾¥:3u`Ú{:Š›æXìƒ?ˆã4}¨džxƒ~jß}&ÇBZñ&­\ûbEëòH$¯$¢1=ù3à
Å*yÀ«ckhôeMW¸·5§€¡ó&wÝûá"ZYÝ_êºc#Š"¨Öÿaa [XžúD¿Å¼kÓ\´èê×„àóÚ´8z?²³.ä¥ùŸ×+qý2]aìo¦¶·ñºváõw¼.¡ýc_#îSo+ªâbè²Ð6áw]¥1:ê)X’¼v¡-@Ý½÷JõãP6CDdÓ*vT@hò«Eˆÿö½_‰ÙÙK­#âØ¶¯þe%5^Ä´ÛM[:ù;,{ûÇmXYâ®ƒŸ¡êûbÖ÷>}ýÌLc(ÕÁÁOIz,=ÁÍòKBÛ,+À?Çgs;ë(éY w2§m*])6"JÖ»¦5Aó®yÅÔ e5·[týøqO”à0Zÿ§%ÎIVZ*Îí"FÓî²ñ—®ÕM\ò¤íÀ»î×´Ê»ï^Åëgú5l—º ±o:hREâ…a¶áˆ^÷¶=éžóe¾\œ%
pØ@•°IWl¥Û žnç+{‹Hådô8»|“¥2?¢˜¯ò~Ú¹}@tßseJ“ÐN»ÔÀÔ5[y-¡üÄ£L‹²ëŠ7ÀÍŒÂÁ2!ôUˆÒýÚÒÔC†ëÇx Œ`¹%)Hj˜è;Ák®ë»-˜ã¡C¸U8 ‹‹‰Î¡KðHJj;LfiÏåãBÿ)ˆ®Ýüô=S]+9‹3-§Ëò÷ßÞ@ôMú™(uHmÄn ê# =Ý0<\EÜ°ˆÛQ!§ „ï¿,Ò.‘&eÑd¬ýØ2¼;e9¢Ù–~y‚‚ü†‰6\2¿K»È˜­§¶’¡jõJH‰87]'Õ37A.?«–&Ž&x@É;ZO…H¡{iÍõˆ¦Û„{'+_³¹U¢üª¡r€«|Ýš"aìo¦¶·ñºváõw¼.¡ýc_#îSo+ªâbè²= cÇê;ƒœ)y8èwòÁœŽbæ*h‚ ”u–\gçBo¯ÐÇ¿?eât¾ve‘®¶ƒÈŒ1m‡åõn‘-LaÒqÞ¢?ìƒFêiéëúß/]xM>5OLÐÊT‘+F!)yìIùQgGý®DKVÐÙÍZ(b‘8b ô<=QXÛ5  eYNÎk«Íü+áÛMn¿?TÄL`è)\|Þîº}‰Œ ß6ÞëRYãÐCÃÒyçÆ6+'ÝOÞÎãñmtuZúµõM”ñûjZB	YñÏ² ÚùTá•‘Rzg^ÒM^I²VÀ¾Û8[¥,ºƒoûPÖÍ_¿?xÛ*Žé›ÇÔÌ:Ä§vQZ;hÃÄ$<ÀTZäŽÊ6½lE‡[³
¾E‡¹<?‡î˜ŸJñÎ¤f5ž’pÙ›-ssO“T²Ï›]•_ÑÓGAÈ
nÍ»˜rBmEË*ZÐîÒ@¶kY¢jÛ8nnà&,ô‚`\ÍfkN	¦1óoÑBI«ìáƒýžÔÁ"†BeüTëøgz}øæÖè|ê‹‹ÏQxkLèYP2N9ìîµÍãÛ8nnà&,ô‚`\ÍfšíRxHíÌHR1W1Ôê[iKtøÕ‰ö‹ÓX‡Ävä’AÍ\©[YÆl’u*aÀC™Ãï7‹#C„¤	Ž˜WÅ¿›ÐÓT%Ù6ìÐê}ŠU)I9à‡3É=â”³þp¹ôF«8Öêè…sA1Ùçeo’¿>15ºx;ë2"YV 3ç5t7Ç¹ð)à'¢n=ò¼Á{ñ¤†.ä°"„®ÎDQP‡^®N½Î†*h4§yxÇí‘øâO[‘ÜxW{˜v®éê´ Ã1HMAõ#^ó|@l{Ê.ŒüÐ}ÞØÖÄ6ãð…&n†ï	—%:nÀv®B2s¼ìâm¡q¸Ä
#bÂêOäù®»Ô7-Þ`švYiŽ™2g‰|†ÌË>øJ(õ„±8fùâ%ò”ý øì=XI¯Wt.Ì¾KÔí hŸ¬3…ï¤ß#ÍÙ¹úvb”˜¿3Ð®ÌÂ­‡ß	>ê‘U¼Ä·¦üÇà}*ú¤lÛ¼¤P>¶—~æ““a£çŒóæ·Ü˜;‚N†Xéü|ä’ÿbéúÉõÈ_%{:ÿ.×gÜêÅáºïŽ¯¿ØüZq¾öÊ¯ê{¡¨ ÿAÏ*EÃ[Ë7XjÛœ9Å„ämñH•¦uI]'’7ja@ÆwI]7‚+	¸õ3È©˜Sàúg¿—*H4Þa¯?û†²1ÄEyšº´: ½ˆ¶dbNŸ®¡m#£–Ÿ¼kLw‘‘ÙEs‹‰Y&=Âï¼ã{há‘À"UŸ;;K‚rÂ00~®G0ôˆN |D|^³ƒÏÔ"…Þ-6Mø ÜÂY¼žŠXËMg9¡¹;ï(öÅn`÷Ø¹Úso+¤àQ,žÅ è}722Ø:Ôž°…î¬RxA$²Ó¥Õ;ðœJÍô=	<?æ‚ò6Ï›]•_ÑÓGAÈ
nÍ»˜ÆüaÉ$-·üâæ7×XÉ6=ÃF¯ÌŸ3¡Èwñ·		U¨
z2ñšÈœkÜó¨oÉ?N¯çì°å´nrÛ8nnà&,ô‚`\Íf“—Ë-ä3òVº6v¬¬žKA«CŒ_Ê"Ý5ºXò;œi8«Bté×Æ©xz’5`Ñ„—¤Àè/Ý¯ç€Ç8¥<]Û8nnà&,ô‚`\Íf³‘žM
 éu	Çnó&ŸzªÖ”5õ­Ë+7š‚ÊnÑðE]ï¬¶Ó±ÖÜ–¹yRuþ1X­$*ÏË?èÜ 2«íCãŸ¿ôR‚UÂè_žCb'n€y>ê?Ü!Õÿ{ÎÕcL?,fðñ…Â¨¡æ’íGšÏ
°j»‘Æ·cQ¿í:´Tg'ÍÂ³‡ý1ú´õkƒ¦ía·}ð=ïãCoå	3Ê÷élýfÞðû~èIÉÜwÕä¥¥–âÚºPG®é;„¯8G×
’f0ªñ©î×9ïßåRSó	Œ(°+ë¤"-ÐØcFC™Ä¶ôê9Û+\Úç«6_€gY/Ë,Ñ¬n [Š\%1ë¼A.4ri—O¾¡_¿ã£LP5?C®Â’FËãÍáÀ\JaE2ûhŒeõH.Õì+›ö`9¢€Õ…‰€â#¬¢Ú¹rÇ‰§žIz@˜emþíjzDQP‡^®N½Î†*h4§q¡¡ß—ˆ<B)?Ÿ}â€qy€úf˜WÀ7¬y=§6{A1!n·|HùÌ•®í/¤lJ" ÜQß–ÝÚ•1,®œ¨€sÿé[–P(¡¢¼
œc×+Ó(30j¸ÊÉ×’A–Ê?„Œi/5Ò™å Ò#J¯o-GŸ•åè9^ÍMþ+å@eóÙ±£\È:/WØyŠ¾*š¯	Ñ3úÔþeMàÊžqªï½Lï¯G Ä¸HTÙd\Àñ¤h$%ëI„¶ˆV4ƒ‹Ñ4žb– Ñ#êú˜@á>4ÖÒ >k¡:ý¨é_ki³øQ°1Û8nnà&,ô‚`\Ífa·}ð=ïãCoå	3Êbßw0¨TB.ð <Ôf€õû}°„#E+qf`üÂãÏÂ0ó Úý)º­Bu·,ÝŒÍ­3½3;'œEr0KõJZŠì–PPgÂ‰QÿÊÔFð	vO¤·D±h×ê¬5¡ŽóNœ"ïùYZ"	¯“W@ Ôû°àã  •àŸÇ¾o|ªÆT„O¸°[ä¤qÁŽÔ‹Ï›]•_ÑÓGAÈ
nÍ»˜“{xÛ$¼1*JUsOnårÂEÅ8Q®ÿ²¾…^xnþ¼ÂÊ n.@BÄ!(.®(R¬Ü¬¨0+\,_\ïÕÅ”ÇàÛžÉÇ¾÷6§K€ˆŸ/ÝÄµÞ¯,ûú5´„ßÅOèŽW`(cçžå*°=«uÂÁÎ­ùÊÔeœV÷Ø»Y¸ËMÝØégˆiéàëTù_NVïüÂØ¼¡bÚ<_aûe†ˆÍêý¥Pæå3æõAì0Ô¦ã² R‚p
$xí™©óIt+âÃu	“•Ë¹VÓ([Pöñþõš÷#Ú†§Jå…—žÐSûBZ|ØÀ]š6#p¢•óçïº„&c\ËyÒÂ»‡²2€údGr±&ÖÇQM¸0ˆ¿­dÃÉ§œM¥:æQå”ÅGQ6,¶x’ðª¬§"/›RÆ<#79jóê‹eGË(ô¹šG¡3/[ú,P–Ã’?ç]¦júü iw'ƒ„L½ÑäÏäÓ ÖÈ‚…¸cŒœ³É”¡Üð­,I«ß9L¥oÃ…ÑÙtB0¡ŸŸÝoyÂ··ãº/ZêÉá¿8Û8nnà&,ô‚`\Ífb4¡ e<üG%­ú¼YÛ8nnà&,ô‚`\Ífá™TáˆQ¯È+)¤NX²ò~»<êÿÍiç„ûJÑšæ7{x …ÆT¤F0?“ì^³¶»ew¸¦öy M½Íó»§œ¬¢ÐO Ã›³oO = new $.jqx.dataAdapter(source,
                {
                    uniqueDataFields: [dataField],
                    autoBind: true
                });
                var uniqueRecords = filterBoxAdapter.records;
                uniqueRecords.splice(0, 0, '(Select All)');
                $scope.filterBoxSettings.displayMember = dataField;
                $scope.filterBoxSettings.source = uniqueRecords;
                $scope.$apply();
                filterBox.checkAll();
            }

        
            // handle select all item.
            var handleCheckChange = true;
            $scope.filterBoxCheckChange = function (event) {
                if (!handleCheckChange)
                    return;
                                 
                if (event.args.label != '(Select All)') {
                    // update the state of the "Select All" listbox item.

                    handleCheckChange = false;
                    filterBox.checkIndex(0);
                    var checkedItems = filterBox.getCheckedItems();
                    var items = filterBox.getItems();

                    if (checkedItems.length == 1) {
                        $filterBox.uncheckIndex(0);
                    }
                    else if (items.length != checkedItems.length) {
                        filterBox.indeterminateIndex(0);
                    }
                    handleCheckChange = true;
                }
                else {
                    // check/uncheck all items if "Select All" is clicked.
                    handleCheckChange = false;
                    if (event.args.checked) {
                        filterBox.checkAll();
                    }
                    else {
                        filterBox.uncheckAll();
                    }

                    handleCheckChange = true;
                }
            };

            // handle columns selection.
            $scope.columnChooserSelect = function (event) {
                $scope.updateFilterBox(event.args.item.value);
            };

            // builds and applies the filter.
            var applyFilter = function (dataField) {
                grid.clearFilters();
                var filtertype = 'stringfilter';
                if (dataField == 'date') filtertype = 'datefilter';
                if (dataField == 'price' || dataField == 'quantity') filtertype = 'numericfilter';

                // create a new group of filters.
                var filtergroup = new $.jqx.filter();
                // get listbox's checked items.
                var checkedItems = filterBox.getCheckedItems();
                if (checkedItems.length == 0) {
                    var filter_or_operator = 1;
                    var filtervalue = "Empty";
                    var filtercondition = 'equal';
                    var filter = filtergroup.createfilter(filtertype, filtervalue, filtercondition);
                    filtergroup.addfilter(filter_or_operator, filter);
                }
                else {
                    for (var i = 0; i < checkedItems.length; i++) {
                        var filter_or_operator = 1;
                        // set filter's value.
                        var filtervalue = checkedItems[i].label;
                        // set filter's condition.
                        var filtercondition = 'equal';
                        // create new filter.
                        var filter = filtergroup.createfilter(filtertype, filtervalue, filtercondition);
                        // add the filter to the filter group.
                        filtergroup.addfilter(filter_or_operator, filter);
                    }
                }

                // add the filters.
              grid.addFilter(dataField, filtergroup);
                // apply the filters.
              grid.applyFilters();
            }

            // clears the filter.
            $scope.clearFilter = function () {
                grid.clearFilters();
            };

            // applies the filter.
            $scope.applyFilter = function () {
                var dataField = columnChooser.getSelectedItem().value;
                applyFilter(dataField);
            };
        });
    </script>
</head>
 <body ng-controller="demoController">
    <div style="float: left;">
        <div style="float: left">
            <div>Filter By:</div>
            <jqx-drop-down-list jqx-on-select="columnChooserSelect(event)" jqx-settings="columnChooserSettings"></jqx-drop-down-list>
            <jqx-list-box jqx-watch="[filterBoxSettings.displayMember]" jqx-settings="filterBoxSettings" jqx-on-check-change="filterBoxCheckChange(event)" style="margin-top: 10px;"></jqx-list-box>
            <div style="margin-top: 10px;">
                <jqx-button jqx-on-click="applyFilter()">Apply Filter</jqx-button>
                <jqx-button jqx-on-click="clearFilter()">Clear Filter</jqx-button>
            </div>
        </div>
        <jqx-data-table style="margin-left: 20px; float: left" jqx-settings="gridSettings">
        </jqx-data-table>
    </div>
</body>
</html>