Results 1 to 4 of 4

Thread: How to use ifrmae id in extjs

  1. #1
    Sencha User
    Join Date
    Oct 2010
    Location
    Chandigarh (INDIA)
    Posts
    143

    Default How to use ifrmae id in extjs

    Hello I am using a iframe in one of the tab panels as shown in the code below now my requirement is i want to increase the height of iframe on selecting one of the options from the context menu....(beacuse the form that will open in frame is greater then the height of iframe........)
    PHP Code:
    IFRAME CODE
    workflowTab 
    = new Ext.TabPanel({
                    
    enableTabScroll true,
                    
    allowDomMove true,
                    
    renderTo 'parentTab1',
                    
    deferredRender true,
                    
    animCollapse true,
                    
    frame true,
                    
    draggable false,
                    
                    
    items : [ {
                        
    title 'Edit/Check In    ',
                        
    html '<iframe id= "edit" style="width:100%;height:352px" frameborder = "0"  src="''myfileStatus.jsp"></iframe>',--//in this jsp i am using js whose required code is given below
                        
    contentEl 'myFilesTab2'
                    
    }]
                }); 
    PHP Code:
    function CheckInPopUp() {
    var 
    a=parent.document.getElementById('edit');//---here i am workin and try to find out if there is set height method in frame or not....--------//
    debugger;
        var 
    recordtoedit grid.getSelectionModel().getSelected();
        var 
    contentID recordtoedit.get("id");
        var 
    docID_revLbl document.getElementsByName("chk_" contentID)[0].value
                
    .split(",");
        var 
    docID docID_revLbl[0];
        var 
    revLbl docID_revLbl[1];
        var 
    panelContent;
        var 
    assets "myassets";
        var 
    folder recordtoedit.get("foldername");
        var 
    folderid recordtoedit.get("folderid");
        var 
    button Ext.get('Check-in');
        
    vachkids vachkids 1;
        
    chkinpopwin = new Ext.Window({
            
    // applyTo:'help-win',
            
    title 'Check-In Revision Details',
            
    layout 'fit',
            
    closable false,
            
    id 'chkindetailsid' vachkids,
            
    // closeAction : 'hide',
            
    width 500,
            
    height 350,
            
    modal true,
            
    border false,
            
    html '<iframe scrolling="no" style="width:100%;height:100%;overflow:hidden;" frameborder = "0"  src="CheckinPopup.jsp?contentID='
                    
    contentID
                    
    '&documentID='
                    
    docID
                    
    '&myassets='
                    
    assets
                    
    '&folder='
                    
    folder
                    
    '&folderid='
                    
    folderid
                    
    +  '"></iframe>',
            
    plain true,
            
    constrain true,
            
    buttons : [{
                        
    text 'CLOSE',
                        
    handler : function() {
                            
    Ext.getCmp('chkindetailsid' vachkids).close();

                        }
                    }]
        });
        
    chkinpopwin.show();

    Attached Images Attached Images

  2. #2
    Ext JS Premium Member dj's Avatar
    Join Date
    Mar 2007
    Location
    Germany
    Posts
    573

    Default

    I'm not quite sure what you want to do but an iframe can be styled as any other HTML-Element. So setting the height of an iframe can be done via CSS or with Ext.Element's setHeight.
    Code:
    Ext.get('iframe-id').setHeight(newHeight);
    Working with iframes it can be tricky to get the reference to the correct window (and document) object (as all iframes have their own). So changing the height programmatically might just be difficult because of that. Looks like you have a nasty iframe nesting going one there. So you probably have to go up the iframe hierarchy. Assuming your JavaScript gets executed in the innermost iframe this should change the height of the outer iframe:
    Code:
    function getDoc(iframe) {
        if (iframe.contentDocument) return iframe.contentDocument;
        if (iframe.contentWindow) return iframe.contentWindow.document;
        return iframe.document;
    }
    Ext.fly(getDoc(parent.parent).getElementById('edit')).setHeight(1000);
    I tend to avoid iframes where I can because of the window-confusion.
    Daniel Jagszent
    [email protected]??gsze?t.de <- convert to plain ASCII to get my email address

  3. #3
    Sencha User
    Join Date
    Oct 2010
    Location
    Chandigarh (INDIA)
    Posts
    143

    Default

    thanx d.j i will try all these methods

  4. #4
    Sencha User
    Join Date
    Oct 2010
    Location
    Chandigarh (INDIA)
    Posts
    143

    Default

    its working man thanx..........

Similar Threads

  1. Passing arguments -- Refer Extjs In action book and ExtJs sample code
    By mrag74 in forum Ext 3.x: Help & Discussion
    Replies: 1
    Last Post: 28 Apr 2011, 2:11 PM
  2. [How-2] Como crear una ventana con extJS (how to create an extJS window)
    By michelrods in forum Ext 2.x: Help & Discussion
    Replies: 1
    Last Post: 5 Jan 2009, 3:03 PM

Posting Permissions

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