If this is your first visit, be sure to
check out the FAQ by clicking the
link above. You may have to register or Login
before you can post: click the register link above to proceed. To start viewing messages,
select the forum that you want to visit from the selection below.

Dynamically loaded forms and the DOM

I'm trying to follow the AJAX paradigm to add to the user experience in my webgame. You can see it here, though only when my PC is on (which is during most of the day, central Europe time).

The first example of my problem is in the login form (and you still haven't even entered the site :-D ). My idea is to provide a popup that would either say "ok, you're logged in, wait while I redirect you" (and this works fine) or "invalid login, retry". In the latter case, I would put a new login form in the popup and let users retry from there.

I've coded a PHP script (login.php) that checks for the correct login information and sends back the outcome, in a basic XML document with two nodes: <ok> contains 1 if the login was successful, 0 otherwise; <output> contains the HTML that will be inserted in the popup div. Then the submit of the form is intercepted and the JS function is called.

The problem is that when I try to getElementById passing the id of a control of the form in the popup, it returns null, so the script crashes. This is why if you put in wrong login info in the popup you don't go past the "Checking..." part.

One week ago I thought I had fixed the problem. I was inserting the new form just by means of innerHTML. After learning that this does not update the DOM, I've searched around and found OptimalWorks' BetterInnerHTML, that takes a string (much like innerHTML) and traverses its XML tree to correctly update the DOM. It worked, then I must have changed something (I have no idea what though! I didn't touch that part any more) and now it doesn't work any more.

This is kind of important to me, since I would like to provide a lot of functionality in such popups. My game is a managerial game, so for example if you want to fire an employee you click on the "Fire" button, a popup asks for confirmation and for extra details, and then the actual firing is executed. I really don't want to have to do this with several different pages.

I would really appreciate it if someone gave me any kind of hint to solve this. It took me almost two days to figure out the last week, and now that I was relying on the thing to work the problem is really driving me nuts. Thanks to anyone who even takes the time to just look at it!

UPDATE. I've found out what it was. For the sake of the little bit of reputation I grew here last summer, I won't explain what it was. Just know it was trivial...

Last edited by Sk#; August 15th, 2008 at 07:43 AM.

I owe Paul McKenzie a pizza.

I am no expert; but they say I can make concepts easy to understand. That's why newbies questions are mine!!! XD