Results 1 to 6 of 6

Thread: ChildBrowser / open external url without leaving app?

  1. #1

    Default ChildBrowser / open external url without leaving app?

    I am developing my first sencha touch app. One of my requirements is to have some links in the sencha app that point to external urls, and we want the external docs to open in a window that is still part of the current app (as opposed to delegating to Safari). Many apps that I have used as a user do this successfully, so I know it can be done. Typically, the link is clearly in the app, but when the user clicks on it, they are presented the content in a separate window that has a "Done" or "Close" action, they can continue to navigate within the document that is displayed, or hit the Done/Close and return to where they were in the app.
    However, I am not sure if those apps were developed with Sencha. When I googled for "external url" etc, I found some threads about using an iframe, but I don't think this leads to the effect I am looking for, as those threads all discussed the problem with scrolling within the iframe.
    Then I found some threads that mentioned a Phonegap plugin called ChildBrowser. Reading up on that plugin, it seems like that is probably what I have experienced as a user, and would like to build into my app.
    So I have several related questions:
    1) Is the phonegap ChildBrower plugin the BEST way to do what I am trying to do? Or is there a Sencha Touch specific solution that I am missing?
    2) Does Sencha Touch 2.0 plan to provide something that has not yet been released?
    3) If phonegap ChildBrowser is the way to go, this basically pushes me in the direction of using Phonegap and CT 2.0 which seems unfortunate as I was hoping to use the native packager from CT and avoid the additional Phonegap layer. My only targets are android and ios.

    Opinions appreciated?

  2. #2
    Sencha User rdougan's Avatar
    Join Date
    Oct 2008


    You will need to use a plugin in PhoneGap, something like the ChildBrowser. There is no other way to do this otherwise.

    Sencha does have the native packager in the SDK Tools 2 beta, but there is no external browser support at this time.
    Sencha Inc.
    Robert Dougan - @rdougan
    Sencha Touch 2 and Ext JS 4 Core Team Member, SASS/Theming Wizard.

  3. #3


    thanks for the quick reply.

  4. #4

    Default what about an iframe?

    I tryed to do that with an iframe in a card, and it worked pretty well.
    The only thing that I am missing, is to successfully resize the iframe.
    It resizes fine on chrome, but not on my ipad.

    The div id mask is used to capture the touch event and scroll.
    This is still some WIP as I stoped working on it when the resizing was not working on my Ipad.

    PHP Code:
    Ext.getCmp('detail').setHtml('<div style="position:relative;">
    <iframe  id="iframe" src="'
    +note.get('link')+'" width="100%" height="1000px">Your device does not support iframes.</iframe>
    <div id="mask" style="position:absolute; top:0; left:0;height:768px;width:1024px"></div></div>'
    x=document.getElementById('iframe');                                                                                        var m=document.getElementById('mask');                        
    y= (x.contentWindow || x.contentDocument);                        
    x.onload = function(){                               
    //alert( );                                
    var m=document.getElementById('mask');                                
    y= (x.contentWindow || x.contentDocument);                                
    if (
    //x.width = w;                            h;                                
    //alert( );                                
    Ext.getCmp('detail').height y.body.offsetHeight ;                                Ext.getCmp('detail').doLayout();                            

  5. #5
    Sencha User
    Join Date
    Jul 2012



    Can you guide me how to use PhoneGap Plugin in Sencha Touch. I am trying to use ChildBrowser plugin.

    I followed some .. but getting error like this "TypeError: Object #<Object> has no method 'exec'"

    Also please point me where I can get stable version PhoneGap.js and Plugin JS.


  6. #6


    Check the video tutorials on here. Pretty good stuff !!!

Posting Permissions

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