Hi there,
I've got a page that has navigation tabs, with each tab linked to a
specific div (divs made visible by the click of the tab).
The divs themselves are populated by load statements - a PHP file is
fed an input code, and returns an HTML stream which then gets plonked
in the div. Each time the code input changes, each div's PHP scripts
is run in turn and all 5 divs are repopulated with content pertaining
to the new input code.
One of the divs has a child div that contains a SWF; at present the
entire structure works exactly as I want, but the SWF is slow and fat
(as SWFs are). I want to replace the SWF with a jqplot element.
The problem is that there is no 'click' event (or other event) that
can be used to trigger a 'live' instantiation of jqplot on this
(dynamically-populated) child div. Once the PHP script has run, it's
just 'there'. My attempts to get the jqplot element to insert itself
have been pathetic, to say the least.
So the following code is in my footer (after the script tag for
jquery): as you can see, all I am trying to do at this stage is target
the #chart1 and #chart2 divs (both which are added within the content
populated into #summDiv when /includes/StockFullSum.php is run).
If I put a breakpoint within doTheChart(), the breakpoint triggers (so
the function is being activated) but nothing happens to either #chart
div. Furthermore, the breakpoint occurs before #summDiv is populated
(evidenced by the fact that loading.gif is still displaying).
There is something I'm missing - it's clear that doTheChart has to be
delayed until AFTER #summDiv's content is fully loaded: how can that
be achieved? More to the point, why don't I get an error telling me
that I'm trying to do stuff to an elements that doesn't exist (yet)?
Cheerio
GT
problem script appears below....
<script type="text/javascript">
$(document).ready(function() {
$("ul.tabs").tabs("div.panes > div");
var asxcode= '<?php echo $ASXCode; ?>';
if(asxcode!=='')
{
dotheFirst(asxcode);
}
});
$("#hitThat").click(function() {
var thisCode=$("#getCode").val();
dotheFirst(thisCode);
});
function dotheFirst(z) {
$("#summDiv").html('<center><img style="margin-top:70px;" src="<?
php echo $siteURL; ?>/WIP/loading.gif" /></center>');
$("#summDiv").load("<?php echo $siteURL; ?>/includes/
StockFullSum.php", {ASXCode:z});
doTheChart();
doTheRest(z);
}
function doTheRest(t){
$("#fundDiv").load("<?php echo $siteURL; ?>/includes/
StockFundSum.php", {ASXCode:t});
$("#techDiv").load("<?php echo $siteURL; ?>/includes/
StockTechSum.php", {ASXCode:t});
$("#sensDiv").load("<?php echo $siteURL; ?>/includes/
StockSensSum.php", {ASXCode:t});
$("#optDiv").load("<?php echo $siteURL; ?>/includes/
StockOptSum.php", {ASXCode:t});
$("#newsDiv").load("<?php echo $siteURL; ?>/includes/
StockNewsSum.php", {ASXCode:t});
}
function doTheChart(){
$("#chart2").hide(); ;
$("#chart1").show()
.css("background-color","blue");
};
</script>
