title: Loading content dynamically (panels) in an Ext Js Viewport
body: <p>Well basically im looking on this problem, i have many components with dinamic stuff that is written in the server side with PHP. </p>
  
  <p>Depending on the user my components will change, based on the role of the user.</p>
  
  <p>So i need to know any ways/examples/info on how to do this. </p>
  
  <p>1- I used the load function EXTJS has, but it clearly says i wont load script only plain text.</p>
  
  <p>2- i used eval() but im a bit scared o this approach, like this example crate layout component (static)</p>
  
  <pre><code>var contentPanel = new Ext.Panel({
                  frame: true,
                  style: {marginTop: '10px'},
                  height: 315,
                  border: true,
                  bodyBorder: false,
                  layout: 'fit',
                  id: 'contentPanel'
              });
  
  
              var mainPanel = new Ext.Panel({
                  title: 'Panel Principal',
                  id: 'mainPanel',
                  border: true,
                  frame: true,
                  width: '50%',
                  style: {margin: '50px auto 0 auto'},
                  height: 400,
                  renderTo: Ext.getBody(),
                  items: [
                          {
                              html: '&lt;a href="#" onClick="requestContent(\'panel1\');"&gt;Panel 1&lt;/a&gt;'
                          },
                          {
                              html: '&lt;a href="#" onClick="requestContent(\'panel2\');"&gt;Panel 2&lt;/a&gt;'
                          },
                          contentPanel
  
                  ]
              })
  </code></pre>
  
  <p>and update the content of the layout with js files written on the server</p>
  
  <pre><code>function receiveContent(options, success, response)
          {
  
  
  
              var respuesta = response.responseText;
  
              //console.log(respuesta);
  
              eval(respuesta);
  
              //console.log(options.url);
  
              url = options.url;
  
              url = url.substring(0,(url.search(/(\.)/)));
  
              var contenedor = Ext.getCmp('contentPanel');
  
              contenedor.removeAll();
  
              var contenido = Ext.getCmp(url);
  
              contenedor.add(contenido);
              contenedor.doLayout();
          }
  
          function requestContent(panel)
          {
              //panel es el nombre del archivo que quiero
              Ext.Ajax.request({
                  url: panel+'.js',
                  callback: receiveContent
              });
          }
  </code></pre>
  
  <p>any other way for this to be done, what i DONT want to do is making a million different components and load them ALL at login time like many people seem to say</p>