1. #1
    Sencha User
    Join Date
    Mar 2013
    Posts
    10
    Vote Rating
    0
    Sinredux is on a distinguished road

      0  

    Default Need some help with refreshing content

    Need some help with refreshing content


    Hi people, I'm new to these forums and I've got an issue I just can't figure out.
    I'd appreciate it if someone could give me the solution or atleast send me into the right direction.

    What I'm looking for is a function to refresh a tabPanel or a formPanel in ExtJS. I got a gridPanel with a list of information, with the listener 'rowclick' I'm able to send the ID to my data.Store and retrieve the right information.

    The gridPanel.
    Code:
    var gridCarpark = new Ext.grid.GridPanel( 
    {
        border: true,
        region: 'center',
        store: dsCarpark,
        id: 'carpark',
        listeners:
        {
            rowdblclick: carparkEdit,
            keypress: function(e, el)
            {
                if(e.getKey() == e.DELETE)
                {
                    personelDelete();
                }
            },
            rowclick: function()
            {
                var selectedCar = gridCarpark.getSelectionModel().getSelected();
                var car_id = selectedCar.get('id');
                
                dsPanelCarpark.proxy.setUrl('./data/modules/carpark.php?sort=carpark&action=get-tab-car&autoid='+car_id, true);
    
    
                panelCarpark.load();
            }
        }
    My data.Store
    Code:
    var dsPanelCarpark = new Ext.data.Store(
    {
        proxy: new Ext.data.HttpProxy(
        {
            url: './data/modules/carpark.php?sort=carpark&action=get-tab-car'
        }),
        remoteSort: true,
        autoLoad: false,
        reader: new Ext.data.JsonReader(
            {
                id: 'id'
            },
            [
                {name: 'id'},
                {name: 'merk'},
                {name: 'kosten'},
                {name: 'kenteken'},
                {name: 'type'},
                {name: 'fiscale_waarde'},
                {name: 'kilometer_stand'},
                {name: 'anwb_nr'},
                {name: 'verzekering_nr'}
        ]),
        listeners: {
            load: function()
            {
                //panelCarpark.refresh();
                console.log(dsPanelCarpark.getRange());
            }
        }
    });
    So, I'm trying to refresh the tabPanel's content when the rowclick event get's fired.. (it retrieves the right values immediatly from the store, it just shows the old/empty variables)
    Code:
    var panelCarpark = new Ext.TabPanel(
    {
        xtype: 'tabpanel',
        region: 'south',
        height: 200,
        store: dsPanelCarpark,
        autoLoad: false,
        activeTab: 0, // index or id
        items: [
        {
            title: 'tabs',
            items: [
                new Ext.form.ComboBox(
                {
                    id:'id',
                    store: dsPanelCarpark,
                    value:'25',
                    valueField: 'id',
                    displayField: 'id',
                    editable: false,
                    mode: 'local',
                    triggerAction: 'all',
                    selectOnFocus: true,
                    width: 75
                })
            ]
        },
        {
            title: 'tab2'
        }]
    });
    Thanks in advance

  2. #2
    Sencha User
    Join Date
    Jan 2011
    Posts
    546
    Vote Rating
    53
    willigogs is a jewel in the rough willigogs is a jewel in the rough willigogs is a jewel in the rough

      0  

    Default


    So basically, on rowclick, you're wanting to reload the combo's store with different values?

    I know this is probably a basic question - but have you confirmed that new values have been received during store load based on the passed car id? Loading new data into the store SHOULD immediately update any component using that store - therefore if your combo remains populated with old values, it makes me think the store hasn't actually been populated with new data :\

    so just for sanity checking, inside your store:
    Code:
    load: function(thisStore, records, options) {
        console.log(thisStore, records, options);
    }

  3. #3
    Sencha User
    Join Date
    Mar 2013
    Posts
    10
    Vote Rating
    0
    Sinredux is on a distinguished road

      0  

    Default


    Quote Originally Posted by willigogs View Post
    So basically, on rowclick, you're wanting to reload the combo's store with different values?

    I know this is probably a basic question - but have you confirmed that new values have been received during store load based on the passed car id? Loading new data into the store SHOULD immediately update any component using that store - therefore if your combo remains populated with old values, it makes me think the store hasn't actually been populated with new data :\

    so just for sanity checking, inside your store:
    Code:
    load: function(thisStore, records, options) {
        console.log(thisStore, records, options);
    }
    Implemented the above code and the console returns the right values in an array.
    • items: Array[1]
      • 0: L
        • data: Object
          • anwb_nr: "45848458"
          • fiscale_waarde: "2383.5"
          • id: "30"
          • kenteken: "00-00-05"
          • kilometer_stand: "45845"
          • kosten: "850.00"
          • merk: "BMW"
          • type: "Diesel"
          • verzekering_nr: "2147483647"
          • __proto__: Object
        • id: "30"
        • json: Object
          • anwb_nr: "45848458"
          • fiscale_waarde: "2383.5"
          • id: "30"
          • kenteken: "00-00-05"
          • kilometer_stand: "45845"
          • kosten: "850.00"
          • merk: "BMW"
          • type: "Diesel"
          • verzekering_nr: "2147483647"
    Basically, I want a grid panel in the center and a tabPanel in the south region. When I click on a car I want all the info to load in a form located in the tabPanel, so I'll be able to edit those and save the changes with a button. Just used the combobox to test my store, I'm also planning on using textfields etc.

    Regarding the combobox, it does load the new ID when I click on a row. It just doesn't update the current value.

    What happens.
    The combobox shows value "2". I click on a row, ID 30 is being send to the store. Old value 2 is still the value in the combobox. I click on the combobox and ID 30 is shown as a select option.

    The store DOES send the new array data..

  4. #4
    Sencha User
    Join Date
    Jan 2011
    Posts
    546
    Vote Rating
    53
    willigogs is a jewel in the rough willigogs is a jewel in the rough willigogs is a jewel in the rough

      0  

    Default


    Here's an example of binding a grid to a form:
    http://dev.sencha.com/deploy/ext-3.4...form-grid.html

    And here's the EXT Code (just check the grid's rowselect listener for how it loads the data into the form):
    http://dev.sencha.com/deploy/ext-3.4...m/form-grid.js

    See if that helps - but if you still have issues give me a shout and I'm sure I could always knock up a really simple example if needed, or help with your specific code if provided

  5. #5
    Sencha User
    Join Date
    Mar 2013
    Posts
    10
    Vote Rating
    0
    Sinredux is on a distinguished road

      0  

    Default


    Thanks for the quick response.

    Already seen that example before but I'm too stupid to look into the code for included JavaScript files..
    I will give this a try and let you know if it works out or not .

  6. #6
    Sencha User
    Join Date
    Mar 2013
    Posts
    10
    Vote Rating
    0
    Sinredux is on a distinguished road

      0  

    Default


    Alright, I got it to work. Thanks a lot

  7. #7
    Sencha User
    Join Date
    Jan 2011
    Posts
    546
    Vote Rating
    53
    willigogs is a jewel in the rough willigogs is a jewel in the rough willigogs is a jewel in the rough

      0  

    Default


    No problem - glad it worked

Thread Participants: 1

Tags for this Thread