jquery - Javascript loading incorrectly in firefox -
first, apologies reads this. i've run fair number of js issues, , intractable i've ever seen. i'll best give clear description, may have revise it.
i have next page loading within inline frame in sugarcrm:
<head> <link rel="stylesheet" href="style/style.css" /> </head> <body> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> <script type="text/javascript" src="js/index_controller.js"></script> <table class="form_text" style="width: 100%; height: 100%;" cellpadding="5"> <tr> <td><iframe id="map_frame" style="width: 100%; height: 100%; overflow-y: hidden; border: solid 1px #dddddd" scrolling="no" src="map.php?<?php foreach ( $_request $key => $value ) { echo $key . "=" . $value . "&"; }?>"></iframe> </td> ... </td> </tr> </table> </div> <script type="text/javascript"> parent.$("iframe").each(function(iel, el) { if(el.contentwindow === window) { var to_remove = $(el).parent().prev(); $(to_remove).remove(); $(el).css("border", "none"); } }); $(document).ready(function(){ updatemap(); }); </script> </body> and in iframe in page, have this:
<head> <link rel="stylesheet" href="style/style.css" /> <!--[if lte ie 8]> <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.4/leaflet.ie.css" /> <!--[endif]--> <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.4/leaflet.css" /> <script src="js/jquery-1.9.1.js"></script> </head> <body> <script type="text/javascript" src="../include/dashletcontainer/containers/dcmenu.js"> </script> <script type="text/javascript" src="js/arraylist.js"></script> <script type="text/javascript" src="js/custom_map_controls.js"></script> <div id="map" style="height: 100%"></div> <form action="../index.php" method="post" name="detailview" id="formdetailview"> <input type="hidden" name="module" value=""> <input type="hidden" name="record" value=""> <input type="hidden" name="return_action"> <input type="hidden" name="return_module"> <input type="hidden" name="return_id"> <input type="hidden" name="module_tab"> <input type="hidden" name="isduplicate" value="false"> <input type="hidden" name="offset" value="1"> <input type="hidden" name="action" value="editview"> <input type="hidden" name="sugar_body_only"> <input type="hidden" name="prospect_id" value=""> </form> <script type="text/javascript" src="js/map_icons.js"></script> <script type="text/javascript" src="js/map_controller.js"></script> <script src="js/leaflet-0.4.5.js"></script> </body> the leaflet-0.4.5.js script, when evaluated, creates globally available object known l, gives access leaflet mapping framework's functions. in map_controller.js, add together special features l.map, function creating actual map objects. works fine in chrome, , works fine in firefox when load page straight in browser tab. when load intended, in sugarcrm page within inline frame, error "l.insert function name here not defined" in js console. if refresh iframe without reloading entire sugarcrm page, map appears expected. i'm working around catching exception , forcing page reload when occurs, i'd know why happening in first place. i've rewritten map controller functions utilize l contained within $(document).ready() function (using jquery that) , tried putting leaflet script tag @ top of body on page it's supposed load, , still no luck.
your problem using $(document).ready on parent page.
that run html parser done parsing parent. it's reaching within iframe , depending on various scripts within iframe having been loaded, may not @ point yet. it's race between http response toplevel page , http responses scripts in subframe, basically.
the right way run initialization onload or @ to the lowest degree point domcontentloaded (which $(document).ready hooks into) has fired on child.
javascript jquery firefox leaflet
No comments:
Post a Comment