1. #1
    Sencha User tf.alves's Avatar
    Join Date
    Feb 2010
    Location
    Portugal
    Posts
    54
    Answers
    3
    Vote Rating
    0
    tf.alves is on a distinguished road

      0  

    Default Answered: Adding a different item to the end of a list

    Answered: Adding a different item to the end of a list


    Hi everyone,

    Is there a way to add, to an already populated list, a different item, either with another template, or by manually adding a container or component?

    Thanks.

  2. Quote Originally Posted by tf.alves View Post
    Thanks for the help
    No problem! I have done something like this before:

    Code:
    Ext.DomHelp.insertAfter(someEl, {
        tag : 'div',
        html : new Ext.XTemplate('.....').apply({.....})
    });

  3. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,344
    Answers
    3541
    Vote Rating
    847
    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


    If you want to add an item to the end of a List then add an item to the Store.

    If you aren't wanting that, then you will need to create your own element and add it to the end of the list manually. I would check out the Ext.DomHelper#insertAfter method for this.
    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.

  4. #3
    Sencha User tf.alves's Avatar
    Join Date
    Feb 2010
    Location
    Portugal
    Posts
    54
    Answers
    3
    Vote Rating
    0
    tf.alves is on a distinguished road

      0  

    Default


    Quote Originally Posted by mitchellsimoens View Post
    If you want to add an item to the end of a List then add an item to the Store.

    If you aren't wanting that, then you will need to create your own element and add it to the end of the list manually. I would check out the Ext.DomHelper#insertAfter method for this.
    I'll check the DomHelper Documentation then.

    I can't just simply add an item to the store because it would use the template associated with the list.
    The new item I want to add would be something like a button that could be used to show more items, kind of like pull to refresh, but in the bottom of the list.

    Thanks for the help

  5. #4
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,344
    Answers
    3541
    Vote Rating
    847
    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


    Quote Originally Posted by tf.alves View Post
    Thanks for the help
    No problem! I have done something like this before:

    Code:
    Ext.DomHelp.insertAfter(someEl, {
        tag : 'div',
        html : new Ext.XTemplate('.....').apply({.....})
    });
    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.

  6. #5
    Sencha User tf.alves's Avatar
    Join Date
    Feb 2010
    Location
    Portugal
    Posts
    54
    Answers
    3
    Vote Rating
    0
    tf.alves is on a distinguished road

      0  

    Default


    Thanks, I'll try that ASAP!

    Do you know if there is anything like "push to refresh" plugin that can be used in the bottom of a list? Or even if you can apply this same plugin this way?

  7. #6
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,344
    Answers
    3541
    Vote Rating
    847
    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


    Quote Originally Posted by tf.alves View Post
    Thanks, I'll try that ASAP!

    Do you know if there is anything like "push to refresh" plugin that can be used in the bottom of a list? Or even if you can apply this same plugin this way?
    There is the ListPagingPlugin that is usually used in conjunction with the pull to refresh.
    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.

  8. #7
    Sencha User tf.alves's Avatar
    Join Date
    Feb 2010
    Location
    Portugal
    Posts
    54
    Answers
    3
    Vote Rating
    0
    tf.alves is on a distinguished road

      0  

    Default


    You're right!!! I had already that piece of code when I was trying out the plugin and I hadn't notice! Silly me!

    Thank you once again, you're really coming across as a personal savior!

    Ps.: I marked the Dom answer as the correct answer to this thread because of the ambiguity of my question.

  9. #8
    Sencha User
    Join Date
    Oct 2014
    Posts
    1
    Vote Rating
    0
    mustafaml is on a distinguished road

      0  

    Default Example needed

    Example needed


    I'm new to Sencha (2.4) and trying to implement the answer in this thread.

    // launch function of my controller
    launch: function() {
    Ext.DomHelper.append(this.getListView().getContentEl(), {
    tag : 'ul',
    html : new Ext.XTemplate('Add a new option').apply({})
    });
    },

    I've verified that this.getListView() returns a correct reference to my Ext.List component. But this.getListView().getContentEl() is NULL. Should I even be calling getContentEl() ?


    An actual example to add a custom item to a list with Ext.DomHelper would be much appreciated.

Thread Participants: 2