Design to CSS plus Ajax contact form, etc.
So did I mention that I started one of them CSS & XHTML services over at Design to CSS? Sorry if I didn't. I feel like CSS is the only thing I'm good at and I ought to offer that skill to others. Anyway, I spent hours today working on a really complicated contact form for that site. The idea was to use Javascript and PHP-cookie-timestamp checking to prevent spam, and since I was already requiring Javascript, to use Ajax for the form submission and response. I figured it would be a good chance to put my jQuery experience to some use and learn something new too. It took a long time because the jQuery documentation and tutorials are a bit sparse, but at the same time that was a good thing because I had to think about what I was doing and not just copy-paste.
The final product combined some PHP code with jQuery and some code from the jQuery forms plugin, and the whole lot wouldn't have been possible without Safer Contact Forms Without CAPTCHA’s and Form Submission ajaxSubmit(). The final solution is not bad. When Javascript is not available, a message sharing my e-mail address is visible so people can still contact me. With Javascript available, the form appears as normal and upon submission, it returns responses based on whether the spam check passed and whether all fields were filled in. If it's successful, a thank you message appears and the form clears. It's all right. I'm glad I got it done.
One last thing worth mentioning however is something interesting that happens in Internet Explorer. I have ClearType on my laptop which makes all my text smooth. When I submit the form in Internet Explorer 7, the response text that comes back in the yellow line is jagged; it lacks ClearType. This has to be a bug in IE 7 and I would be interested to know if anyone else has come across it… clearly IE 7 doesn't smooth text that is generated with Javascript after the page has loaded… or something. In case anyone is wondering, here's a before and after:
Well, whatever, IE is lame. Let me know if you need some CSS work 
7 Comments
Sorry, comments for this entry are closed at this time.
I've been testing IE7 and some AJAX heavy applications and haven't found this problem (using YUI). It could definitely be a jQuery bug, not an IE bug.
And by saying it could be a jQuery bug, I mean that with YUI, if you have cleartype on and something content is faded in, there needs to be a background color on the element, otherwise things may end up like that.
This isn't a 'bug' per se, if you ask Microsoft, but rather 'by design'.
http://blogs.msdn.com/ie/archive/2006/08/31/730887.aspx
Ha ha! Nice find, Jonathan. One might say, as with most things in Internet Explorer, that this is a "feature", not a bug.
Well, this means that jQuery uses a DXTransform for its fade effect to work in IE 7 and so far it looks like there is no workaround for this problem. I really really hate the IE engine. I think I'm just going to leave the whole thing as-is.
Come to think of it, I might try to fade the text instead of the whole paragraph… but I definitely don't have the time now!
I have also been working on Ajax overloaded projects
and have not come across this… http://www.ajaxshack.com