#1
  1. A Change of Season
    Devshed Loyal (3000 - 3499 posts)

    Join Date
    Mar 2004
    Location
    Next Door
    Posts
    3,400
    Rep Power
    221

    Load page with JS breaks the page :(


    Why doesn't this page scroll in iphone?

    ++++++++++

    Hi;

    Kicken helped me make this page load dynamic content.

    Without using JS and Iframe it looks good on iphone.

    But

    When I load it using Javascript, it doesn't scroll on iphone.

    What am I doing wrong?

    Thanks
    Last edited by English Breakfast Tea; April 9th, 2018 at 02:57 PM.
  2. #2
  3. Wiser? Not exactly.
    Devshed God 2nd Plane (6000 - 6499 posts)

    Join Date
    May 2001
    Location
    Bonita Springs, FL
    Posts
    6,229
    Rep Power
    4149
    I'd guess it has to do with you using an iframe. Take the content out of the iframe and it'd probably work ok.
    Recycle your old CD's



    If I helped you out, show some love with some reputation, or tip with Bitcoins to 1N645HfYf63UbcvxajLKiSKpYHAq2Zxud
  4. #3
  5. A Change of Season
    Devshed Loyal (3000 - 3499 posts)

    Join Date
    Mar 2004
    Location
    Next Door
    Posts
    3,400
    Rep Power
    221
    Originally Posted by kicken
    I'd guess it has to do with you using an iframe. Take the content out of the iframe and it'd probably work ok.
    What?

    Are you joking?

    I can't take it out of Iframe the whole system is based on that.
  6. #4
  7. A Change of Season
    Devshed Loyal (3000 - 3499 posts)

    Join Date
    Mar 2004
    Location
    Next Door
    Posts
    3,400
    Rep Power
    221
    I might try this.
    Last edited by English Breakfast Tea; April 9th, 2018 at 02:59 PM.
  8. #5
  9. Wiser? Not exactly.
    Devshed God 2nd Plane (6000 - 6499 posts)

    Join Date
    May 2001
    Location
    Bonita Springs, FL
    Posts
    6,229
    Rep Power
    4149
    Originally Posted by English Breakfast Tea
    Are you joking?
    No. I don't see any difference in using or not using an iframe within the context of your example there. Your page with the iframe is nothing but that iframe, so just get rid of the iframe and make it a normal page (you can still load the content via javasript)
    Recycle your old CD's



    If I helped you out, show some love with some reputation, or tip with Bitcoins to 1N645HfYf63UbcvxajLKiSKpYHAq2Zxud
  10. #6
  11. A Change of Season
    Devshed Loyal (3000 - 3499 posts)

    Join Date
    Mar 2004
    Location
    Next Door
    Posts
    3,400
    Rep Power
    221
    Originally Posted by kicken
    No. I don't see any difference in using or not using an iframe within the context of your example there. Your page with the iframe is nothing but that iframe, so just get rid of the frame and make it a normal page (you can still load the content via javascript)
    I forgot why we even used iframe to start with!

    I have to convert content.php to Codeigniter then.


    PHP Code:
    <?php 
    //Allow cross-origin requests 
    header('Access-control-allow-origin: *'); 

    $action = isset($_GET['action'])?$_GET['action']:null
    switch (
    $action){ 
        case 
    'load-template'
            
    DoLoadTemplate(); 
            break; 
        default: 
            
    DoDefault(); 

    exit;  

    function 
    DoDefault(){ 
        
    header('Content-type: text/javascript'); 

    ?>
    (function(window){ 
        var currentScript = document.currentScript; 
        var apiUrl = currentScript.src; 

        if (!('jQuery' in window)){ 
            loadJQuery(initialize); 
        } else { 
            initialize(); 
        } 

        function loadJQuery(cb){ 
            var script = document.createElement('script'); 
            script.src = 'https://code.jquery.com/jquery-3.3.1.min.js'; 
            script.type = 'text/javascript'; 
            script.addEventListener('load', cb); 
            document.getElementsByTagName('head')[0].appendChild(script); 
        } 

        function initialize(){ 
            var $currentScript = $(currentScript); 

            var params = $.param({ 
                action: 'load-template' 
                , launch_owner_email_hashed: $currentScript.data('launch_owner_email_hashed')
                , plc_id: $currentScript.data('plc_id') 
                , prospect_email: $currentScript.data('prospect_email') 
                , lt: $currentScript.data('lt') 
            }); 
            console.log(params);

            $.get(apiUrl, params).then(function(html){ 
                var div = $('<div>').html(html); 
                $currentScript.after(div); 
            }); 
        } 
    }(this)); 
    <?php 


    function 
    DoLoadTemplate()
        { 
            
    header('Content-type: text/html; charset=utf-8'); 
            
    $launch_owner_email_hashed htmlspecialchars($_GET['launch_owner_email_hashed']);
            
    $plc_id htmlspecialchars($_GET['plc_id']);
            
    $prospect_email htmlspecialchars($_GET['prospect_email']);
            
    $launch_type htmlspecialchars($_GET['lt']);
        
        if(
    $_SERVER['SERVER_ADDR']=="::1")
            {
                
    $root "http://local.site.com";
            }
        else 
            {
                
    $root "https://site.com";
            }
        if(
    $launch_type=='evergreen')
            {
                
    $lt "eg-launch";
            }
        else 
            {
               
    $lt "bc-launch"
            }    
        
    ?> 
    <iframe src="<?php echo $root.'/'.$lt.'/'.$launch_owner_email_hashed.'/'.$plc_id.'/'.$prospect_email;?>" style="position:fixed; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden; z-index:999999;">    
    </iframe>

    <?php ?>
  12. #7
  13. Wiser? Not exactly.
    Devshed God 2nd Plane (6000 - 6499 posts)

    Join Date
    May 2001
    Location
    Bonita Springs, FL
    Posts
    6,229
    Rep Power
    4149
    Basically what I'm getting at is that rather than having your JS call back to that script and get an iframe with another URL, just generate that URL directly and have the JS load that content into the page. I don't see any reason not to do that based on what I know so far about the situation.

    Code:
    <?php 
    //Allow cross-origin requests 
    header('Access-control-allow-origin: *'); 
    header('Content-type: text/javascript; charset=utf-8'); 
    
    if($_SERVER['SERVER_ADDR']=="::1"){
        $root = "http://local.site.com";
    } else {
        $root = "https://site.com";
    }
    
    ?>
    (function(window){ 
        var currentScript = document.currentScript; 
        var apiUrl = <?php echo json_encode($root); ?>; 
    
        if (!('jQuery' in window)){ 
            loadJQuery(initialize); 
        } else { 
            initialize(); 
        } 
    
        function loadJQuery(cb){ 
            var script = document.createElement('script'); 
            script.src = 'https://code.jquery.com/jquery-3.3.1.min.js'; 
            script.type = 'text/javascript'; 
            script.addEventListener('load', cb); 
            document.getElementsByTagName('head')[0].appendChild(script); 
        } 
    
        function initialize(){ 
            var $currentScript = $(currentScript);
            var lt = $currentScript.data('lt');
            var url = apiUrl 
                + '/' + ((lt==='evergreen')?'eg-launch':'bc-launch')
                + '/' + encodeURIComponent($currentScript.data('launch_owner_email_hashed'))
                + '/' + encodeURIComponent($currentScript.data('plc_id'))
                + '/' + encodeURIComponent($currentScript.data('prospect_email'))
            ;
            console.log(url);
    
            $.get(url).then(function(html){ 
                var div = $('<div>').html(html); 
                $currentScript.after(div);
            }); 
        } 
    }(this));
    You'll need to make sure that your script permits cross-origin requests by adding the same Access-control-allow-origin header as demonstrated above.
    Recycle your old CD's



    If I helped you out, show some love with some reputation, or tip with Bitcoins to 1N645HfYf63UbcvxajLKiSKpYHAq2Zxud

IMN logo majestic logo threadwatch logo seochat tools logo