How to keep expanded state of Accordion items
4. April 2008 – 14:48One of the possible solutions is:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 | <!-- vim: ts=2:sw=2:nu:fdc=2:spell Keeping Expanded State of Accordion Item Example @author Ing.Jozef Sakáloš @copyright (c) 2008, by Ing. Jozef Sakáloš @date 4. April 2008 @version $Id$ @license example.html is licensed under the terms of the Open Source LGPL 3.0 license. Commercial use is permitted to the extent that the code/component(s) do NOT become part of another Open Source or Commercially licensed development library or toolkit without explicit permission. License details: http://www.gnu.org/licenses/lgpl.html --> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <link rel="stylesheet" type="text/css" href="../ext/resources/css/ext-all.css"> <link id="theme" rel="stylesheet" type="text/css" href="empty.css"> <link rel="stylesheet" type="text/css" href="../css/icons.css"> <link rel="stylesheet" type="text/css" href="../css/application.css"> <link rel="shortcut icon" href="../img/extjs.ico"> <script type="text/javascript" src="../ext/adapter/ext/ext-base.js"></script> <script type="text/javascript" src="../ext/ext-all-debug.js"></script> <script type="text/javascript"> Ext.BLANK_IMAGE_URL = '../ext/resources/images/default/s.gif'; Ext.state.Manager.setProvider(new Ext.state.CookieProvider()); Ext.onReady(function(){ var p = new Ext.Panel({ title: Ext.fly('title').dom.innerHTML ,renderTo: Ext.getBody() ,layout: 'accordion' ,width:400 ,height:400 ,defaults: { stateEvents: ["collapse","expand"] ,getState:function() { return {collapsed:this.collapsed}; } } ,items:[{ stateId:'first' ,title:'First' ,html: 'First' },{ stateId:'second' ,title:'Second' ,html: 'Second' }] }); }); </script> <title id="title">Keeping Accordion Item Expanded State</title> </head> <body> </body> </html> <!-- eof --> |
