开发者

Sencha Touch refresh list after data in store has been changed

i want to do the following:

I have a store which gets JSON data from the server. The JSON looks like this:

{"id":"1","name":"Name1","address":"exampleaddress1","lat":"48.366268","lng":"10.892320","distance":"0"},{...}]

My model and store:

Ext.regModel('Filiale', {
        fields: ['id', 'name', 'address', 'distance', 'lat', 'lng'],
});

var ListStore = new Ext.data.Store({
                        model: 'Filiale',
                        id: 'ListStore',
                        autoLoad: false,
                        fields:['name', 'address', 'distance'],
                        proxy: {
                            type: 'ajax',
                            url : 'htt开发者_开发问答p://example.com/getSomeJson.php',
                            reader: {
                                type: 'json'
                            }
                        },
                        listeners: {
                            load: function(){

                                ListStore.each(function(store){

                                        var newData = getDistance(store.data); // this function calculates the distance from currentLocation to the received address    
                                        console.log(newData); // i see a object in the console, with the correct calculated distance
                                        console.log(newData.distance); // this shows the old distance which is set to '0' in the databse
                                        //at this point i want to update the received records with the new distance, but the list always shows the old distance
                                    });

                                }



                        }

                    });

I don't understand, why the two console.logs show different values for the distance. Can anyone explain that to me ?

My List:

var listPanel = new Ext.List({
                title: 'ListStore',
                store: ListStore,
                id: 'addresslist',
                itemTpl: '<div class="contact">{name}, {address}, {distance}</div>',
                rendered: false,
                listeners: {
                    beforerender: function(){

                        ListStore.load();

                    }
                }

            });

my function to calculate the distance:

var getDistance = function(dataset){

        navigator.geolocation.getCurrentPosition(function(position){

            var start = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);

            //add current position marker to map
                var marker = new google.maps.Marker({
                    map: mapPanel.map,
                    position: start


                });



            var end = new google.maps.LatLng(dataset.lat, dataset.lng);
            var service = new google.maps.DirectionsService();
            var request = {
                origin: start,
                destination: end,
                travelMode: google.maps.DirectionsTravelMode.DRIVING
            };

            service.route(request, function(result, status){

                if (status == google.maps.DirectionsStatus.OK) {

                    dataset.distance = result.routes[0].legs[0].distance.value / 1000;



                }

            });


        }); 
        return dataset;

    };

And as i said, the distance is correctly calculated and the objects gets returned... but i'm unable to update the records in the store or the list...


I don't understand, why the two console.logs show different values for the distance. Can anyone explain that to me ?

Are You using Chrome? Chrome console sometimes has problems with up-to-date console data

And as i said, the distance is correctly calculated and the objects gets returned... but i'm unable to update the records in the store or the list...

Records in the store in Your script are always up-to-date - in JS obejcts are passed by reference, so You don't even have to return newData - store object will be updated automatically

Just after adding some values to store type:

listpanel.refresh()

to load current store to list

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