PDA

View Full Version : Save state Accordion from jsakalos



franckxx
7 Nov 2007, 1:54 AM
Hi,

sorry for my english,

I use the Accordion from jsakalos and i would like to save state in a cookie, but i don't know how to...

Can everybody help me ?

My html :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title> </title>
<link rel="stylesheet" type="text/css" href="../extjs/resources/css/ext-all.css">
<link rel="stylesheet" type="text/css" href="./accordion.css">
<script type="text/javascript" src="../extjs/adapter/yui/yui-utilities.js"></script>
<script type="text/javascript" src="../extjs/adapter/yui/ext-yui-adapter.js"></script>
<script type="text/javascript" src="../extjs/ext-all.js"></script>
<link rel="stylesheet" type="text/css" href="accordion.css">
<script type="text/javascript" src="Ext.ux.InfoPanel.js"></script>
<script type="text/javascript" src="Ext.ux.Accordion.js"></script>
</head>
<body>
<table width="300" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>


<div id="acc-ct" style="width:false;height:300px;border:1px solid silver">
<div id="panneau 1">
<div>Panneau 1</div>
<div>
<div class="text-content">Contenu du panneau 1</div>
</div>
</div>
<div id="panneau 2">
<div>Panneau 2</div>
<div>
<div class="text-content">Contenu du panneau 2</div>
</div>
</div>
<div id="panneau 3">
<div>Panneau 3</div>
<div>
<div class="text-content">Contenu du panneau 3</div>
</div>
</div>
<div id="panneau 4">
<div>Panneau 4</div>
<div>
<div class="text-content">Contenu du panneau 4</div>
</div>
</div>
<div id="panneau 5">
<div>Panneau 5</div>
<div>
<div class="text-content">Contenu du panneau 5</div>
</div>
</div>
</div>

</td>
</tr>
</table>

<script type="text/javascript" src="accordion.js"></script>
</body>
</html>

My JS :

// Ext Accordion Application

Ext.BLANK_IMAGE_URL = '../images/default/s.gif';

Ext.onReady(function() {
// create accordion
var acc = new Ext.ux.Accordion('acc-ct', {
fitHeight: true
})

// create panel 1
var panel1 = acc.add(new Ext.ux.InfoPanel('panneau 1', {
}));

// create panel 2
var panel2 = acc.add(new Ext.ux.InfoPanel('panneau 2', {
}));

// create panel 3
var panel3 = acc.add(new Ext.ux.InfoPanel('panneau 3', {
}));

// create panel 4
var panel4 = acc.add(new Ext.ux.InfoPanel('panneau 4', {
}));

// create panel 5
var panel5 = acc.add(new Ext.ux.InfoPanel('panneau 5', {
}));
});

// end of file

Thx for your help.

fay
7 Nov 2007, 2:05 AM
Take a look at Saki's Extension post (http://extjs.com/forum/showthread.php?t=6388) and you'll see that he implemented State Management back in RC 1 (http://extjs.com/forum/showthread.php?t=6388&p=33794). If you follow the download instructions from his demo site (http://aariadne.com/accordion/accordion.html) search accordion.js for state and you'll see how it's done - basically set the keepState config option to true in your accordion, and use Ext.ux.AccordionManager.restoreState();

franckxx
7 Nov 2007, 2:52 AM
hello fay,

Thanks for your help...

I go to try (again), the first time without success...