2012-07-17 3 views
0

JSONP를 사용하여 목록을로드하는보기를 만들려고하지만 사용자가 selectfield에서 값을 선택하면 목록을 다시로드하려고합니다. 내 코드 :Sencha Touch 2 목록 새로 고침

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' 
         } 
        } 
       } 
      } 
     ] 
    } 
}); 

내 두 번째 질문은이 : 위치 정보가 왜 작동 응용 프로그램은 크롬에서 실행되지만 때 어떤 생각을 가지고는 기본적으로 장치에서 실행되는 경우, 위치 정보 나던 작품. 코드 :

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.'); 
     } 

답변

0

질문 1의 경우, 난 그냥 선택의 변화에 ​​목록 구성 요소의 저장소를 다시로드합니다. 이 설치 방법으로 목록을 통해 목록 구성 요소의 저장소에 액세스해야합니다. 예를 들어, 변경 이벤트에 : (당신이 MVC 형식으로 개발하는 경우)

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 

} 

이상적 추상 매장 및 응용 프로그램 수준에서이를 등록해야합니다. 저장소를 추상화하면 Ext.getStore ('MyStore')를 호출 할 수 있습니다. load(); 애플리케이션의 어느 곳에서나 사용할 수 있습니다.

질문 2와 같이, 네이티브 셸에서 응용 프로그램을 래핑하면 내 경험에 따라 HTML5 geolocation이 작동하지 않습니다. PhoneGap (http://docs.phonegap.com/en/1.9.0/cordova_geolocation_geolocation.md.html#Geolocation)

과 같은 도구를 사용하여 기본 GPS 호출에 대한 다리를 만들어야합니다. 도움이 되었기를 바랍니다.

+0

유감스럽게도 귀하의 기능을 실행하려고하면 콘솔에 오류가 표시됩니다. : 잡히지 않은 TypeError : 정의되지 않은 'getStore'메서드를 호출 할 수 없습니다. – kmb