Menu
I have a web page consisting a JQuery UI Tabs widget. Tab widget loads the tabs via AJAX. In one of the tab pages (name it DescriptionPage), I have a form which will be submitted via ajaxForm plugin.
<div id="tabs">
<ul>
<li>
<a href="DescriptionPage">Description Page</a>
</li>
</ul>
</div>
This is content of my DescriptionPage.
<form id="myForm">
<!-- Form elements goes here -->
</form>
<script>
$(function(){
$('#myForm').ajaxForm(function (response) {
$('#myForm').parent().empty().append(response);
});
});
</script>
After form is submitted, the same DescriptionPage is returned, both the form and script. So the form content is replaced with the response of the server side. The response also contains validation messages.
The problem is, The whole scenario works well in Chrome and Firefox. But in Internet Explorer 8, a strange issue happens.
When the tab is first loaded, the javascript is successfully executed. When user submits the form and the response is put, IE fails to execute my javascript, saying "JQuery is not defined".
Why IE fails to call JQuery inside the content loaded via ajax? Is there a workaround?
P.S: I thought seperating the script from html, but it is not an option at all :(
P.S2: My javascript and CSS files became a mess because of stupid IE.
598
This seems to work for me in Internet Explorer 6:
index.html:
<html><head></head><body>
<div id="container"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script src="jquery.form.js"></script>
<script>
jQuery('#container').load('DescriptionPage.html');
</script>
</body></html>
DescriptionPage.html:
<form id="myForm">
<input type="submit" />
</form>
<script>
$(function() {
$('#myForm').ajaxForm(function(response) {
$('#myForm').parent().empty().append(response);
});
});
</script>
Please refer to : jQuery 1.6.1 , IE9 and SCRIPT5009: '$' is undefined
User id "Black" has provided the right direction for me.
I was uploading by using .AjaxForm on a dialog. after that, I replace that Form, with another AjaxForm. Then I had a bug with "$ is undefined", or "jQuery is undefined" The main reason is I applied "render :layout => false" for the second Dialog. That's why all the js library (include jQuery ) have not been loaded properly.
So that, on the partial of the Second Dialog, I have to add.
26
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
