1. #11
    Sencha User
    Join Date
    Apr 2012
    Posts
    12
    Vote Rating
    0
    riskitforbiscuit is on a distinguished road

      0  

    Default


    Hi,
    I have just finished with my first mvc application with ST2. But i m facing challenges in Ux.layout.Accordion. I have copied the plugin file in my project folder, provided their paths in index.html but still getting errors like:

    http://127.0.0.1:8020/mitchellsimoen...69803722Failed to load resource: the server responded with a status of 404 (Not Found)

    http://127.0.0.1:8020/mitchellsimoen...69803722Failed to load resource: the server responded with a status of 404 (Not Found)

    http://127.0.0.1:8020/mitchellsimoen...69803723Failed to load resource: the server responded with a status of 404 (Not Found)


    Plz help me out!!! is there anything i m missing out. plz pardon my noobiness.

  2. #12
    Ext JS Premium Member boofman15's Avatar
    Join Date
    Nov 2011
    Location
    Atlanta, GA
    Posts
    20
    Vote Rating
    0
    boofman15 is on a distinguished road

      0  

    Default


    I have implemented this component and followed these steps:

    1. Placed the Accordion.js file in "Ux/layout/" folder at the root of my project files. So the path is "Ux/layout/Accordion.js"
    2. Added following to my index.html
    Code:
    <script type="text/javascript">
            Ext.Loader.setConfig({
                enabled: true,
                paths : {
                    Ux : 'Ux'
                }
            })
    
    
            Ext.require([
              'Ux.layout.Accordion'
            ]);
        </script>
    3. Implemented the accordion layout with the following code:
    Code:
    {
      xtype: 'container',
      id: 'myAccordion',
      layout  : {
        type : 'accordion',
        mode: 'MULTIPLE'
      },
      items: [
        //put items that will go in each accordion layer
      ]
    }

  3. #13
    Sencha User
    Join Date
    Apr 2012
    Posts
    12
    Vote Rating
    0
    riskitforbiscuit is on a distinguished road

      0  

    Default


    Quote Originally Posted by boofman15 View Post
    I have implemented this component and followed these steps:

    1. Placed the Accordion.js file in "Ux/layout/" folder at the root of my project files. So the path is "Ux/layout/Accordion.js"
    2. Added following to my index.html
    Code:
    <script type="text/javascript">
            Ext.Loader.setConfig({
                enabled: true,
                paths : {
                    Ux : 'Ux'
                }
            })
    
    
            Ext.require([
              'Ux.layout.Accordion'
            ]);
        </script>
    3. Implemented the accordion layout with the following code:
    Code:
    {
      xtype: 'container',
      id: 'myAccordion',
      layout  : {
        type : 'accordion',
        mode: 'MULTIPLE'
      },
      items: [
        //put items that will go in each accordion layer
      ]
    }
    Thnx a ton boofman, followed the steps and got it to show on my chrome browser.
    However some errors remain in the project:
    1. The list shown is not collapsible. It has opened in expanded mode with all the contents shown.
    2. The arrow for expanding/collapsing the content is not working. when i click over it, gives the following error

    Uncaught TypeError: Object [object Object] has no method 'getEl' Accordion.js:96


    I m again stuck at it with nowhere to go... plz help.

  4. #14
    Sencha User
    Join Date
    Apr 2012
    Posts
    12
    Vote Rating
    0
    riskitforbiscuit is on a distinguished road

      0  

    Default How to run Accordion layout in Sencha Touch 2.0

    How to run Accordion layout in Sencha Touch 2.0


    Can anybody here knows how to remove the error mentioned in the above post??
    I am really in need to implement it for my project or else i'll have to move to JQuery Mobile which i dont want to.

    The disclosure buttons are not working and throwing errors in Accordion.js file's getE1 method. Also how can i style the layout as i want to size the bars and have the bars with some other colors.

    Plz help me out!! There are many ppl in this forum who have successfully implemented it... guys plz help...

  5. #15
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,522
    Answers
    3447
    Vote Rating
    814
    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


    Just pushed a little update to make it work with 2.0.1 to remove the getEl warning.
    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. #16
    Sencha User
    Join Date
    Apr 2012
    Posts
    12
    Vote Rating
    0
    riskitforbiscuit is on a distinguished road

      0  

    Default Accordion Layout not working for items other than list

    Accordion Layout not working for items other than list


    Quote Originally Posted by mitchellsimoens View Post
    Just pushed a little update to make it work with 2.0.1 to remove the getEl warning.
    Hi mitchell, thnx for reply with a quick fix, but the problem seems to persist. In the source's index.js, if i put textfield/label as the last element of the layout, then this last element always remains expanded even when i click on disclosure. It doesn't show any error however. e.g

    Ext.create('Ext.Container', {
    fullscreen : true,
    layout : {
    type : 'accordion',
    mode : 'MULTI'
    },
    scrollable : 'vertical',
    items : [

    {
    title : 'List',
    height : 400,
    layout : 'fit',
    items : [
    {
    xtype : 'list',
    scrollable : {
    direction : 'vertical',
    directionLock : true
    },
    itemTpl : '<div class="contact">{firstName} <strong>{lastName}</strong></div>',
    store : {
    model : 'Contact',
    sorters : 'lastName',


    grouper : {
    groupFn : function(record) {
    return record.get('lastName')[0];
    }
    },


    data : [
    { firstName : 'Mitchell', lastName : 'Simoens' },
    { firstName : 'Rob', lastName : 'Dougan' },
    { firstName : 'Ed', lastName : 'Spencer' }

    ]
    }
    }
    ]
    },
    {
    title : 'Form',
    items : [
    {
    xtype : 'textfield',
    label : 'Test'
    }
    ]
    }
    ]

    But if i place a list element at the last then it works fine. Am i missing a trick here or is it a bug, Plz help.. TIA
    Last edited by riskitforbiscuit; 22 Apr 2012 at 4:33 AM. Reason: typo

  7. #17
    Sencha User
    Join Date
    Apr 2012
    Posts
    12
    Vote Rating
    0
    riskitforbiscuit is on a distinguished road

      0  

    Default Accordion Layout with Labels and images(inside panel) as its content elements

    Accordion Layout with Labels and images(inside panel) as its content elements


    Hi all,
    Looks like Mitchell is busy. So, have any of u guys tried making accordion with Labels(with html) and Images inside Accordion Layout panels.
    I have wasted a lot of effort in it, but cant get it to work. It works great as long as a list item is the last item in the layout, irrespective of whatever items i have put earlier to it. The moment i remove list item, make a layout with textfields/labels/images or any other elements, the last pane always remains open, doesn't collapse at all.

    I followed the example at:
    https://github.com/mitchellsimoens/Ux.layout.Accordion

    Please help me out!!!

  8. #18
    Sencha Premium Member intellix's Avatar
    Join Date
    Mar 2012
    Location
    UK + Malta
    Posts
    263
    Answers
    5
    Vote Rating
    18
    intellix will become famous soon enough

      0  

    Default


    thanks a million for this Mitchell. This is the sort of thing I need to figure out how to extend items like the layout. I was just on the ST 1.0 version and tried myself to change that with massive failure and I guess it would be extremely helpful to have in the Git readme that theres also a 2.0 version available

    Thanks, Dom

  9. #19
    Sencha Premium Member
    Join Date
    Aug 2011
    Posts
    168
    Answers
    1
    Vote Rating
    2
    GertBoers is on a distinguished road

      0  

    Default Change initial state to 'semi-expanded'

    Change initial state to 'semi-expanded'


    Right now when it opens for the first time, the last item is expanded.
    Is it possible to show part of all items at my homescreen and when an item is clicked, the other ones collapse as usual. I'll ad an image to clarify.

    Screen Shot 2012-05-29 at 13.43.25.jpg

    Left is my homescreen, once an item is clicked, the accordion should act normally. In this case item 2 was clicked.

    Any suggestions?

    Thanks

  10. #20
    Sencha Premium Member
    Join Date
    Aug 2011
    Posts
    168
    Answers
    1
    Vote Rating
    2
    GertBoers is on a distinguished road

      0  

    Default


    Or would it be better to try and do this with another kind of (standard) layout (if so, which one(s)) and some animations?

    Thanks