Hybrid View

  1. #1
    Ext JS Premium Member
    Join Date
    Aug 2010
    Location
    Essen, Germany
    Posts
    2
    Vote Rating
    0
    ManuelDziuba is on a distinguished road

      0  

    Question window.open() from toolbar button opens window, from list item a new tab??

    window.open() from toolbar button opens window, from list item a new tab??


    Hello to all,

    I have to open a new window (Safari Tab) from Javascript (Handler).
    I have a item from a list-component with a handler and a toolbar button with the same handler:

    Code:
    handler: function() {
      window.open(MY_URL);
    }
    When I click on the list item, the browser generates a new tab (I use Chrome for testing). But when I click on the toolbar button, not a new tab is generated but a new window openes without toolbar, menubar, statusbar and so on...). Isn't it crazy?

    Then I researched the forum. Some people also had the problem, that they need to open a new tab with Javascript... Then I added a hidden link to my html:

    Code:
    <a href="" target="_blank" id="hidden_link" style="display:none;"></a>
    and changed my handler (of both the list item and the toolbar button) to:

    Code:
    handler: function() {
      var link = Ext.getDom('hidden_link');
      link.href = 'http://www.sencha.com'/; // only in this example ;)
      var clickevent = document.createEvent('Event');
      clickevent.initEvent('click', true, false);
      link.dispatchEvent(clickevent);
    }
    ... but also: List Item works fine, the toolbar button ALSO CREATES A NEW WINDOW ???
    WHAT'S THAT?? From where this behavior comes??

    [ on my iPhone the toolbar button doesn't works, the list item does!]

    Thanks for any ideas!
    Manuel

  2. #2
    Sencha Touch Premium User
    Join Date
    Oct 2010
    Location
    Portland, Maine USA
    Posts
    66
    Vote Rating
    1
    gordonjl is on a distinguished road

      1  

    Default


    The window.open issue is a real problem for smart phones. For the record: window.open() fails on an iPhone because of Safari's popup blocker functionality. It works if you disable it in Safari's settings on the iPhone. It's highly doubtful that folks will have popup blocking disabled.

    I took your above code to fix my problem, thanks for it. I don't have a secondary window opening up, but that may be because I only have one element in my page accessing the hidden link. Sorry that I can't help you with that.

    For posterity, here's the fix:

    First, put a hidden link tag in your index.html page:

    Code:
    <body>....
      <!-- Goofy hack to get around pop-up blocking in smart phones. -->
      <a href="" target="_blank" id="hidden_link" style="display:none;"></a>
    ....
    I created a function in app.js like so:

    Code:
    openLinkInNewWindow: function(url){
    
    //awful hack to avoid pop-up blocking by smart phone browser.
    
    var link = Ext.getDom('hidden_link'),
    clickevent = document.createEvent('Event');
    
    link.href = url;
    
    clickevent.initEvent('click', true, false);
    link.dispatchEvent(clickevent);
    }
    then call it from my various panels like so:



    Code:
    ....
     defaults:{xtype:'button',ui:'plain',iconAlign:'left',style:'color:white'},
                        items:[
                            {
                                text:'View Website',
                                icon:'public/resources/images/web_ico.jpg',
                                handler: function() {
                                  MyApp.openLinkInNewWindow(this.record.get('website'));
                                },
                                scope:this
    
    
                            },....

  3. #3
    Sencha User
    Join Date
    Aug 2011
    Posts
    62
    Vote Rating
    0
    slmd is on a distinguished road

      0  

    Default


    Thx for this code, it works perfect

  4. #4
    Touch Premium Member
    Join Date
    May 2011
    Location
    Norfolk & DC
    Posts
    100
    Vote Rating
    5
    epiphanydigital is on a distinguished road

      4  

    Default A more elegant way of doing the same thing really...

    A more elegant way of doing the same thing really...


    Code:
    Ext.util.openLink = function(href) {
      var link = document.createElement('a');
      link.setAttribute('href', href);
      link.setAttribute('target','_blank');
      var clickevent = document.createEvent('Event');
      clickevent.initEvent('click', true, false);
      link.dispatchEvent(clickevent);
      return false;
    }
    Add this somewhere in your app code, then call it like...

    Ext.util.openLink('http://www.google.com');
    twitter.com/epiphanydigital #sencha #drupal #jquery #craftbeer #guitar #photography

  5. #5
    Sencha User
    Join Date
    May 2012
    Posts
    3
    Vote Rating
    0
    Uptaker is on a distinguished road

      0  

    Default


    [QUOTE=epiphanydigital;776479]
    Code:
    Ext.util.openLink = function(href) {
      var link = document.createElement('a');
      link.setAttribute('href', href);
      link.setAttribute('target','_blank');
      var clickevent = document.createEvent('Event');
      clickevent.initEvent('click', true, false);
      link.dispatchEvent(clickevent);
      return false;
    }
    This helped me A LOT. I can now open a new window in my Smartphone. THANK YOU!

  6. #6
    Sencha User
    Join Date
    Mar 2011
    Posts
    39
    Vote Rating
    3
    Rhoover is on a distinguished road

      0  

    Default


    Quote Originally Posted by epiphanydigital View Post
    Code:
    Ext.util.openLink = function(href) {
      var link = document.createElement('a');
      link.setAttribute('href', href);
      link.setAttribute('target','_blank');
      var clickevent = document.createEvent('Event');
      clickevent.initEvent('click', true, false);
      link.dispatchEvent(clickevent);
      return false;
    }
    Add this somewhere in your app code, then call it like...

    Ext.util.openLink('http://www.google.com');
    Thank you very much, works like a charm!!! even with a slight tweak to work inside your control.js:

    PHP Code:
    Ext.define('MyApp.controller.MainControl', {
        
    extend'Ext.app.Controller',

        
    config: {

            
    refs: {
                
    news'newsview'
            
    },

            
    control: {
                
    'newsview #twitteroutbutton': {
                    
    tap'exitToTwitter'
                
    }
            }
        },

        
    exitToTwitter: function() {
            
    twitterLink = function(href) {
                var 
    link document.createElement('a');
                
    link.setAttribute('href'href);
                
    link.setAttribute('target','_blank');
                var 
    clickevent document.createEvent('Event');
                
    clickevent.initEvent('click'truefalse);
                
    link.dispatchEvent(clickevent);
                return 
    false;
                },
                
    twitterLink('http://twitter.com/yourname');
        }


    }); 

Similar Threads

  1. [OPEN] [CLOSED] Window that opens child Window - Field loses focus immediately
    By jonjanisch in forum Ext GWT: Bugs (2.x)
    Replies: 3
    Last Post: 10 Sep 2009, 9:10 AM
  2. Replies: 0
    Last Post: 7 Aug 2009, 11:11 AM
  3. Replies: 7
    Last Post: 15 May 2009, 2:57 AM
  4. open Ext.Window from a toolbar button
    By arthurakay in forum Ext 2.x: Help & Discussion
    Replies: 1
    Last Post: 7 Oct 2008, 10:35 AM

Thread Participants: 7

Tags for this Thread

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..."