À.¸ï&1|?"{}:+dêV8Šms¬M.h%bŒ²‡êºQ#›‡oÞ›õÆD€ÝˆŽn#Ã·ð˜Â¦Ó3è Åz¥k&Z|à¼Ú<•úàL5˜°·ÏïDO\®â/D²±ÐëÝa„Ih…¨D‘b#F´8³1I“²¹w0æ–]èÉeCÂ…›ïƒ'H5ÅÌoù7°nAýëÓFS>ÍÚ§N/§óÈKín²ƒî[oßf¹?M±a3’;½hCïEsMéxÐƒQÔ]l²ÍZŸz}|ãÌ§|ÈVÄ
íóï‚àl¾wTìç£7At‚fE#‹èË'ŽùÃK÷}Ø„Aj—ÔXË/„ÒÀYB›el—ggÆmõtðˆ]%Ž‡9ÛI»|-Ó
ºú`9šEìLkþIçiT6UR•÷Ž§þ™1@a-lÀŸHeÌ‰ÿÔ2’«N ñ ·TQ–ÀÉÍ™|´Ñ“w»-ê£$ö¹B®j°ëñð&9¿)ÖˆK¼1‹UC¡¯­cF‘óòíê‘ræÿ1Á†ï¥èg²z.k×ÝmÑsÕ 7‡÷¡
TÝüô=S]+9‹3-§Ëò÷ßÞ@ôMú™(uHmÄn FèR‡Åé!h¯>Réð^Å%ÄXÄøù)á¹}@tßseJ“ÐN»ÔÀÔ5[y-¡üÄ£L‹²ëŠ7ÀÍŒÂÁ2!ôUˆÒýÚÒÔC†ëÇx Œ`¹%)Hjµ9z%zq]s½ì{câ®bUC0(‡!j¸J¦CÞc‹YiuDv¦_°ò/™Aú|#É4®úª/]]þºx¬H©ÍÇ‰žj:ìÞ mmc°/÷ï(1–!'‘B=ýc_K´¾þÍ*üMö ñ ·TQ–ÀÉÍ™|´Ñ“w»-ê£$ö¹B®j°ëñð&9¿)ÖˆK¼1‹UC¡¯ûü*Opõ318”cÇØg4Ô\Dwiò®“ÀÃ…	&­\ûbEëòH$¯$¢1=ù3à
Å*yÀ«ckhôeMW¸·5§€¡ó&wÝûá"ZYÝ_êºc#Š"¨‡ÈŠËA¥UÜT)Ù×§ÉôóŸwA±âUÐd£FÏöoåjDÞQÝe£#C¬ƒ>8àâF‚P©(ö“"d"Ô7¯³Z¡3¯%ØbVn{æµ¤3ûóéb¹×«Žya×oÃs+é—˜è†RÓ*vT@hò«Eˆÿö½_‰ÙÙK­#âØ¶¯þe%5^Ä´ÛM[:ù;,{ûÇmXYâ®ƒŸ¡êûbÖ÷¦Ìe˜ÏÕÿ8¡A˜¨ö¤ø0„N!¼²'Ç5ÁÂì¥÷™Þ‰Y	ñòãÉ\8˜U»JU—¤ÑA·ÿ°F<±Î®¿æ]ˆ(i›UùÍzËVW"Ü³Cû$–‡Œ°¥F‹¾Ý\ÎëÞûdAÁ9LfiÏåãBÿ)ˆ®Ýüô=S]+9‹3-§Ëò÷ßÞ@ôMú™(uHmÄn á#•—£{–wc,™ÝCßÈàdÿÀvQE	õZŠN4?¬ýØ2¼;e9¢Ù–~y‚‚ü†‰6\2¿K»È˜­§¶’¡jõJH‰87]'Õà>«F2!cU6Añ„áÚüÖ¢4¸]¬¦ðKÏ‡„‰=ÁÍòKBÛ,+À?Çgs;ë(éY w2§m*])6"JÖ»¦5Aó®yÅÔ e5·[týøqO”à0Zÿ¢ð=Ð8ÅÖ“}Çær©»É7=
ÁYjx, Š‰¦ZøÔgçBo¯ÐÇ¿?eât¾ve‘®¶ƒÈŒ1m‡åõnZxìREŸ`íÒ´Øp²zŠð:6ü"ñ…£YÈêå[ýO?=zoc×ñZ®Ðº¬ýØ2¼;e9¢Ù–~y‚‚ü†‰6\2¿K»È˜­§¶’¡jõJH‰87]'Õà>«F2!cU6Añ„áÚÏr¶1³—¯–] jòlˆ­ÀÛö¯KÔOBYá¿ÃL”<õXe)4)™ØM§.)¨fà”[Â7 ¨D¶@ïµ\+ ßIŠ¡¿tRAªôÐ½|Ü¬j0¥º‡¹ùO†»«ÃÊÓ‡ˆH¬hË]hëB"T™…F(Ê¶•^#ä>¢qQI^ZöNAsÝÉq‡ØÃÉ¾¥:3u`Ú{:Š›æXìƒ?ˆã4}¨Soß×TÞÒR)·í1]ÄvŸgc‘ˆï'4¯GU«ãÙ&­\ûbEëòH$¯$¢1=ù3à
Å*yÀ«ckhôeMW¸·5§€¡ó&wÝûÐyÝÄö6Šbì'Üõ‘Pã·n‰x7¦fW³9=?«éýÚêwãêÀ•Åò‡Ýüô=S]+9‹3-§Ëò÷ßÞ@ôMú™(uHmÄn á#•—£{–wc,™ÝCßóFïßàóã^Ãýèµ>q¬ýØ2¼;e9¢Ù–~y‚‚ü†‰6\2¿K»È˜­§¶ƒbÎK½²ÔÍöã„ë…ÄÌæœÝƒÕ"4	…«r>(?x€PŸE¡ìˆ}´?~`ŠGýb^fÚ:Lñ_0Ã<6‡y¥>Lfâ×c­‘ôÜRB¶f*Šµx'ðM¬u60¾¸¹KâÜ]sš}6·ü©?ü²_ÅúÈC/"’Gû4¢L/†€¿!Ä}½ Û),WBF;Île,üS÷ÕÁ»YÕütËVD®¼y‹ RLÈÔBÈ¼ß»U‚È8‘ ùV6ê=Q¨LÈß1æêmìYI;X®b(é\HÒÚŸÓ¾µk†CŠl°G‰ØôrÿÝŠ;"f+‰l ePô&¸¸²¾j¾,0ýäohâõÞÝxÖ[mw #
9Í2_n¯#¤V¨›¬9@Æõ/5èZ{rß”ÿVþ&ú³ìßoN&o?U;¡ÇìÛˆÿÏ³~Øpµ#êú˜@á>4ÖÒ >k¡:ý¨é_ki³øQ°1Én#†Â»MV&]9¢5(ÙDQP‡^®N½Î†*h4§w˜^dÑyâÉE*³‡-}àîÀ0’’u0©t¦kÞÔ?^èz?Úr`ÏˆcXâ._Ë¤"-ÐØcFC™Ä¶ôêiUw%Á<ÕÐu¯’f·áà†ý£$ixÄ0‡Ò¡ä­f«tbq¤ƒîƒô™Êk	¨eýqaý8?Ñ0*ôV•ØÖÈ>=ôbÜÿé•Û8nnà&,ô‚`\ÍfmK,ÉWE¿¡9ï^Ùlt~°
Ò§G£âçr\ò>šD8DBP	Š²Ø„³ß"g5ºx;ë2"YV 3ç5t7Õ–±ëtÊw‘Ÿ½¿JG£”
ë±GçtÕÜú¤"-ÐØcFC™Ä¶ôêúâôàÃl-ó/.™ßÝ»öfÄ¼µ/ÿf‡ÙÀ£¢yZi(¤ÿ*&ÓÙ™Ý&³Û8nnà&,ô‚`\Íf p±6½ýbM¼hº·œ|“tÕ½ø2Hÿ¤ýäòÔ§j.a¯ÿ²å÷g:Ï§‰(ADQP‡^®N½Î†*h4§¦–3ÚvÊf!ÛÞ‘œÕ;Ù5IóO1O\1Ë’£ ÚÎÎ šÙŠJXw®0ÎøqZw7¤"-ÐØcFC™Ä¶ôêúâôàÃl-ó/.™ßÝ»öTqh/·cñ \îíC­´[Eþ9­$î§SÞ­®ŸA®ÒÏ›]•_ÑÓGAÈ
nÍ»˜8/ÄcrQŠ|Û¼Rý£ÊÂß·Ï‹DL§B÷a›öyWqo™v®×hx§æºÝÃëDQP‡^®N½Î†*h4§oÁ&ò•æ‰kEw0cÅ,‚£Õ	Èkâ¸}.()IœÊu:I¥WÈ¯ÞwïàúvÓvÛ8nnà&,ô‚`\ÍfjeœE,£tw
©ÉÆóëp6ùkªxOb¢êv`Žšæ
èÀ{nó‹Eùùëù	!A¢ûu_{[½#Ÿ‡WæÕf½H4l?"Ë”üäðˆTÎÊ‰TŽîÅú?^°ò_Û8nnà&,ô‚`\ÍfN7yòuêË-éÁàê!ÐÏêÓZ!c¬bä%¥SŠ´yC4ýoÛŽ²7qÛ8nnà&,ô‚`\Ífìòš
N'§(B^üŽH¹ÞìõÔÖ¬ñÉªZ+«öçáE5Z\PD¼'@ö	îè“qOT_LÉ>Ë’ÖQã_uµÛ8nnà&,ô‚`\Íf¬(R½\Ÿ‡KNCÚî€P3d5¸ÓU×C<|Né±ƒñí*~ !ÎÍ0¨µÊ¶0kÐ%`SU ûµ„^…m:f®Za9ó#ïëJ wô-®.aàï÷(5O•¶å)~¥Ð·Wp=‹2o«n	ûÆYËža Ãý¹äm›úOÔ”HK•_FG¦–ŠHDô²U·ÈE#ñLraÌÍœâÆ÷ïZ›za¡í6.Û8nnà&,ô‚`\ÍfÍ©dÐ0ŸÕÈ'`•Ò'ÎM®l]KB[-D®YÐ°úMŠ7LæZÂ“¨Ñ¬"SFêf*–VqÃ³º‡ÏZbyÛ8nnà&,ô‚`\Ífed£ÌÊ£^)Jk·™Û#Ìpøôa(xÜPbÚ¹Ü¦úB{Ÿ÷Q•`¯Ïån`¹*"0‰,Ób#‰)ÝÂØ´¢Àð!Ä¥(5ñSmh²»BÕß1Æ«Ößü<—ö0g Ùö·~ñ¬òÿZe}‡™3g5° „¿·Läô	ÌPèÞÛ8nnà&,ô‚`\ÍfŸ7Œ‰’&¦-+3D_'y¦DQP‡^®N½Î†*h4§	sò
ëé%’«æš<š¸WpÞ¿5~äed¹¿î‚
ÄæñõÞ@„ñ /kÜ ÏšÉ”)%&x ;§uiÅð'0æ6kGÛ8nnà&,ô‚`\ÍfA£%Kd®1£ù~æó£|1ÿ±©{ýj´_Ÿ ÜÞA9&”ƒi˜-C¦™!³ÒáÐ‚ƒ}Övª™ÎIqnÛ8nnà&,ô‚`\Íf[¨[2z|þ»–A”:=JˆzN ãf¹û{ò0š)Ì¿NTB|#0—³;×½±}Ê°ŠjÚŽõ»|y‘À-àzÉÌWæÇÉà5ôVéV›s®áÏ/4/—éªxÑÉUÛ8nnà&,ô‚`\Íf,iòºdA’zá¯nƒáÌ[¯´s¼™ÆáÌü®~n	ûÆYËža Ãý¹ä¯¢êÜ¤&ƒüem\†|ìDQP‡^®N½Î†*h4§trL¯¹õã|D‡1L”ê$^ˆ¤þ¢œ¥Ôþ             },
                    deleteRow: function (rowID, commit) {
                        // synchronize with the server - send delete command
                        // call commit with parameter true if the synchronization with the server is successful 
                        // and with parameter false if the synchronization failed.
                        commit(true);
                    }
                }),
                pageable: true,
                sortable: true,
                altRows: true,
                ready: function () {
                    $scope.orderIDSettings = {created: function(args){orderID = args.instance;}, disabled: true, width: 150, height: 30 };
                    $scope.freightSettings = {created: function(args){freight = args.instance;}, spinButtons: true, inputMode: 'simple', width: 150, height: 30 };
                    var countries = new Array("Afghanistan", "Albania", "Algeria", "Andorra", "Angola", "Antarctica", "Antigua and Barbuda", "Argentina", "Armenia", "Australia", "Austria", "Azerbaijan", "Bahamas", "Bahrain", "Bangladesh", "Barbados", "Belarus", "Belgium", "Belize", "Benin", "Bermuda", "Bhutan", "Bolivia", "Bosnia and Herzegovina", "Botswana", "Brazil", "Brunei", "Bulgaria", "Burkina Faso", "Burma", "Burundi", "Cambodia", "Cameroon", "Canada", "Cape Verde", "Central African Republic", "Chad", "Chile", "China", "Colombia", "Comoros", "Congo, Democratic Republic", "Congo, Republic of the", "Costa Rica", "Cote d'Ivoire", "Croatia", "Cuba", "Cyprus", "Czech Republic", "Denmark", "Djibouti", "Dominica", "Dominican Republic", "East Timor", "Ecuador", "Egypt", "El Salvador", "Equatorial Guinea", "Eritrea", "Estonia", "Ethiopia", "Fiji", "Finland", "France", "Gabon", "Gambia", "Georgia", "Germany", "Ghana", "Greece", "Greenland", "Grenada", "Guatemala", "Guinea", "Guinea-Bissau", "Guyana", "Haiti", "Honduras", "Hong Kong", "Hungary", "Iceland", "India", "Indonesia", "Iran", "Iraq", "Ireland", "Israel", "Italy", "Jamaica", "Japan", "Jordan", "Kazakhstan", "Kenya", "Kiribati", "Korea, North", "Korea, South", "Kuwait", "Kyrgyzstan", "Laos", "Latvia", "Lebanon", "Lesotho", "Liberia", "Libya", "Liechtenstein", "Lithuania", "Luxembourg", "Macedonia", "Madagascar", "Malawi", "Malaysia", "Maldives", "Mali", "Malta", "Marshall Islands", "Mauritania", "Mauritius", "Mexico", "Micronesia", "Moldova", "Mongolia", "Morocco", "Monaco", "Mozambique", "Namibia", "Nauru", "Nepal", "Netherlands", "New Zealand", "Nicaragua", "Niger", "Nigeria", "Norway", "Oman", "Pakistan", "Panama", "Papua New Guinea", "Paraguay", "Peru", "Philippines", "Poland", "Portugal", "Qatar", "Romania", "Russia", "Rwanda", "Samoa", "San Marino", " Sao Tome", "Saudi Arabia", "Senegal", "Serbia and Montenegro", "Seychelles", "Sierra Leone", "Singapore", "Slovakia", "Slovenia", "Solomon Islands", "Somalia", "South Africa", "Spain", "Sri Lanka", "Sudan", "Suriname", "Swaziland", "Sweden", "Switzerland", "Syria", "Taiwan", "Tajikistan", "Tanzania", "Thailand", "Togo", "Tonga", "Trinidad and Tobago", "Tunisia", "Turkey", "Turkmenistan", "Uganda", "Ukraine", "United Arab Emirates", "United Kingdom", "United States", "Uruguay", "Uzbekistan", "Vanuatu", "Venezuela", "Vietnam", "Yemen", "Zambia", "Zimbabwe");
                    $scope.shipCountrySettings = {created: function(args){shipCountry = args.instance;}, source: countries, width: 150, height: 30 };
                    $scope.shipDateSettings = { created: function(args){shipDate = args.instance;}, formatString: 'd', width: 150, height: 30 };
                    $scope.saveSettings = { height: 30, width: 80 };
                    $scope.cancelSettings = { height: 30, width: 80 };
                    $scope.cancel = function () {
                        dialog.close();
                    };
                    $scope.save = function () {
                        dialog.close();
                        // update edited row.
                        var rowData = {
                            OrderID: orderID.val(), Freight: freight.val(),
                            ShipCountry: shipCountry.val(), ShippedDate: shipDate.val()
                        };
                        grid.updateRow(editRow, rowData);
                    };
                    $scope.close = function()
                    {
                        $scope.gridSettings.disabled = false;
                    };

                    var table = document.getElementById("table");
             
                    $scope.dialogSettings =
                    {
                        created: function(args)
                        {
                            dialog = args.instance;
                        },
                        resizable: false,
                        position: { left: table.offsetLeft + 75, top: table.offsetTop + 35 },
                        width: 270, height: 230,
                        autoOpen: false
                    };
                },
                pagerButtonsCount: 8,
                columns: [
                  { text: 'Order ID', editable: false, dataField: 'OrderID', width: 200 },
                  { text: 'Freight', dataField: 'Freight', cellsFormat: 'f2', cellsAlign: 'right', align: 'right', width: 200 },
                  { text: 'Ship Country', dataField: 'ShipCountry', width: 150 },
                  { text: 'Shipped Date', dataField: 'ShippedDate', cellsAlign: 'right', align: 'right', cellsFormat: 'd' }
                ]
            };
            $scope.rowDoubleClick = function (event) {
                var args = event.args;
                var index = args.index;
                var row = args.row;
                // update the widgets inside jqxWindow.
                dialog.setTitle("Edit Row: " + row.OrderID);
                dialog.open();
                editRow = index;
                $scope.gridSettings.disabled = true;
                orderID.val(row.OrderID);
                freight.val(row.Freight);
                shipCountry.val(row.ShipCountry);
                shipDate.val(row.ShippedDate);
            };
        });
    </script>
