1. #1
    Sencha User
    Join Date
    Apr 2013
    Posts
    19
    Vote Rating
    0
    Ant0nin is on a distinguished road

      0  

    Default How to refresh/reload a component after overriding the prototype of its class?

    How to refresh/reload a component after overriding the prototype of its class?


    Hello,

    I'm a beginner with ExtJS framework, and I'm trying to develop a module for an application which aims at switching between languages without refreshing the entire page but only graphical components. So I override the class of my object with an AJAX request but I don't know how to apply the changes to my components. Also, I would like my components not to be instantiated in the success method of the request, is it possible?

    LanguageChoice.js :

    Code:
    Ext.ns('MyCompany.form');
    
    
    MyCompany.form.LanguageChoice = Ext.extend(Ext.form.FormPanel, {
        
        constructor: function(config) {
            
            // Here is my store which contains languages and associated codes (fr, en, es...)
            var languagesStore = new Ext.data.ArrayStore({
                fields: ['code','label'],
                data: Docuged.resources.languages
            });
            
            config = Ext.apply({
                items:[
                    // On ajoute une combobox
                    new Ext.form.ComboBox({
                        fieldLabel:'Language',
                        emptyText: 'Choose language...',
                        store: languagesStore,
                        displayField:'label',
                        triggerAction: 'all',
    
    
                        // Overrides of a class with new Strings
                        onSelect: function(record) {
                            var url = String.format("ext/src/locale/ext-lang-{0}.js", record.get('code'));
                            Ext.Ajax.request({
                                url: url,
                                success: function(response) {
                                    eval(response.responseText);
    
    
                                    // TODO : How to refresh the component?
                                    
                                },         
                                failure: function() {
                                    Ext.Msg.alert('Failure', 'Failed to load locale file.');
                                },
                                scope: this 
                            });
                        },
                        mode: 'local'
                    })
                ],
                autoHeight: true,
                autoWidth: true,
                renderTo: 'langBar',
            }, config);
            
            MyCompany.form.LanguageChoice.superclass.constructor.call(this, config);
        }     
    });

    main.js :

    Code:
    Ext.onReady( function() {
        Ext.QuickTips.init();
        var panel = new Ext.ux.BubblePanel({}); // The component I want to refresh!
        var form = new MyCompany.form.LanguageChoice({});
    });
    Thank you in advance for your valuable answers!

    ExtJS used version : 3.4

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,647
    Vote Rating
    899
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      -1  

    Default


    What do you mean refresh the component?
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User
    Join Date
    Jan 2011
    Posts
    549
    Vote Rating
    54
    willigogs is a jewel in the rough willigogs is a jewel in the rough willigogs is a jewel in the rough

      0  

    Default


    I assume he probably means "replace all existing text strings with those of the selected language"?

    For starters, I guess he would have to dynamically remove the existing locale file and attach the correct locale_xx file - but then apart from that I'm not sure, apart from manually updating every panel title, etc? :\

Thread Participants: 2