Hello Guys,
I'm very new to Ext.
I have been trying something for the past 2/3 days and doesn't seem to be working out.

This is what im trying to achieve:
Create a Viewport using border layout.
Then load the contents of a jsp page in the center panel. But things doesn't work well.

Following is the code

Create a Viewport using border layout
Code:
function buildPage() {
var viewport = new Ext.Viewport({
  title: 'Main App',
  layout: 'border',
   items: [{
      title: 'Main Content',
      region: 'center',
      margins: '5 5 0 0',
      width: 400,
      autoLoad: {url: 'content.jsp'}
   }]});
}
Ext.onReady(buildPage);
now to content.jsp

HTML Code:
<head>
<script src="/js/extjs/adapter/ext/ext-base.js"></script>
<script src="/js/extjs/ext-all.js"></script>
<script src="/js/content.js"></script>
<link rel="stylesheet" type="text/css" href="/resources/css/ext-all.css">
</head>
now content.js

Code:
buildContent= function(){
        return [
            new Ext.Panel({
            title: 'Panel 1',
            collapsible:true,
            renderTo: document.body,
            width:200,
            })
        ];
}

Ext.onReady(buildContent);
Basically im trying to load the contents of content.jsp in the center panel...
This doesn't seem to work...
Am I missing something here...
Any help would be appreciated..

Thanks in Advance..
Prabhu