My Octopress Blog

A blogging framework for hackers.

When Working With Ext JS, Pay Attention to the Cookies

We use Ext Js as our main Javascript library at Fundspire. There’s a couple of really cool features we use a lot. One is the GridPanel. It gives you a nice looking ‘table’ with sorting, column resizing, etc. There are also some interesting ways to make multiple ‘panes’ in your application. One example being the border layout. (The layout browser shows all the layouts pretty well) A good example is the official ‘forum example’ from Ext Js: http://dev.sencha.com/deploy/dev/examples/forum/forum.html I’m still relatively new to the framework, but have been able to do some interesting things with it. After a couple more months I hope to write up a more detailed review.

I’ve been working with a lot of these components this week and was having a lot of trouble manipulating the column and border size defaults. My changes just didn’t seem to have an impact. We use jawr, which renames the javascript when there’s changes to force a reload, so that wasn’t the issue. It turns out that the border and column size information is stored in a cookie on the user’s browser! It’s something that’s easily setup via an Ext Js CookieProvider Once you have a cookie provider setup, your state across a lot of components is saved automatically. Which, if you think about it is pretty slick. If someone is using a smaller monitor they can change the sizes to be what they want and not have to worry about it again. However, I went down a lot of rabbit holes when my changes didn’t appear to be having an affect, and I haven’t seen this behavior documented anywhere in the Api docs for the components I’m using. I knew we were saving state in cookies, but didn’t realize that it included these components automatically. So, if you’re using Ext Js and your layout changes don’t appear to be having an effect, make sure that it’s not storing a cookie to save that information.