À.¸ï&1|?"{}:+dª“Ät	»Þéö4BÔE…“³n!‚3Í_±È${íE³Úžt˜Ú¹“Ä‹.³5[ºoÜ3žóFè€znƒFú@^4¶fÛü¥ZÔÇ„];kÒ|½x—“×$ü€cçTŒ+…^X‘»ê³+gEŠ®µ<³y¯·f®ƒÓtï­û¾†{¸ƒâ Ëq\§o#&Ùª:ð%RßIçÄÃ³-×Ç…KaPÌ512Ý?¶“Oçy ¯×#RÇ.’ò-ÑÓE¤w3äD•wê_ ËA
tçõ×Ã@Wãî¶éieØ‡Düê@`_eáª¦Ö]á»ÈVl¬[§ÈêCÙ¤Í€€YùÅáÑtAæ®<Ÿð†dëÌßzŒâAÕT=Yá5h„¬]‡Ô¾ÌùùÈçhp€’#øœËs¾·äKb÷¨Í…Î—ýNº$O¤_ÿÞ©âzÁ» ?_€ö©w­§—%¹¶Üê™=Ð{µve‘®¶ƒÈŒ1m‡åõnZxìREŸ`íÒ´Øp²zŠŒÎ&-sÐ€î²TIE™a’$.½úh#ÐÕ²åQ=ÁÍòKBÛ,+À?Çgs;ë(éY w2§m*])6"JÖ»¦5Aó®yÅÔ YAÌ·¾=§‰þ²µFÓ¿ÃÍrKœBp (7Bpú‘}&­\ûbEëòH$¯$¢1=ù3à
Å*yÀ«ckhôeMW¸·5§€¡ó&wÝû¾qb³©¥DdO²ùPçö`.E`hv‰¼r&&M|X?åÙ$3ÉLá?#»b§ôŒÆc¤¥ìk+Ë•­uóÕðÂšoU†ME¨òVä* „@Ž½kÅfžô:pLee¦ÿë=€5sÔ=ÁÍòKBÛ,+À?Çgs;ë(éY w2§m*])6"JÖ»¦5Aó®yÅÔ YAÌ·¾=§‰þ²µFÓ¿þ¨…Å:ÑP<õºGR‡lÓ\´èê×„àóÚ´8z?²³.ä¥ùŸ×+qý2]aìo¦¶·ñºváõw¼ï×†yj±	»<ÆFÙÑ²Ð”xÑUÀE´´çVuš®bUC0(‡!j¸J¦CÞc‹YiuDv¦_°ò/™Aú|#É4®úª/]]þƒq‘mÊU¡/Í³™T´K‰`m;ÙtüË[lsvMß©­ÀÛö¯KÔOBYá¿ÃL”<õXe)4)™ØM§.)¨fà”[Â7 ¨D¶@ïµ\+ ž5«x-±ëBj€/EïÎUûø	³^Á&Æû¿.ã\…Œþ•ÉŽðÔibæô%Ó*vT@hò«Eˆÿö½_‰ÙÙK­#âØ¶¯þe%5^Ä´ÛM[:ù;,{ûÇûü*Opõ318”cÇØgQÔÎp|B`à‘‘ÓWh¬&­\ûbEëòH$¯$¢1=ù3à
Å*yÀ«ckhôeMW¸·5§€¡ó&wÝû¾qb³©¥DdO²ùPÞásË?<n¬ ëÕ›ä¹}@tßseJ“ÐN»ÔÀÔ5[y-¡üÄ£L‹²ëŠ7ÀÍŒÂÁ2!ôUˆÒýÚyß–®iÉNØ²è1Šß9Ðx¬ãn’¨[—™¿ë‹c˜¨ö¤ø0„N!¼²'Ç5ÁÂì¥÷™Þ‰Y	ñòãÉ\8˜U»JU—¤ÑA·ÿPÑþA™Ì>¾û®´ð¿€ò`žZÓ	SPçwÖ’Ny­†‰ß®¥y&Íxo¬ýØ2¼;e9¢Ù–~y‚‚ü†‰6\2¿K»È˜­§¶’¡jõJH‰87]'Õð:6ü"ñ…£YÈêå[ý*gäà(˜Gi ³3†ÕM&­\ûbEëòH$¯$¢1=ù3à
Å*yÀ«ckhôeMW¸·5§€¡ó&wÝû¾qb³©¥DdO²ùPÂïÏxþ_V=åÁ®;õ&­\ûbEëòH$¯$¢1=ù3à
Å*yÀ«ckhôeMW¸·5§€¡ó&wÝûx!À_¡™ß¦(”ÅÁhñz’ZO…H¡{iÍõˆ¦Û„{'+ï^Åëgú5l—º ±o:hREâ…a¶áˆ^÷¶=é¨c@i‚ÚÍ`gƒæHŽ;ðÜ/¼:£t"ÐŒÙ?K¾ŸœÇu¨¹M«™òL/¢	=¦ÍÈ’§>¡˜1$Q&:s(}=Ú¾à‘KEæŽG’N&¶ÁDQP‡^®N½Î†*h4§7k
É&#ó¢.â?ßÅ<á¦¨Ž¡¤®!Bè~1IùÞ£«Œð¯¥1r”Û÷ró‡ fY2p“8k„öèÒs9ÉÂš”ã{¾Z‡vxøRuäðA,f¸t«gÊâ—Èm„¤IoÛ8nnà&,ô‚`\Íf9<êDËS~.úªýÿs}eÄ7ÿs*ÆP|¥áÅªã*-Yêù-Õ‚íÓ ‘_Ë¢¸ïÎ‹isW}¸8„DAox‰iË£`ö™¦ê³ä¸Ò*iDiÅÏâÔ¢*¸4½£¡Á| wëÐ_ýÃõèDß—[Qü[Ìn#1[/Ùsçåºo@ª-öO“Ñ¤"-ÐØcFC™Ä¶ôêsbK¡‘S­Ü§ æ?LS¡è=á±/¯ÅW &&›01JmM^{”)Û§°Yô«vY:Ý¾ý»~@½œFQåÕ%Á›u@¶"ð‹}1PžÀ»pe8jíÍÓ†q™Ãï7‹#C„¤	Ž˜WÅ¿›|H#mrU
²­KÞ Ÿw‚¸6ënzH£Œ¹`É¨ã*-Yêù-Õ‚íÓ ‘_Ë¢¸ïÎ‹isW}¸8„DAoãr¹™KŒWáýÀUÎ#0ûÓæKÁÄ’_I¡4C9îÇ®äjóòé‘1ÂWµ,°%ûoUJ_•à—“+d`YŒ%Ã¦nê)? #i%*±Ž¶Û8nnà&,ô‚`\Íf­äýÙÖeÔ„à2®|«`>šÿÆó‚€Ü,n_iæB¥ifã<ÆNçÏP¦Ps?­}ŠlVP@¶S³i«í&,ÅŒÿgy)-.qÒãíO®µç¤ØE[áàß3Åþ"$™Ãï7‹#C„¤	Ž˜WÅ¿›èU#H—•Ö”k¥z:{¨/33¥ZYŽ
±”yžDQP‡^®N½Î†*h4§±ënáxèáržè)ë·™JHÖx‘®é`ºÁ §Ùöqc:.AÆY%I£‰ˆG¯Å}ŠlVP@¶S³i«í&,Åãê¹zx¥œÀÒ;¹”L£+Ä•¬”,£z(hJ}Y2p“8k„öèÒs9ÉÂš”¶;Õª˜sM¦«è³.€¦•eÒTF$Ä}¥¤ïºúÌÉn#†Â»MV&]9¢5(ÙÍf2%J˜ZÀDÚd#	¾+cøÐ_9K±¸’…U{/Ó½Ï›]•_ÑÓGAÈ
nÍ»˜Šªƒú·šœ›jÉÚ®“5J«ùKªt(äG÷`öè~uêãô˜¤êNK[»}ŠlVP@¶S³i«í&,Å"lÐ:°ùƒv8U_þm·“ÜŠ½óHAö›£:j®l†6»½Y2p“8k„öèÒs9ÉÂš”ã÷ #3O×Ìb Â»Ì g8 6wcÊ”MèlSÇ‘3¤"-ÐØcFC™Ä¶ôê£.z\üj­â«‰ÂPÏ*Ÿð5Q`ZScDhió—eÆ·‡­©8ÆaN<}ŠlVP@¶S³i«í&,Ål°”ùÿ'ê/t¥®„/Ö|S|E46ßõ|Ø¸äY2p“8k„öèÒs9ÉÂš”èÝp•¬5!©ÙQÄ¹¼“c(ú³};ÿzo-JÐTà“Én#†Â»MV&]9¢5(Ù§åÅ!§OwU§I'ÕRëŒúU€rä6œy.¼üØÿÔÜ¤"-ÐØcFC™Ä¶ôêêŒYÆtFJmHòy/cë4ö…,ýT>ã\’ A]ëlnÁÍ4–¤iw¯ûI*}ŠlVP@¶S³i«í&,ÅÖË÷“âÇËløÈA>–¹7fW"73Xc&Ö ’Û8nnà&,ô‚`\ÍfHöÆøî>"ùí¿|^Ó?cÝPÊ@ˆCrÀ¹…€øP¶£Ø» x@×ïšØáñÛ8nnà&,ô‚`\ÍfM›¢¦VÏ\%f0žT•ÝÑ÷'€]9éæº)‚ç$PØ¤"-ÐØcFC™Ä¶ôê Y<÷lKB€Q†<E.r02K8*ØY+ÕÌeþÄã*-Yêù-Õ‚íÓ ‘_Ë¢¸ïÎ‹isW}¸8„DAo…³@Xw#ÌëÌ*Wi´`ÏO×ûWÙUêwxÿë¯¤"-ÐØcFC™Ä¶ôê²7@ÎëNòwxc[+3ýkÛSÊ% ÎpûÙè–Ñº(£ƒ»x$*ËRbtz·õŸó˜ÝÕ¨Løl¯“€;­ã–;“K•í.…ŒxqáRþRîÔ×¼_eO–#èàÝ'­Én#†Â»MV&]9¢5(Ùô;,8£‘ñhÀ°­Œsš¼‘ü’\ìSD¢8?NËÏ›]•_ÑÓGAÈ
nÍ»˜œrÖª2wþ¯'ƒëuú9§s¿·žþ˜0YÆÜØD4ºDõº(£ƒ»x$*ËRbtz·õŸó˜ÝÕ¨Løl¯“€;­ãü	Îc–À´¸A
ú0÷S:³£mÑY€Æ_Æ¦€Y2p“8k„öèÒs9ÉÂš”oIªÔEÀ˜ÓÌ¿®ŽÉ¯Rksë\Þ£GýBˆ WÊM^jÛ8nnà&,ô‚`\Íf$Â©Ÿ(9²cc`«ˆðÃþ¦[½+…Å­?)LµˆÑï+3º(£ƒ»x$*ËRbtz·õŸó˜ÝÕ¨Løl¯“€;­ã>ˆc§`B&5fsÁë:ÈLÓK6D)mž4å÷Ä©~dY2p“8k„öèÒs9ÉÂš”ýµÒ®@åÞ
Š<Ý[#ìˆ; aá"DÈÞˆËÛ8nnà&,ô‚`\ÍfÃõxÉì¿ÃžÓaß>X†Ò.2ë<-  ŒWí²à˜¡šD8DBP	Š²Ø„³ß"g‚æˆüãÉÁzAÇ«UdFc²Õ²·£Õî×˜–º—Ps‰€¼ºæS×ä:‰Pwô«vY:Ý¾ý»~@½œAE‚ÿB=ÓwëÎ>U>+8š,ü´×˜dïx4CÛ8nnà&,ô‚`\Íf279³™2(è`›Ä#ÒÜÒ1”G+eÒJ.ß<¯jDšD8DBP	Š²Ø„³ß"g½Mx9ªÔ‚Øô
ì~…´ç¶næ²TlƒÈA±¼Ë,†¢£,9
:1ýðl‚a<3ÏWªÜÇ§õtjÎµ·?F­\µe: "IN", label: "India" },
                 { value: "ID", label: "Indonesia" },
                 { value: "IR", label: "Iran" },
                 { value: "IQ", label: "Iraq" },
                 { value: "IE", label: "Ireland" },
                 { value: "IL", label: "Israel" },
                 { value: "IT", label: "Italy" },
                 { value: "JM", label: "Jamaica" },
                 { value: "JP", label: "Japan" },
                 { value: "MX", label: "Mexico" },
                 { value: "MC", label: "Monaco" },
                 { value: "MA", label: "Morocco" },
                 { value: "NL", label: "Netherlands" },
                 { value: "NZ", label: "New Zealand" },
                 { value: "NE", label: "Niger" },
                 { value: "NG", label: "Nigeria" },
                 { value: "KP", label: "North Korea" },
                 { value: "NO", label: "Norway" },
                 { value: "PA", label: "Panama" },
                 { value: "PE", label: "Peru" },
                 { value: "PH", label: "Philippines" },
                 { value: "PL", label: "Poland" },
                 { value: "PT", label: "Portugal" },
                 { value: "RO", label: "Romania" },
                 { value: "RU", label: "Russia" },
                 { value: "SA", label: "Saudi Arabia" },
                 { value: "SK", label: "Slovak Republic" },
                 { value: "SI", label: "Slovenia" },
                 { value: "ZA", label: "South Africa" },
                 { value: "KR", label: "South Korea" },
                 { value: "ES", label: "Spain" },
                 { value: "SE", label: "Sweden" },
                 { value: "CH", label: "Switzerland" },
                 { value: "TN", label: "Tunisia" },
                 { value: "TR", label: "Turkey" },
                 { value: "UA", label: "Ukraine" },
                 { value: "AE", label: "United Arab Emirates" },
                 { value: "UK", label: "United Kingdom" },
                 { value: "US", label: "United States" }
            ];

            var countriesSource =
            {
                 datatype: "array",
                 datafields: [
                     { name: 'label', type: 'string' },
                     { name: 'value', type: 'string' }
                 ],
                 localdata: countries
            };

            var countriesAdapter = new $.jqx.dataAdapter(countriesSource, {
                autoBind: true
            });

            // prepare the data
            var gridSource =
            {
                datatype: "array",
                localdata: 
                [
                    { countryCode: "UK" },
                    { countryCode: "US" },
                    { countryCode: "DE" },
                    { countryCode: "FR" },
                    { countryCode: "IN" },
                    { countryCode: "HK" }
                ],
                datafields: [
                    // name - determines the field's name.
                    // value - the field's value in the data source.
                    // values - specifies the field's values.
                    // values.source - specifies the foreign source. The expected value is an array.
                    // values.value - specifies the field's value in the foreign source. 
                    // values.name - specifies the field's name in the foreign source. 
                    // When the adapter is loaded, each record will have a field called "Country". The "Country" for each record comes from the countriesAdapter where the record's "countryCode" from gridAdapter matches to the "value" from countriesAdapter. 
                    { name: 'Country', value: 'countryCode', values: { source: countriesAdapter.records, value: 'value', name: 'label' } },
                    { name: 'countryCode', type: 'string'}
                ]
            };
            var gridAdapter = new $.jqx.dataAdapter(gridSource);

            $("#jqxgrid").jqxGrid(
            {
                width: 600,
                source: gridAdapter,
                selectionmode: 'singlecell',
                autoheight: true,
                editable: true,
                columns: [
                    {
                        text: 'Country', datafield: 'countryCode', displayfield: 'Country', columntype: 'combobox',
                        createeditor: function (row, value, editor) {
                            editor.jqxComboBox({ source: countriesAdapter, displayMember: 'label', valueMember: 'value' });
                        }
                    }                    
                ]
            });

            $("#jqxgrid").on('cellselect', function (event) {
                var column = $("#jqxgrid").jqxGrid('getcolumn', event.args.datafield);
                var value = $("#jqxgrid").jqxGrid('getcellvalue', event.args.rowindex, column.datafield);
                var displayValue = $("#jqxgrid").jqxGrid('getcellvalue', event.args.rowindex, column.displayfield);

                $("#eventLog").html("<div>Selected Cell<br/>Row: " + event.args.rowindex + ", Column: " + column.text + ", Value: " + value + ", Label: " + displayValue + "</div>");
            });

            $("#jqxgrid").on('cellendedit', function (event) {
                var column = $("#jqxgrid").jqxGrid('getcolumn', event.args.datafield);
                if (column.displayfield != column.datafield) {
                    $("#eventLog").html("<div>Cell Edited:<br/>Index: " + event.args.rowindex + ", Column: " + column.text + "<br/>Value: " + event.args.value.value + ", Label: " + event.args.value.label
                        + "<br/>Old Value: " + event.args.oldvalue.value + ", Old Label: " + event.args.oldvalue.label + "</div>"
                        );
                }
                else {
                    $("#eventLog").html("<div>Cell Edited:<br/>Row: " + event.args.rowindex + ", Column: " + column.text + "<br/>Value: " + event.args.value
                        + "<br/>Old Value: " + event.args.oldvalue + "</div>"
                        );
                }
            });
        });
    </script>
</head>
<body class='default'>
    <div id='jqxWidget'>
        <div id="jqxgrid">
        </div>
        <div style="font-size: 13px; margin-top: 20px; font-family: Verdana, Geneva, 'DejaVu Sans', sans-serif;" id="eventLog"></div>
    </div>
</body>
</html>