jquery $.getJSON only works once in internet explorer Help Please!!!
- by JasperS
I have a php function which inserts a searchbar into each page on a website.
The site checks to see if the user has javascript enabled and if they do it inserts some jquery ajax stuff to link select boxes (instead of using it's fallback onchange="form.submit()").
$.getJSON works perfectly for me in other browsers except in IE, if I do a full page refresh (ctrl+F5) in IE my ajax works flawlessly until I navigate to a new page (or the same page with $PHP_SELF) either by submiting the form or clicking a link the jquery onchange function fires but then jquery throws an error:
Webpage error details
Message: Object doesn't support this property or method
Line: 123
Char: 183
Code: 0
URI: http://~#UNABLE~TO~DISCLOSE#~/jquery-1.4.2.min.js
It seems like jquery function $.getJSON() is gone???
This seems to be some kind of caching issue as it happens on the second page load but I think i've go all the caching prevention in place anyways, here's a snipet of the code that ads the jquery functions:
if (isset($_SESSION['NO_SCRIPT']) == true && $_SESSION['NO_SCRIPT'] == false)
{
$html .= '<script type="text/javascript" charset="utf-8">';
$html .= '$.ajaxSetup({ cache: false });';
$html .= '$.ajaxSetup({"error":function(XMLHttpRequest,textStatus, errorThrown) {
alert(textStatus);
alert(errorThrown);
alert(XMLHttpRequest.responseText);
}});';
$html .= '</script>';
$html .= '<script type="text/javascript" charset="utf-8">';
$html .= '$(function(){ $("select#searchtype").change(function() { ';
$html .= 'alert("change fired!"); ';
$html .= '$.getJSON("ajaxgetcategories.php", {id: $(this).val()}, function(j) { ';
$html .= 'alert("ajax returned!"); ';
$html .= 'var options = \'\'; ';
$html .= 'options += \'<option value="0" >--\' + j[0].all + \'--</option>\'; ';
$html .= 'for (var i = 0; i < j.length; i++) { options += \'<option value="\' + j[i].id + \'">\' + j[i].name + \'</option>\'; } ';
$html .= '$("select#searchcategory").html(options); }) }) }) ';
$html .= '</script> ';
$html .= '<script type="text/javascript" charset="utf-8"> ';
$html .= '$(function(){ $("select#searchregion").change(function() { ';
$html .= 'alert("change fired!"); ';
$html .= '$.getJSON("ajaxgetcountries.php", {id: $(this).val()}, function(j) { ';
$html .= 'alert("ajax returned!"); ';
$html .= 'var options = \'\'; ';
$html .= 'options += \'<option value="0" >--\' + j[0].all + \'--</option>\'; ';
$html .= 'for (var i = 0; i < j.length; i++) { options += \'<option value="\' + j[i].id + \'">\' + j[i].name + \'</option>\'; } ';
$html .= '$("select#searchcountry").html(options); }) }) }) ';
$html .= '</script> ';
}; return $html;
remember, this is part of a php funtion that inserts a script into the html and sorry if it looks a bit messy, I'm new to PHP and Javascript and I'm a bit untidy too :)
Please also remember that this works perfectly in IE on the first visit but after any navigation I get the error.
Thanks guys