Sencha Touch 2 List Reload

Question

我想创建使用JSONP加载列表的视图，但我想在用户从selectfield中选择一个值时重新加载列表。 我的代码：

var distance = 50; 

Ext.define('MyApp.view.ListUpdate', { 
    extend: 'Ext.Container', //Ext.navigation.View 
    xtype: 'listUpdate', 
    requires: [ 
     'Ext.dataview.List', 
     'Ext.data.proxy.JsonP', 
     'Ext.data.Store', 
     'Ext.field.Select' 
    ], 
    config: { 
     style: ' background-color:white;', 
     layout: 'vbox', 
     items: 
     [ 
      { 
       xtype: 'toolbar', 
       docked: 'top', 
       title: 'List update', 
       minHeight: '60px', 
       items: [ 
        { 
         ui: 'back', 
         xtype: 'button', 
         id: 'backButton', //taki sam id jak w view.GdzieJestem 
         text: 'Back', 
        }, 
        { 
         minHeight: '60px', 
         right: '5px', 
         html: ['<img src="resources/images/myImage.png"/ style="height: 100%; ">',].join(""), 
        }, 
       ],   
      }, 
      { 
       xtype: 'fieldset', 
       title: 'Choose distance', 
       items: [ 
        { 
         xtype: 'selectfield', 
         id: 'selectField', 
         options: [ 
          {text: '50km', value: 50}, 
          {text: '100km', value: 100}, 
          {text: '150km', value: 150}, 
          {text: '200km', value: 200}, 
          {text: '250km', value: 250}, 
          {text: '300km', value: 300}, 
          {text: '350km', value: 350}, 
          {text: '400km', value: 400}, 
          {text: '450km', value: 450}, 
          {text: '500km', value: 500}, 
          {text: '550km', value: 550}, 
          {text: '600km', value: 600}, 
         ], 
         listeners: { 
          change: function (select, newValue, oldValue) { 
           // console.log('change', newValue.data.value); 
           console.log(Ext.getCmp('selectField').getValue()); 
           distance = Ext.getCmp('selectField').getValue(); 
          } // change 
         } // listeners 
        } 
       ] 
      }, 

      { 
       xtype: 'list', 
       style: ' background-color:white;', 
       itemTpl: '<h2>{company}, {firstName} {lastName}</h2><p> <span style="color:blue;">{city}, {street}, tel: {telephoneNumber},&nbsp; </span><span style="color:orange;"> odległość: {distance}km</span></p>', 
       flex: 1, 
       store: { 
        autoLoad: true, 
        fields : ['company', 'firstName', 'lastName', 'city', 'street', 'telephoneNumber', 'distance'], 
        proxy: { 
         type: 'jsonp', 
         url: 'http://192.168.1.15:8080/MyServer/agents/list?userLat='+lat+'&userLon='+lon+'&distance='+distance+'', 
         reader: { 
          type: 'json', 
          rootProperty: 'agents' 
         } 
        } 
       } 
      } 
     ] 
    } 
}); 

我的第二个问题是：你有什么想法，为什么地理位置工程时，应用程序在Chrome中运行，但是当它在设备上本地运行，地理位置不工作。 代码：

var lat = 0; 
var lon = 0; 

     if (navigator.geolocation) { 

      navigator.geolocation.getCurrentPosition(
       function (position) { 
        console.log(position.coords.latitude); 
        console.log(position.coords.longitude); 
        lat = position.coords.latitude; 
        lon = position.coords.longitude; 
        //Ext.Viewport.setActiveItem(Ext.create('Proama.view.WyszukajAgenta')); 
       }, 

       function (error) 
       { 
        switch(error.code) 
        { 
         case error.TIMEOUT: 
          alert ('Timeout'); 
          break; 
         case error.POSITION_UNAVAILABLE: 
          alert ("Postition unavailable"); 
          break; 
         case error.PERMISSION_DENIED: 
          alert ('Permission denied'); 
          break; 
         case error.UNKNOWN_ERROR: 
          alert ('Unknown error'); 
          break; 
        } 
       } 
      ); 
     } 
     else { 
      alert('Problem with device.'); 
     } 

Answer 1

问题1，我只想重新加载列表组件的商店选择更改。你有这种设置的方式，你将需要通过列表访问列表组件的商店。例如，在更改事件：

change: function(select, newValue, oldValue){ 
    var items = select.getParent().getParent().getItems(); // access parent's parent's items 
    var list = items[1]; // list is the second item in the parent's 
    list.getStore().load(); // reload the list's store 

} 

理想情况下，你应该抽象的商店，并在应用层面进行注册（如果你是在MVC格式开发）。随着商店的抽象，你可以调用Ext.getStore（'MyStore'）。load（）;应用程序中的任何位置

至于问题2，当您将应用程序包装在本地shell中时，根据我的经验，HTML5地理位置不起作用。您需要使用PhoneGap这样的工具搭建本地GPS呼叫的桥梁（http://docs.phonegap.com/en/1.9.0/cordova_geolocation_geolocation.md.html#Geolocation）

希望这会有所帮助。