1. #1
    Sencha User sandrosss's Avatar
    Join Date
    Mar 2012
    Location
    Salvador-BA, Brazil
    Posts
    4
    Vote Rating
    0
    sandrosss is on a distinguished road

      0  

    Default Unanswered: Add items to List with ajax proxy store

    Unanswered: Add items to List with ajax proxy store


    Hello everyone,


    I am facing the following problem:


    I have a component of type 'Ext.dataview.List' within a 'Container'. This list is loaded by ajax proxy store.


    When I do an insert, sending data to the server that are saved in the database, and then I need to add it in the list. Other users can insert a new record in the database, and update my list when necessary to bring these new entries to add.


    An important detail is that these lists are very large, and can not hold a reload of the whole store, just need to pick what is new.


    How to add the result of these new items on my list?


    I've made several attempts with methods related to the component 'Ext.dataview.List', 'Ext.data.Store' and 'Ext.data.proxy.Proxy' present in the documentation sencha touch 2.1.


    Do you have any suggestions?

    Below is the code:

    Model:
    Code:
    Ext.define('MyApp.model.News', {
        
        extend: 'Ext.data.Model',
        
        config: {
            
            fields: [
                {name: 'id',  type: 'integer'},
                {name: 'title',  type: 'string'},
                {name: 'description',  type: 'string'}
            ]
        }
    });
    Store:
    Code:
    Ext.define('MyApp.store.News', {
        
        extend: 'Ext.data.Store',
        config: {
    
    
            model: 'MyApp.model.News',
            autoLoad: false,
            sorters: 'id',
    
    
            proxy: {
                type: 'ajax',
                url: 'http://mydomain.com/news/',
                
                reader: {
                    type: 'json',
                    rootProperty: 'response.news'
                }
            }
        }
    });
    View: (only part of the list)

    Code:
    var tplNews = new Ext.XTemplate(
    
    
        '<div>',
    
    
            "<img src='{[values.photo]}' width='35px' height='35px' style='float: left;' />",
    
    
            '<p style="font-weight: bold; font-size: 11px; margin-left: 40px;">{title}</p>',
    
    
            '<p style="color: #555; font-size: 14px; margin-left: 40px; padding-top: 5px">{description}</p>',
    
    
        '</div>'
    
    
    );
    
    
    ( more code...)
    
    
    {
      xtype   : 'list',
      store   : 'News',
      itemTpl : this.tplNews,
      itemId  : 'newsList',
      tplWriteMode: 'insertAfter',
      scrollToTopOnRefresh: false,
      scrollable: true,
      style   : 'margin-bottom: 5px;',
    
    
      listeners: {
    
    
          initialize: function(){
              MyApp.app.newsList = this;
          },
    
    
          painted: function(){
              MyApp.app.newsList.getScrollable().getScroller().scrollToEnd();
          }
      }
    }
    Controller (only the part in question)
    Code:
       onLoadItems: function (list, index, element, record) {
    
    
            var news = Ext.getStore('News');
    
    
            news.getProxy().setExtraParams({
                myID : window.localStorage.getItem('myID'),            
                lastID : 0  //0 to first load
            });
    
    
            news.load();
    
    
            Ext.Viewport.setActiveItem({
                xtype: 'newsview'
            });
        },
    Last edited by sandrosss; 21 May 2013 at 9:25 AM. Reason: Added more details

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,525
    Vote Rating
    871
    Answers
    3564
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    So all you want to do is load the new records? Have you looked at the PullRefresh plugin? It doesn't do a store.load when you pull down but it can load new records, it creates an Operation instance and loads it separately and then stitches together the response.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User sandrosss's Avatar
    Join Date
    Mar 2012
    Location
    Salvador-BA, Brazil
    Posts
    4
    Vote Rating
    0
    sandrosss is on a distinguished road

      0  

    Default


    I know the plugin and even already use on a part of my app, but in this case I think it will not be useful.


    Using this plugin, there is some form of updates occur automatically? Without a pull from the user?


    What I'm trying to make a chat, where users can send messages and the message list will be updated with new content.


    I appreciate the response.