If I understand it, XmlHttpRequest allows manipulating data after the page has loaded. E.g. I can show a button and when the user clicks it a javascript function can use the object to retrieve the MOTD and place it somewhere in the page.

How would I go having it working in different browsers? Does each one have it's own way to create the object and interact with it?

I found that for IE it'svar req = new ActiveXObject("Microsoft.XMLHTTP");

Note that some of that code is a little specific for my project. I'm talking about that check that makes sure no other request can be made until data was received from the previous request. In your project you will probably want to change this...

[FMC Studios] - [Caries Field] - [Ctris] - [Pman] - [Chess for allegroites]Written laws are like spiders' webs, and will, like them, only entangle and hold the poor and weak, while the rich and powerful will easily break through them. -AnacharsisTwenty years from now you will be more disappointed by the things that you didn't do than by the ones you did do. So throw off the bowlines. Sail away from the safe harbor. Catch the trade winds in your sails. Explore. Dream. Discover. -Mark Twain

See, now those are good tutorials. They just give you the facts, plain and simple. I really hate it when they pad the tutorial with a bunch useless crap to "ease" the learning process. It just makes it so you have to sift through it all to really get anything done... the whole world should think exactly like I do!>:(

[edit]Although I must agree with the second tutorial that the first tutorial may not have had the best code examples.

The face of a child can say it all, especially the mouth part of the face.

Note that some of that code is a little specific for my project. I'm talking about that check that makes sure no other request can be made until data was received from the previous request. In your project you will probably want to change this...

I was in a hurry when I posted that reply, I didn't closely look at the code. Now I do, I'll keep the checking part.

In short, in the webpage there's a <select> with a single <option>, which says "Select a province", when the button is clicked I want that <option> to be deleted (which works) and then the five <option>s in the xml to be added there (which doesn't work, keeps saying 'interface not supported' on the appendChild() line)

I still have to integrate the browser check, will do it when it all works

You cannot add a node from one document into another. You need to import it (importNode ?), but of course IE6 doesn't support that.

The whole "AJAX" name is a joke. No one seriously uses XML with it. It's really "AJAJ" or "AJAH". Look for what's known as "JSON". It's basically a way to convert XML like data into a string that represents a JavaScript object.

Yes, I was going to say the same thing as Matthew, but was too busy watching football. You will rarely want to handle XML in JS as JSON is so much easier and more convenient and has more support. Even if your source data is XML, it is much easier to convert it to JSON on the server and then just use eval() in JS than it is to manipulate XML in JS.

The only times you want to check the user agent string with JS is if a certain browser has a glitch that you need to work around. For example, I check for the literal string "Safari" on the dynamic combobox widget because Safari does not support CSS system colors, so I have to provide default colors.

That is the only future compatible method. If I were to check for features, I might get the detection wrong if another browser matches it or Safari changes functionality. (Obviously if they ever fix this problem, then I would need to add a version check as well.)

Of course it does. The server serves plain text. This text can be interpreted on client side as you wish, either as XML or JSON or anything else. On the server you just create a string containing JSON code, write it to the response object and that's it. I only know ASP, but I suppose it's similar in othe server side scripting languages. You just do something like

It may seem like overkill at first, but it becomes quite nice when you have a very dynamic response to build. Plus, it automatically handles converting UTF-8 encoded strings to proper JS escapes (eg, "\u00A9").

Server-side, generates js that will add the new <option>s to the <select>

1

db_query("SELECT codice, nome FROM comuni WHERE codprovincia={$provincia} ORDER BY nome");

2

3

header("Content-type: text/javascript");

4

5

echo "options = new Array(";

6

7

if($res = db_getresult_byrow())

8

echo "\n ".

9

"new Array({$res['codice']}, \"{$res['nome']}\")";

10

11

while($res = db_getresult_byrow())

12

echo ",\n ".

13

"new Array({$res['codice']}, \"{$res['nome']}\")";

14

15

echo "\n);\n\n";

16

17

echo "for(i = 0; i < options.length; i++)\n";

18

echo " {\n";

19

echo " option = document.createElement(\"option\");\n";

20

echo " select.options.add(option);\n";

21

22

echo " option.value = options<i>[1];\n";

23

echo " option.innerHTML = options<i>[1];\n";

24

echo "}\n";

While the code isn't 100% fixed (I still have issues alternatively in IE and FF ), when the query returns few rows it generates the whole script, but if the rows are many the script gets broken (I saw this by replacing eval() with alert() in the client-side script

An example is attached (couldn't resist to try the new upload thing )

Quote:

As long as you are waiting for readyState == 4, everything will be there.

db_query("SELECT codice, nome FROM comuni WHERE codprovincia={$provincia} ORDER BY nome");

8

9

header("Content-type: text/javascript");

10

11

echo "options = new Array(";

12

13

if($res = db_getresult_byrow())

14

echo "\n ".

15

"new Array({$res['codice']}, \"{$res['nome']}\")";

16

17

while($res = db_getresult_byrow())

18

echo ",\n ".

19

"new Array({$res['codice']}, \"{$res['nome']}\")";

20

21

echo "\n);\n\n";

22

23

echo "for(i = 0; i < options.length; i++)\n";

24

echo " {\n";

25

echo " option = document.createElement(\"option\");\n";

26

echo " select.options.add(option);\n";

27

28

echo " option.value = options<i>[0];\n";

29

echo " option.innerHTML = options<i>[1];\n";

30

echo "}\n";

31

32

?>

But it keeps failing (output is truncated) if the query returns too many rows. I have no idea about what to do, I can't understand why readyState becomes 4 before the script ends its output.

I also tried to put every js piece in a variable and echo that only at the end: same result.

I don't think it's a timeout issue, because it all ends in 1-2 seconds. I don't even understand why there are those boxes in the generated javascript (long.png in my post above), alert() doesn't have troubles with accented letters.

[edit]

I changedeval(req.responseTEXT);toeval(req.responseText);

and now it works in FF (it does wait for the whole data, while IE still doesn't ). But I have another issue to add select.remove(i);is not working