Threaded View

  1. #1
    Sencha User
    Join Date
    Jun 2009
    Posts
    411
    Vote Rating
    2
    parky128 is on a distinguished road

      0  

    Default Dataview repaint issue

    Dataview repaint issue


    Hi,

    I have encountered a situation after upgrading to the 2.1.0b3 with a List component in my application.

    See the before and after screenshots attached.

    I have a Map panel which is 'bound' to the same store as the Locations list

    When I click the refresh button in the top toolbar when viewing the map screen, markers on the map change position (if new data is available). Likewise the Locations list rows update and re-sorts. When switching back to the Locations lists from the Map panel, I end up with the horrible looking rows as per the attached 'after' image.

    This doesn't happen when viewing the list and doing a refresh, it updates and re-sorts and displays as expected.

    Is this something to do with the list view no longer being in the viewport as an active item when viewing the Map and not handling the updates\store sort properly in the DOM structure?

    In case it's relevant, here is the code for the Locations list:

    Code:
    Ext.define('PinpointersTouch.view.UnitList', {
        extend: 'Ext.dataview.List',
        xtype: 'unitslist',
        
        config: {
            emptyText: 'There are no vehicles in your tracking list.',
            loadingText: false,
            itemTpl: new Ext.XTemplate(
                    '<ul id="unitList">',
                        '<tpl for=".">',
                            '<li>',
                                '<table width="100%" cellspacing="0">',
                                    '<tr>',
                                        '<td style="width:24px; text-align:center;"><img src="resources/images/{[values.InJourney == true ? "green_vehicle_icon": "red_vehicle_icon"]}.png"/></td>',
                                        '<td valign="top">&nbsp;{UnitName}</td>',
                                    '</tr>',
                                '</table>',
                                '<div class="journeyCurrentLocation">{Location}</div>',
                                '<span class="journeyDetail">{Subtitle}</span>',
                                '<div class="journeyLastReportedTimestamp"><b>Last Reported at:</b> {EventDTDisplay}</div>',
                            '</li>',
                        '</tpl>',
                    '</ul>'),
            store: 'CurrentGrid',
            items: [{
                xtype: 'toolbar',
                docked: 'bottom',
                ui: 'light',
                items: [{
                    xtype: 'label',
                    html: 'Show:',
                    style: 'color:white;'
                },{
                    xtype: 'selectfield',
                    store: 'TrackingListWithShowAll',
                    displayField: 'UnitName',
                    valueField: 'UntID',
                    itemId: 'selectVehicle'
                }]
            }]      
        }
    
    
    });
    Attached Images

Thread Participants: 2