1. #1
    Ext User ilker's Avatar
    Join Date
    Sep 2008
    Posts
    115
    Vote Rating
    0
    ilker is on a distinguished road

      0  

    Question How to sort GridPanel by Turkish Characters

    How to sort GridPanel by Turkish Characters


    Hi everybody, i got a problem with gridpanel about sorting...Because of not recognizing my native language's characters, gridpanel sorts contents wrong..How can i sort them by character encoding 8859_9 AND/OR UTF8?
    THX FOR YOUR REPLIES..

  2. #2
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,498
    Vote Rating
    46
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    Use my suggestion to allow a "comparator" function for a Store. Then you can use localeCompare:

    https://extjs.com/forum/showthread.php?p=235598

  3. #3
    Ext User ilker's Avatar
    Join Date
    Sep 2008
    Posts
    115
    Vote Rating
    0
    ilker is on a distinguished road

      0  

    Question


    Code:
    Ext.override(Ext.data.Store, {
        sortData : function(f, direction){
            direction = direction || 'ASC';
            var fld = this.fields.get(f), st = fld.sortType;
            var fn = fld.comparator || function(r1, r2){
                var v1 = st(r1.data[f]), v2 = st(r2.data[f]);
                return v1 > v2 ? 1 : (v1 < v2 ? -1 : 0);
            };
            this.data.sort(direction, fn);
            if(this.snapshot && this.snapshot != this.data){
                this.snapshot.sort(direction, fn);
            }
        }
    });
    Code:
    function compareField1(r1, r2) {
        var v1 = r1.data['field1'], v2 = r2.data['field1'];
        return v1.localeCompare(v2);
    }
    ...
    fields: [
        {name: 'field1', comparator: compareField1},
        {name: 'field2', sortType: Ext.data.SortTypes.asUCText}
    ]
    i dont understand this...What do i have to write into "localCompare" function,
    can u give any example?
    Code:
    ----------------v1.localCompare(v2)------------------
    And also in MixedCollection.js
    there is a _sort function that does the sorting operation for store object..
    but i dont i understand how it sorts only with
    v1.localCompare(v2)

  4. #4
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,498
    Vote Rating
    46
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    localeCompare is a method of the String class. Look it up.

    So your comparator method recieves 2 Records.

    It compares the field of the Records in whatever way you see fit and returns -1, 0 or 1

  5. #5
    Ext User ilker's Avatar
    Join Date
    Sep 2008
    Posts
    115
    Vote Rating
    0
    ilker is on a distinguished road

      0  

    Question


    M8 may be u misunderstood me .. my native language has some characters which are '

  6. #6
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,498
    Vote Rating
    46
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    localeCompare is supposed to handle that isn't it?

  7. #7
    Ext User ilker's Avatar
    Join Date
    Sep 2008
    Posts
    115
    Vote Rating
    0
    ilker is on a distinguished road

      0  

    Question


    Sorry For my late answer m8 but something wrong about that... my function could not be resolved by the config option 'comparator' :S
    This is my json data where i call it remotely by Ext.ux.Plugin.RemoteComponent(PersonelBilgisi.json):
    Code:
    {
        karsilastirmaTr : function(r1,r2) {
             var v1 = r1.data['ad'];
             var v2 = r2.data['ad'];
             return v1.localeCompare(v2);
        },
        xtype : 'SadeVeriPaneli',
        title : '',
        store : new data.Depo({
            proxy : new Ext.data.HttpProxy({
                url : 'GetPersonelBilgisiAction.do'
            }),
            reader : new Ext.data.JsonReader({
                root : 'personelBilgisi',
                fields : [
                    {name : 'kisiId',type : 'int'},
                    {name : 'ad',comparator : karsilastirmaTr},
                    'soyad',
                    'tanim',
                    {name : 'kurumOrganizasyonId',type : 'int'}
                ],
                listeners : {
                    'loadexception' : function(t,o,r,e) {
                        console.log(r.responseText);
                        console.log(e.message);
                    }
                }
            }),//reader sonu...
            autoLoad : true
        }),//store sonu...
        columns : [
            {header : 'Unvan',width : 240,sortable : true,dataIndex : 'tanim'},
            {header : 'Ad',width : 240,sortable : true,dataIndex : 'ad'},
            {header : 'Soyad',width : 240,sortable : true,dataIndex : 'soyad'}
        ],
        autoWidth : true,
        viewConfig:{forceFit:true},
        bbar : [],
        height : 400,
        //sutunlara tiklayinca cikan menuyu iptal et...
        enableHdMenu : false
    }
    This is the code where i call it..
    Code:
    Ext.onReady(function() {
        Ext.QuickTips.init();
        /**
         * tank verilerini ve panelini alip geriye dondurecek olan
         * fonksiyon
         */    
        var getTankMevcutlari = function() {
            return new Ext.ux.Plugin.LiteRemoteComponent({ 
                url : 'JavaScriptFiles/UniteDetay/TankMevcutlari.json'
            });
        };
        /**
         * personel bilgilerinin oldugu gridPanel geriye doner...
         */
        var getPersonelBilgisi = function() {
            return new Ext.ux.Plugin.LiteRemoteComponent({
                url : 'JavaScriptFiles/UniteDetay/PersonelBilgisi.json'
            });
        };
        /**
         * adres bilgisinin oldugu textArea'yi geriye dondur...
         */
        var getAdresBilgisi = function() {
            return new Ext.ux.Plugin.LiteRemoteComponent({
                url : 'JavaScriptFiles/UniteDetay/AdresBilgisi.json'
            });
        };
        /**
         * Butun unite detay bilgilerini barindiricak tab paneli cizdir...
         */
        var tabPanel = new Ext.TabPanel({
            activeTab : 0,
            width : 720,
            height : 400,
            /**
             * bu sayede her tab
             * kendisi aktif oldugunda 
             * render edilecek
             * bu sayede response nesnesi render esnasinda
             * sayfaya load edilecek....
             */
            deferredRender:false,
            //eger false olursa tab larin arkasina yeni bir katman getiriyor
            //cirkin bir goruntu...
            plain : true,
            defaults : {
                autoHeight : false,
                layout : 'fit'
            },
            items : [
                {
                    title : 'Tank Mevcutlari',
                    plugins : [getTankMevcutlari()]
                },
                {
                    title : 'Personel Bilgileri',
                    plugins : [getPersonelBilgisi()],
                    autoScroll : true
                },
                {
                    title : 'Adres Bilgileri',
                    plugins : [getAdresBilgisi()]
                },
                {
                    title : 'Iletisim Bilgileri'
                }
            ],
            renderTo : 'UniteDetayTabPanel'
        });
        /**
         * Dosyalarin Goruntulenmesi icin...
         */
        GetDosyaIsimleriDWR.dosyalarinAgacYapisiniGeriDondurDWR(document.
                            getElementById('birimId').value,agaciOlustur);
        function agaciOlustur(data) {
            var json = data;
            var agac = new agacVeriGosterimi.DosyaAgaci({
                root : new Ext.tree.AsyncTreeNode({
                    text : 'UniteBilgiFormlari',
                    draggable : false,
                    id : 'Documents/EclipseCalismaAlani/Harita/UniteBilgiFormlari',
                    children: json
                }),
                listeners : {
                    click : function(node,event) {
                        if(node.isLeaf()) {
                            window.open("DokumanGorServlet?m=n&fileName="+node.id.substring(55));
                        }
                    },
                    scope : this
                }
                
            });
            agac.render('BirimDokumanlari');
        }//agaciOlusturSonu...
    });

    This is the code where i override store object..

    Code:
    Ext.namespace("data");
    
    data.Depo = function(config) {
        Ext.apply(this,{});
        data.Depo.superclass.constructor.call(this, config);
    };
    
    Ext.extend(data.Depo,Ext.data.Store, {
        
        sortData : function(f, direction){
            direction = direction || 'ASC';
            var fld = this.fields.get(f), st = fld.sortType;
            var fn = fld.comparator || function(r1, r2){
                var v1 = st(r1.data[f]), v2 = st(r2.data[f]);
                return v1 > v2 ? 1 : (v1 < v2 ? -1 : 0);
            };
            this.data.sort(direction, fn);
            if(this.snapshot && this.snapshot != this.data){
                this.snapshot.sort(direction, fn);
            }
        }
    });
    Problem is when i wrote down """comparator : karsilastirmaTr""" .. my gridpanel disappears and also firebug says there is no function karsilastirmaTr..
    THX FOR YOUR REPLIES...

  8. #8
    Ext User ilker's Avatar
    Join Date
    Sep 2008
    Posts
    115
    Vote Rating
    0
    ilker is on a distinguished road

      0  

    Question


    i dont know may be there is no permisson to write a new function(karsilastirmaTr i meant) in json file...But where to write :S???

  9. #9
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,498
    Vote Rating
    46
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    This is just your javascript.

    Of course its undefined. You have not got any variable called "karsilastirmaTr" there have you? Wen you read that code you can see that.

    Anyway, if you read the override, you can see that it's a config of Store.

  10. #10
    Ext User ilker's Avatar
    Join Date
    Sep 2008
    Posts
    115
    Vote Rating
    0
    ilker is on a distinguished road

      0  

    Question


    i wrote it here m8 ...:
    Code:
    {
        karsilastirmaTr : function(r1,r2) {
             var v1 = r1.data['ad'];
             var v2 = r2.data['ad'];
             return v1.localeCompare(v2);
        },
        xtype : 'SadeVeriPaneli',
        title : '',
        store : new data.Depo({
            proxy : new Ext.data.HttpProxy({
                url : 'GetPersonelBilgisiAction.do'
            }),
            reader : new Ext.data.JsonReader({
                root : 'personelBilgisi',
                fields : [
                    {name : 'kisiId',type : 'int'},
                    {name : 'ad'},
                    'soyad',
                    'tanim',
                    {name : 'kurumOrganizasyonId',type : 'int'}
                ],
                listeners : {
                    'loadexception' : function(t,o,r,e) {
                        console.log(r.responseText);
                        console.log(e.message);
                    }
                }
            }),//reader sonu...
            autoLoad : true
        }),//store sonu...
        columns : [
            {header : 'Unvan',width : 240,sortable : true,dataIndex : 'tanim'},
            {header : 'Ad',width : 240,sortable : true,dataIndex : 'ad'},
            {header : 'Soyad',width : 240,sortable : true,dataIndex : 'soyad'}
        ],
        autoWidth : true,
        viewConfig:{forceFit:true},
        bbar : [],
        height : 400,
        //sutunlara tiklayinca cikan menuyu iptal et...
        enableHdMenu : false
    }
    in my json file...i asked if i cant write down any function definiton in a json file???

Thread Participants: 1