</head>
 <body ng-controller="demoController">
    <jqx-data-table jqx-watch="gridSettings.disabled" jqx-on-row-double-click="rowDoubleClick(event)" jqx-settings="gridSettings"></jqx-data-table>
    <jqx-window jqx-on-close="close()" jqx-create="dialogSettings" jqx-settings="dialogSettings">
        <div>Edit Dialog</div>
        <div style="overflow: hidden;">
            <table id="table" style="table-layout: fixed; border-style: none;">
                <tr>
                    <td align="right">Order ID:
                    </td>
                    <td align="left">
                        <jqx-input jqx-disabled="true" jqx-settings="orderIDSettings" jqx-create="orderIDSettings"></jqx-input>
                    </td>
                </tr>
                <tr>
                    <td align="right">Freight:
                    </td>
                    <td align="left">
                        <jqx-number-input jqx-settings="freightSettings" jqx-create="freightSettings"></jqx-number-input>
                    </td>

                </tr>
                <tr>
                    <td align="right">Ship Country:
                    </td>
                    <td align="left">
                        <jqx-input jqx-settings="shipCountrySettings" jqx-create="shipCountrySettings"></jqx-input>
                    </td>
                </tr>
                <tr>
                    <td align="right">Shipped Date:</td>
                    <td align="left">
                        <jqx-date-time-input jqx-settings="shipDateSettings" jqx-create="shipDateSettings"></jqx-date-time-input>
                    </td>
                </tr>
                <tr>
                    <td colspan="2" align="right">
                         <br />
                         <jqx-button jqx-settings="saveSettings" jqx-create="saveSettings" jqx-on-click="save()">Save</jqx-button><jqx-button jqx-on-click="cancel()" style="margin-left: 5px;" jqx-settings="cancelSettings" jqx-create="cancelSettings">Cancel</jqx-button></td>                    
                   </tr>
            </table>
        </div>
    </jqx-window>
</body>
</html>