Thanks for the suggestion ... The original problem wasn't that the <script>
wasn't running - rather it was never inserted in the DOM by MSIE.
A pseudocode format of the original page before the AJAX call is:
<body>
<div>
</div>
<!-- more html content -->
</body>
For whatever reason, when AJAX is used to load HTML inside the <div> so that
the resulting page looks like:
<body>
<div>
<div>
<script>
<!-- script content -->
</script>
<!-- html content -->
</div>
</div
<!-- more html content -->
</body>
... -IE 6.x does not add the script to the DOM, and thus never runs. (Yet
another IE bug?) If I change the returned HTML so that the resulting page looks
like:
<body>
<div>
<div>
<!-- html content -->
</div>
<script>
<!-- script content -->
</script>
</div>
<!-- more html content -->
</body>
... then the <script> is added to the DOM, and runs properly. :-)
________________________________________
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]
Sent: September 8, 2006 3:50 PM
To: jQuery Discussion.
Subject: Re: [jQuery] Problems with embedded scripts
The script is running before the submit button is created, and as a result is
trying to attach the click event to an element that doesn't exist. You should
wrap the code in
$(function(){ .... }); (== $(document).ready(function() { .... }); )
So that it gets run once the document has finished loading.
Blair
On 9/9/06, Lewis, David <[EMAIL PROTECTED]> wrote:
I'm creating a web application that uses jQuery to populate a series of
<div/>s in an HTML page using AJAX. All the JavaScript libraries and
some "global" scripting is linked in the <head/> of the HTML document.
Within the HTML <div/>s that are returned via AJAX, jQuery scripts that
are specific to the contents of the <div/> are included. For example:
<div class="panel">
<script type="text/javascript">//<![CDATA[
$('#report-submit').click(function() {
$('#report-form').ajaxSubmit(function() {
$('#tab-pane-charts').load('test_charts.jsp', function()
{
activateTab('#tab-pane-container', 5);
});
});
});
//]]></script>
<h1>Reports</h1>
<form id="report-form" action="ajax" method="post">
<input type="text" name="chart_value" value="Test chart value"
/>
<input type="button" id="report-submit" value="Chart it!"/>
</form>
</div>
The advantage of keeping the scripts in the returned HTML is that the
script can be generated by the server "on the fly", based on the
contents of the other HTML in the <div/>. The script runs nicely with
Firefox 1.5 but MSIE 6 completely ignores it. When I use the IE DOM
Explorer (part of the DevToolBar:
http://go.microsoft.com/fwlink/?LinkId=71881), the script does not
appear in the DOM. Does anyone have suggestions how I can include the
script as part of the returned HTML such that it will work with IE.
Thanks in advance for your help!
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/
