Some weird problem changing elements properties and ajax
Hi,
I'm using the jQuery form plugin and SimpleModal plugin and I'm having
a little problem that I don't understand why it's happening. As my
understanding in the whole thing, this shouldn't be happening and I
can't understand why.
The thing is, I show a blue popup while the page is loading, it shows
on document ready and it hides on window load. Then, you submit a form
and the form is submitted by ajax so there is a request and response.
On the request I show a blue popup saying the form is submitted and it
remains there until the server responds and the ajax response is
fired, when it does, the popup will be red and show an error message
(when there are errors of course). Then, we close the popup manually.
Then, you click refresh or leave the page, I also added the same popup
saying the page is loading, this I've done on window onbeforeunload.
Now, the problem is on the last popup described. For all the popups
(the html elements are the same) I simply swap css colors and content
of the elements when needed. However, for the last popup, I didn't
change anything and my best guess is that it should have remained with
the colors from the error popup and it's message cause it was the last
on to be show and so, the html elements have the properties from the
las popup. However, the popup is blue and it shows the text messages
from the popup that is displayed on the ajax request.
Ok, this might sound a little confused so I built a demo that you can
take a look here:
http://nazgulled.clok.info/test/admin/
It's filled with alert()'s along the way to explain what's happening
and where is the problem. Just view the source code of the page,
everything is inline (besides the jQuery lib and it's plugins).
Please help me out on this, I need to understand why this is happening
so I can continue my project and develop it accordingly...