Results 1 to 5 of 5

Thread: Adding existing div into Ext.Panel by id...

Hybrid View

Previous Post Previous Post   Next Post Next Post
  1. #1
    Touch Premium Member
    Join Date
    Jul 2010
    Posts
    36
    Vote Rating
    0
      0  

    Default Adding existing div into Ext.Panel by id...

    Hi all, I have some dynamically generated html code in a standard html div (jsp based) that I need to push into an ExtJS panel. Ideally i'd like to keep the jsp changes to a minimum but just 'move' the div when the page loads? Why do this? Well, i'm gradually rewriting the app in ExtJS but some pages will take longer than others so i'm just trying to give existing pages the 'ExtJS look' for consistency.
    I'm used to building up components but just not this way around?... Do i use the DomHelper or maybe use the add/insert methods of a panel or container etc? I realise i'm possibly make this harder than it needs to be and missing the obvious :/

    Thanks in advance.

  2. #2
    Sencha User
    Join Date
    Dec 2010
    Posts
    35
    Vote Rating
    0
      0  

    Default adding html page containing flot chart in extjs panel

    Hi,

    I want to add one html page which contains 'flot' chart which is a type of moving chart to my extjs panel. I am able to add simple html page but not page with flot chart in panel. Please help me out. Is it causing problem because extjs is not able to recognize flot library?? Please reply soon.

    Thanks.

  3. #3
    Sencha User
    Join Date
    Jul 2009
    Posts
    17
    Vote Rating
    0
      0  

    Default

    try this out javabee

    Code:
    var convertedDiv = new Ext.Panel({
        width: 400,
        height: 400,
        title: 'hello',
        items: [
        {
            xtype: 'container',
            id: 'jspcontainer',
            layout: 'fit'
        }
        ],
        listeners: {
            'afterrender': {
                scope: this,
                fn: function(cPanel){
                    var htmlel = Ext.getDom('idofjspdiv');
                    cPanel.get('jspcontainer').update(htmlel);
                }
            }
        }
    });
    Last edited by dkarso; 23 Dec 2010 at 7:39 AM. Reason: forgot the code end tag

  4. #4
    Sencha User
    Join Date
    Jun 2008
    Posts
    12
    Vote Rating
    1
      0  

    Default there is an easier way...

    Just use contentEl config
    Code:
    <html>
    <head><script type="text/javascript">function convert(){ var newShinyPanel = new Ext.Panel({ applyTo:'new-div', contentEl:'old-div' }); newShinyPanel.show();}</script></head><body onload="convert()"> <div id="my-new-shiny-div /> <div id='my-old-ugly-div' > <p> blah blah blah </p> </div>
    </body>

  5. #5
    Sencha User
    Join Date
    Jun 2008
    Posts
    12
    Vote Rating
    1
      0  

    Default sorry screwed up my earlier post....

    <html><head><script type="text/javascript">function convert(){ var newShinyPanel = new Ext.Panel({ applyTo:'new-div', contentEl:'old-div' }); newShinyPanel.show();}</script></head><body onload="convert()"> <div id="my-new-shiny-div /> <div id='my-old-ugly-div' > <p> blah blah blah </p> </div></body>

Similar Threads

  1. How to put an existing div into a panel?
    By stevej in forum Ext 2.x: Help & Discussion
    Replies: 3
    Last Post: 6 Aug 2011, 1:24 PM
  2. adding grid panel into an existing tab panel
    By mallik in forum Ext 2.x: Help & Discussion
    Replies: 5
    Last Post: 21 Aug 2008, 9:45 AM
  3. Right way to convert existing div to a panel
    By rwankar in forum Ext 2.x: Help & Discussion
    Replies: 2
    Last Post: 20 Mar 2008, 11:34 PM
  4. Transform existing div into panel?
    By arth in forum Ext 2.x: Help & Discussion
    Replies: 5
    Last Post: 14 Feb 2008, 11:49 AM
  5. Solved! Layer with panel constructed from existing div not working
    By rwankar in forum Ext 2.x: Help & Discussion
    Replies: 2
    Last Post: 8 Feb 2008, 3:33 AM

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •