jws2bay
asked on
.html() in Ajax Works in Firefox, not in IE
I thought all was good until I tested my page in IE. I am using ajax to build a set of dynamic dependent select boxes. I have built up a test case to study the problem. The ajax is returning the correct data both in Firefox and in IE. It seems the
statement does not work in IE. It clears the options, but doesn't load in the new values. I have searched the web, but I haven't found the solution. Here is a link to my test case. Run it in Firefox and then run it in IE.
http://99.65.72.66/support_test.php
Thanks in advance
This is the code:
$("#Suplft").html(data);
statement does not work in IE. It clears the options, but doesn't load in the new values. I have searched the web, but I haven't found the solution. Here is a link to my test case. Run it in Firefox and then run it in IE.
http://99.65.72.66/support_test.php
Thanks in advance
This is the code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script type="text/javascript">
var reload="Yes";
function init(){
depth.value="12";
$("#depth").trigger("change");
$("#Sup_lft").trigger("refresh")
}
</script>
<script type="text/javascript">
$(document).ready(function(){
$("#depth").change(function(){
var depth=$("#depth").val();
var group="C140_";
$.ajax({
type:"post",
url:"support_get.php",
data:{depth: depth, group: group},
success:function(data){
alert(data);
$("#Suplft").html(data); // THIS LINE ISN'T WORKING IN IE
if (reload=="Yes") {$("#Sup_lft").val("b 6.0 314.74 364.74 140_18_12_Open");
// alert("reload=yes");
reload="No";
}
}
});
});
});
</script>
</head>
<body onLoad="init()">
Depth :
<select name="depth" id="depth">
<?php
include "support_db.php";
$result=mysql_query("SELECT Category,Series,Glass_Support,Finish,Key_2 FROM Form_Content WHERE Category='Depth' and Series='CRY140-2'");
while($depth=mysql_fetch_array($result)){
echo "<option value=$depth[Key_2]>$depth[Finish]</option>";
} ?>
</select>
Support :
<select name="Suplft" id="Suplft">
<option>-Select Support-</option>
</select>
</body>
</html>
That works just fine in IE for me if I use <option>Hello</option> as the contents of support_get.php, so it's likely some malformed HTML content (maybe some PHP errors or warnings) coming back from the page that IE isn't understanding.
ASKER
Here is support_get.php
<?php
include "support_db.php";
$depth=$_POST["depth"];
$group=$_POST["group"];
$result=mysql_query("selec t Display_Name,Key_3 FROM Products where Pri_Group = '$group' AND Sec_Group='Lft' AND Key_1='$depth' ORDER BY Sort_Index ASC");
while($Sup_lft=mysql_fetch _array($re sult)){
echo"<option value='$Sup_lft[Key_3]'>$S up_lft[Dis play_Name] </option>" ;
}
?>
<?php
include "support_db.php";
$depth=$_POST["depth"];
$group=$_POST["group"];
$result=mysql_query("selec
while($Sup_lft=mysql_fetch
echo"<option value='$Sup_lft[Key_3]'>$S
}
?>
ASKER
I left up the alert to show what was being returned. I don't know how the data is supposed to look like. I can just see something is coming back.
Remove the extraneous comments from the ajax response - its not valid HTML
ASKER
Gary
I'm not sure what you are referring to. Can you elaborate.
I'm not sure what you are referring to. Can you elaborate.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Gary,
Just made the changes. Looks good.
I really appreciate the help.
Just made the changes. Looks good.
I really appreciate the help.