Tuesday, September 30, 2008

[jQuery] Re: jquery code works with firefox but not ie.

I tried the code without ajax. It works in firefox but not in ie. I modelled my code on this example from the sitepoint jquery ajax tutorial. 

<html>
<head>
<title>AJAX with jQuery Example</title>
<script type="text/javascript" src="jquery-1.2.6.pack.js"></script>
<script type="text/javascript">
$(document).ready(function(){
timestamp = 0;
 
updateMsg();
$("form#chatform").submit(function(){
$.post("backend.php",{
message: $("#msg").val(),
name: $("#author").val(),
action: "postmsg",
time: timestamp
}, function(xml) {
$("#msg").empty();
addMessages(xml);
});
return false;
});
});
function addMessages(xml) {
if($("status",xml).text() == "2") return;
timestamp = $("time",xml).text();
$("message",xml).each(function(id) {
message = $("message",xml).get(id);
$("#messagewindow").prepend("<b>"+$("author",message).text()+
"</b>: "+$("text",message).text()+
"<br />");
});
}
function updateMsg() {
$.post("backend.php",{ time: timestamp }, function(xml) {
$("#loading").remove();
addMessages(xml);
});
setTimeout('updateMsg()', 4000);
}
</script>
<style type="text/css">
#messagewindow {
height: 250px;
border: 1px solid;
padding: 5px;
overflow: auto;
}
#wrapper {
margin: auto;
width: 438px;
}
</style>
</head>
<body>
<div id="wrapper">
<p id="messagewindow"><span id="loading">Loading...</span></p>
<form id="chatform">
Name: <input type="text" id="author" />
Message: <input type="text" id="msg" />    
<input type="submit" value="ok" /><br />
</form>
</div>
</body>
</html>

This code works in both firefox and ie. I can't figure out what I am doing differently that makes my code not work with ie. 

On Tue, Sep 30, 2008 at 12:53 PM, Eric <estrathmeyer@gmail.com> wrote:

I'm a little concerned by this line:
client = $("client",data).get(id);

I'd recommend putting a "var" in front so that you have a local, not a
global, variable.
It also seems to me like $("client",data).get(id) is equivalent to
'this' inside the each.

so instead of: client = $("client",data).get(id);
use:  var client = this;

I've never tried to use jQuery with IE and XML data, so I'm not sure
what quirks might be caused by that combination.

I would recommend trying your function without the AJAX call:
var data = insert_your_xml_here;
$("client",data).each(function(id) {
                       client = $("client",data).get(id);
                       $("#left_items").append("<li id='"+$
("id",client).text()+"'><a
href='#'>"+$("name",client).text()+"</a></li>");
               });

If none of that helps, I'd recommend installing Firebug, and doing
some heavy console logging ( http://getfirebug.com/console.html ),
specifically of the variable 'client'.



On Sep 30, 12:14 pm, "silk.odyssey" <silkodys...@gmail.com> wrote:
> I have the following code that works in firefox and google chrome
> using jquery 1.2.6.
>
> function setUpClient()
> {
>         $.post("http://localhost/gestivov2/include/ajax/getclients.php", {},
>         function(data){
>         $('#left_items').empty();
>                 //alert(data);
>                 $("client",data).each(function(id) {
>                         client = $("client",data).get(id);
>                         $("#left_items").append("<li id='"+$("id",client).text()+"'><a
> href='#'>"+$("name",client).text()+"</a></li>");
>                 });
>         })
>
> }
>
> It doesn't work with internet explorer 7, 8 beta nor 6. If I uncomment
> the alert code, the xml data gets displayed so it looks like the code
> within the each block is not being executed. What am i doing wrong?

No comments: