with Imagination: by Dustin Diaz

./with Imagination

A JavaScript, CSS, XHTML web log focusing on usability and accessibility by Dustin Diaz

An AJAX contact form

Monday, July 25th, 2005

Introducing Dustin’s Ajax Contact Form

Download Ajax Contact 0.9
download ajax contact form

It’s a bit over the top… well… for a contact form that is. But yesterday morning I decided that I wanted to have a little fun so I put together an unobtrusive AJAX contact form (works even with JavaScript disabled). Feel free to send me a line. It’s a lean mean, contactin’ machine :D

If you’re wondering what the whole package deal is all about, I put together a page of what is inside the zip file as a try-out demo just to show that it does in fact work right out of the box. I even downloaded the file myself as if I’m new to the whole thing ;)
See the “testJax” beta release demo

Note: If you decide to use this contact form on your site, feel free to let me know where you’re using it. I am easily flattered ;)

Note Sept 10, 2005 I found a flaw in my own release. No, it’s not a security flaw, just a stupid bug I didn’t catch first time round. Unfortuntaely I won’t be able to re-upload another package until Monday since I’m on vacation working on a hotel computer. If you need to know the fix, here it is typed out:

Change the function processPosChange in js/xmlHttp.js to say exactly as follows:

function processPosChange for Ajax Contact Form

function processPosChange() {
  // page loaded 'complete'
  if (pos.readyState == 4) {
    // page is 'OK'
    if (pos.status == 200) {
      if ( grabPosXML('posStatus') == 'NOTOK' ) {
        alert('There were problems Sending Email.');
      }
    }
  }
}

All the best!

123 Responses to “An AJAX contact form”

  1. shawna

    That status bar was impressive!
    AJAX…I am so behind the times…*sigh*

  2. Dustin Diaz

    AJAX is simple once you get your own library going.

    It’s all experimentation from then on!

  3. Justin P

    I don’t know if you can technically call it “unobtrusive” if it doesn’t work without AJAX (Javascript and full XMLHttpRequest support).

    Good plan of action for implementing unobtrusive AJAX:
    1) Get your form running good without AJAX.
    2) Add AJAX.

    The status bar *is* cool though, when Javascript is enabled this is a nice contact form.

  4. Dustin Diaz

    Justin. It will be unobtrusive once I swap the button to be a submit button, and post to a separate page. Currently with WP’s configuration, you can’t post to the page you’re on. Eg.

    method=”post” action=”/contact/”

    It shows - “Page not found” (Even though you’re on the same page as you were before you posted the form).

    Overall, it’s unobtrusive in the fact that there isn’t a single piece of javascript sitting in my html. Thus, once I change it to input type=’submit’, I’ll be good to go.

    What I’ll probably end up doing is have it post to /scripts/contact.php and have the email sent there, and send a location header back to the originating page.

  5. Justin P

    You really ought to look into the PXS Mail Form plugin. If anything, just to see *how* to handle postbacks with WP. In your case, rather than explicitly set the action attribute of the form tag, you should set it to the dynamic server variable:

    $_SERVER[’REQUEST_URI’]

    Then the postback will occur correctly and you will not get a 404 error. With plugins, you write what is called “filters” which allow custom PHP functions to be called at specific action points, ie, when the content area is loaded. All your function needs to do is check if the form is being posted back and if so, handle it properly.

    It seems like you’re trying to reinvent the wheel here when WP Plugins give you all the power you need.

    > it’s unobtrusive in the fact that there
    > isn’t a single piece of javascript
    > sitting in my html.

    Yeah, you got me there. I was confusing unobstrusive Javascript with contingency-minded Javascript. I think the two go hand-in-hand, but you are correct, they *are* different.

  6. Dustin Diaz

    alrighty. I went ahead and finished off the job without the plugin. Everything seems to be all dandy now. Should work with/without javascript.

    Please see it now!

    As far as re-inventing the wheel…my philosophy is that that is what you need to do sometimes if you ever want to learn anything.

  7. Justin P

    Heh, it works without Javascript now (even though there is no thank you message confirming the form was submitted).

    > my philosophy is that that is what you need to do sometimes if you ever want to learn anything.

    To a degree, I concur. What it looks like you’re doing here is reinventing your own plugin infrastructure for WP, and I don’t think you are learning anything that you wouldn’t learn by writing your own plugins using the Plugin API. A big part of programming is learning to work with existing API’s and leverage them to suit your needs, constantly rewriting what is already written (although not written by your own hand) is going to wear you out.

    Well maybe not, but I got tired of it :)

  8. Dustin Diaz

    One advantage of writing my own API’s is that I know exactly what they do, and I know how to manipulate them exactly how I want. I know it sounds sort of like a brute force way of doing it. Often times if you don’t get enough practice writing your own scripts, you’ll often fail when trying to manipulate someone elses.

    But still, I don’t know how much I can go on and on about this. You should be impressed by the mere fact that I’m using Wordpress :D

    even though there is no thank you message confirming the form was submitted

    As you might have noticed, I’m still working on that part. You might have seen that when you come back, there is a query string denoting you submitted the form. I’m going to use that to display the success message upon it being there. So all should be good to go given a little more time.

  9. Justin P

    Yeah I know, I’m totally bickering here. I tend to do that ;)

    I’m stoked you’re on WP and keep hacking it, it’s more fun that way.

  10. Jay

    Cool!

  11. Haba

    this is pretty impressive

  12. Jinendra

    Hello,

    This is very impressive, please do send me code of this.

    Thanks
    Jinendra

  13. Jeroen Coumans

    Very cool!

  14. Ben

    Thanks for sharing the code with us! (sarcastic) Keeping all the cool stuff for yourself.
    :( *folds arms*

  15. Brendon

    Hey man…

    I have made a very easy to use AJAX Forms Toolkit which can apply to any form to AJAX-ize it. It is very similar to the one you speak of. Check it out:

    http://www.redredmusic.com/brendon/ajform/

  16. geert

    phew, cool stuff!

  17. nathanael merrill » Blog Archive » Ajax

    […] eous feddback to the user about problems in their forms, which greatly aids in usability. http://www.dustindiaz.com/ajax-contact-form Ajax Design Patterns Ajax Form Validation […]

  18. pippo

    WOW

  19. Chris Bloom

    Just a test spin (ZoomZoom)

  20. Irish Web Design

    That is really cool. Any chance you are going to let the rest of us get our hands on it? :(

  21. Ballwalkin' Mike

    WOOHOO!

    Thanks for giving out the source code for this!

    I will try to implement this right away!

  22. Lincoln


    Thanks a lot….

  23. mike

    I really like this–could you give me a bit of advice on how to add additional fields to the form?

  24. sirkitree

    what the hel is so nice about this? ahh… preview your code as you type… that’s pretty sweet. i was actually condering about doing something like this myself on one of my sites… but it’s internal so you can’t see it… maybe i’ll go public one day… {sigh} .// anywhays very nice ajax implementation

  25. Kenny

    Will you be releasing this as a wordpress plugin?

  26. Dustin Diaz

    Kenny,
    possibly. The fact that it is so easy to just install yourself without the benefits of it being a plugin, has it sitting on the backburner. So until then, try getting it working yourself or ask someone willing. The instructions are on the demo and in the download file.

  27. Shadows » Blog Archive » Impressed

    […] nt0r.de/blog/”> 2. Another use of Ajax in this simple but effective contact form from Dustin Diaz. 3. It’s been out for some t […]

  28. Kenny

    I’m not that savy with the wordpress plugin coding. I did manage to get it to work outside of wordpress. I also tried to make a wordpress template to work with it, but I failed. If you do make a plug-in for wordpress..that would be great..if not i understand. Good stuff anywayz.

  29. Dustin Diaz

    This was never meant to be a word-press plugin. As a matter of fact, it might be even more difficult to get it working into any existing cms. That is why it was released as a standalone app :)

  30. Lincoln

    Hi,Nice Job!!
    But i’m having a problem with the form on internet explorer… clicking the submit button,i got this error “The Mail server is failling at this time (Error!4).Please try back at another time.

  31. Lincoln

    Hi,
    even with the error alert “The Mail server is failling at this time (Error!4).Please try back at another time.”. The form still work,what should i do to prevent the alert?

  32. Dustin Diaz

    Lincoln,
    this was the flaw I was talking about. Try redownloading the package. I fixed it. It’s a known bug I found early in the project.

  33. Lincoln

    Ok,it’s working now…. Thanks a lot.

  34. Zeljko Prsa

    It works really well in FF and Mozilla, Opera and every other browser but it really doesn’t work in IE, I get the “The page cannot be displayed” message:(

    Hope you know were the catch is…Thnx.

  35. Zeljko Prsa

    O.K. now I’ve uploaded the scripts again and it works fine in IE (I received the message in my mailbox). I still can get the progress visible in IE while proccessing the mail, it’s only visible in the status bar…

  36. Lincoln

    Hi,
    Mr Dusting,
    i’ve the same problem of Zeljko the only problem is with the progress bar not visible…

  37. Dustin Diaz

    Lincoln,
    did you redownload and get the updated version? This should have been taken care of. Many others have it working now.

  38. Lincoln

    Dustin,
    Yes i’ve redownload the files..
    Sorry….. but the form is working fine even though it gives me Your Email could not be sent. Please try back at another time.

  39. Sian

    Thank you for posting this script. I’ve been looking for a nice contact script and this works with no problems and is easy to configure.

    I’ll be using it on webdiva.co.uk and hopefully also on
    dowlaisforum.org.uk

  40. jazzle

    it would be nice if it validated the email address…
    currently it doesn’t even need an ‘@’!

  41. Alberto

    Testing this out to see how it works.

  42. Anthony DiSante

    Hello!

    I tested your AJAX email form a while ago and thought it was great. Recently a friend wanted to send me a too-big-for-email file, and it got me thinking… I decided to write an AJAXy file uploader with progress bar. You can try out the demo and download the script here:

    http://encodable.com/tech/ajaxupload/

  43. Dustin Diaz

    Nice Anthony. Looks like you put a lot of hard work into it. Very well done. I’m glad I could pose some inspiration.

  44. Mark

    I am really bad at java, css, html, you name it…can’t teach an old dog new tricks! Love the contact form…using it at my site, hope you don’t mind, did leave a link back to your site at the bottom of the ajax form…thanks.

  45. Dustin Diaz

    That’s cool mark. Just make sure you correct my name from “Justin” to “Dustin”

  46. See Ol Freeloader

    Ooh! Your Ajax contact form’s the envy of my colleages and friends.

    See it on my site at http://www.itjano.com/blog/feedme/.

    Stage II is to get it to check mail domains and make some of the field’s mandatory

  47. tom

    when you have time, please update the code to validate email addresses and form fields. thank you, tom

  48. xxdesmus

    How would one go about embedding this inside my current page? There has to be a way of doing this without using the dreaded iframes. Thank you for this though, I’ve been meaning to read up on this AJAX craze.

  49. Sam Granger

    Cool!!! Looking good.

  50. MakingItKick » Blog Archive » Ajax Contact Form

    […] o; Hello world! Ajax Contact Form Dustin Diaz introduced his new Ajax Contact Form. Apparently after so many requests for the source code, Dustin has made it availab […]

  51. Dustin Diaz

    If you would like to embed this into your current webpage, simply just take the html from the form, and the references to the <script>’s and put it in your page. No iFrame necessary. This really can’t get any more basic than it is so you should have no problem.
    See Jason Beairds Contact Page and how he has it implemented.

  52. Dustin Diaz

    @Tom: I’ll include a list of regular expressions you can choose from and which one’s you would like to enable. I figure no ‘one’ regular expression pleases everyone, but I’ll slap on a generic one for the next run through.

  53. Nate

    Do you think the form should clear after a succesful send? I’m just wondering if someone doesn’t notice the statusbar or looks away while it’s sending then they look back and they see the same screen with all their text there they might try to resend.

    Just a thought, I’m not really sure what the best method to use is.

  54. Dustin Diaz

    Nate,
    I don’t know for sure. I didn’t put this through any test cases… it just seemed to be the most natural thing to do. Afterall, after submitting forms, they’re usually blank anyway.

  55. Dingo Jones

    This is an interesting use of AJAX, but I like the realtime feedback one can offer users. Any chance you can keep the text within the background box?
    Thanks.

  56. AJAX

    AJAX PHP App: AJAX contact form

    Another great example of using AJAX and PHP together, this is a contact form done by Dustin Diaz.
    It’s a bit over the top… well… for a contact form that is. But yesterday morning I decided that I wanted to have a little fun so I put together a…

  57. jot*be

    Really nice script! Works great. I combined it with my mail script on my contact page, which validates the input data and returns complete error messages.

  58. Sri’s Blog » links for 2005-11-10

    […]

    links for 2005-11-10

    November 11th, 2005

    An AJAX contact form “I decided that I wanted to have a little fun so I put together an unobt […]

  59. J. J.

    I’ve gone through the setup twice now to confirm that I didn’t change some weird setting the first time around. I’ve got four points I hope you can address:
    (1) Where can I learn more about creating a simple standards-compliant form like this that protects my e-mail address that’s stored in the /scripts files (and do I need to do something to protect my e-mail futher in the AJAX Contact script itself)? I ran across this in del.icio.us and it was simply the first decent-looking form that I could find. I’ve posted a similar inquiry at SitePoint:
    http://www.sitepoint.com/forums/showthread.php?p=2288880
    (2) When JS is disabled, the CC option doesn’t work.
    (3) The scripts folder $yourSubject field only works when JS is DISabled. Otherwise, the default “AJAX Mail:” subject (line 23 of xmlHttpRequest.php) is displayed.
    (4) Indeed, as others have mentioned, an e-mail verification would be nice.

    Thanks for a fun product!

  60. Dustin Diaz

    JJ. It may just be worth your time sticking around for the 1.0 release.

  61. J. J.

    Hmm, well I guess the important question now, though, is: (1) Is the scripts/ folder secure? Is my e-mail address harvestable? Is there a CHMOD setting I should apply (I prefer numbers, like 777 as a random example)? Thanks again…

  62. Christian Labarthe

    Dustin, everything seems to work but I never receive any email? Javascript console give me this message! HELP…

    Error: pos.responseXML.documentElement.getElementsByTagName(tagName)[0] has no properties
    Source File: http://www.synapse.net/wawa/js/xmlHttp.js
    Line: 23

  63. Mike

    This is in reference to Nate’s post (#53).
    I see that your online demo erases the fields after submission, however the version I have just downloaded does not.

    I would prefer to have the fields erased. What would I need to edit in order to accomplish this?

  64. Vitor

    Excellent work!
    I keep getting an error on IE, tough:
    “an element is missing…”
    The mail still gets its way, but the error message is annoying. Any idea how to solve it?
    thanks

  65. Tony Summerville

    @Christian Labarthe: Sounds like you may be using an older version of PHP… If it’s before version 4.1, you’ll have to change all the instances of $_POST to $HTTP_POST_VARS and change $_GET to $HTTP_GET_VARS.

  66. El blog de Diego » Blog Archive » Ajax a troche y moche

    […] de esta llorera para mi formulario viene de que el único que he encontrado es uno llamado Ajax contac ya está: se revelo el misterio del post. ¿sabe el respetable por casualidad de donde l […]

  67. Jeff

    Dustin, Will 1.0 do email validation? When can we expect it. Thanks again for a geat AJAX form. Looking forward to hearing from you.

  68. Dustin Diaz

    Jeff,
    It most definitely will. I’m basically setting up an ajax contact form development kit and it will look something like this:

    <input type='text' class='required email' />

    This allows the developer to add required fields where appropriate and you won’t need to fuss with the JavaScript.

  69. Jeff

    Wondeful. Add me to the email list for announcements on its release.

  70. rich

    hm i’m getting this javascript error:

    pos.responseXML has no properties

    in xmlHttp.js on line 23.

    the sympotms are no mail is being sent. I’ve tried adjusting $_POST and $_GET to their older equivalents to no avail.

    any ideas? I’m liking the script. just be cool if it would send me mail (though some sites perhaps not receiving mail would be a bonus ;-) )

  71. Shaun

    I’m trying to implement this at my website, but for some reason, it doesn’t show the successful green text… anyone know why? It just sends… that’s it.

    http://onemanshortproductions.com/community. Hey wow, I can see what I’m typing… lol.

  72. manfergo

    Hi. I have tested your ajax form and I have found problems with the extended characters for spanish language: á é ñ and the like.

    I have tested your web, my own server and another server who use your code, and all of them send the ‘ñ’ from ‘España(Spain)’ converted to two chars: ‘ñ’, the capital ‘A’ with a tilde and a symbol plus-minus.

    All clues points to the UTF-8 charset it’s used in the javascript.

    It appears PHP use internally iso-8859-1 and when the data is processed by the javascript and send by mail the character coding isn’t perfect.

    I have tested many times with different servers and the problem isn’t the server.

    If I use only the PHP code to send the form, without the AJAX part of the javascript, all goes OK. All characters are well.

    I have found the PHP functions utf8_encode() and utf8_decode() but i’m a php newbie and can’t get it to work.

    Maybe someone could check this, to perfect the ajax form for all the languages?.

    Thank for your help.

  73. Martin

    Nice script. You could add markdown or smartypants to the mix if you’re ambitious. For more inspiration you could also check out what mad4milk is doing. Their MooFlex CMS system incorporates similiar form/function. Thanks Dustin.

    http://daringfireball.net/projects/markdown
    http://www.mad4milk.net/entry/mooflex-beta-signup

  74. manfergo

    Ok. I have solved the IE error in line 23 of ‘xmlHttp.js’: “must be an object”.

    There is an error in the source code of that file:

    The line 31 is actually:

    if ( grabPosXML(”posStatus”) == ‘NOTOK’ ) {

    and must be:

    if ( grabPosXML(’status’) == ‘NOTOK’ ) {

    There is a confusion between the variable ‘posStatus’ and the xml mark ’status’.

    When IE try to get this xml mark doesn’t find it.

  75. Amir Leshem

    Great solution, but for ASP.NET programming there is a very good control called zumiPage. http://www.zumipage.com

    With zumiPage postbacks to the server are automatically captured on the client-side, and sent via an XmlHttp mechanism. Using advanced AJAX technology, combined with the unique capabilities of zumiPage to manipulate the ASP.NET Framework, an extremely fast server response is executed and the user experience is very similar to well-known Windows applications.

    zumiPage requires no code changes to existing projects so you can write code for ASP.NET as you always do, using the standard web-controls and methodology, and zumiPage will take care of the rest. Your web application will run smooth, fast and be more interactive.

  76. Francisco Flores

    Hi, great work, but, I don’t know how to change the green color in the successful message, please help. :)

  77. Dustin Diaz

    Francisco,
    Err…um…sorry. That was hard-coded into it with an inline style. Yea, i know…bad Dustin! just search for the string ’style=’

  78. James Mitchell

    Dustin- awesome work as always. Works wonderfully (when you don’t screw it up customizing it). I have been waiting for just the right application (and time) to get it up and running on one of my sites.

    In use now at http://www.whatsyourfactor.com as the contact us form.

  79. xxdesmus

    Can you tell me what the heck I am doing wrong then trying to integrate this into my page?

    http://www.xxdesmusxx.net/ee/index.php?/weblog/contact/

    I changed all the references for the scripts, it appears to go through it says successful, but the email does not go through.

    http://www.xxdesmusxx.net/contact works fine though.
    any ideas?

  80. daniel

    same problem with xxdesmus; have tried it on 4 different hosting sites now and none of them appear to work: form appears, ajaxy magic happens, but no emails ever arrive.
    could this be to do with the referring url variable? i’v eset that to the php page of the same contact page, index.php in my /contact/ dir.

    email: f@gmail.com
    name: foobah
    refering url http://mydomain.com/contact/index.php
    subject: ajazymagicyness

    but no luck :(

    have redownloaded several times but no luck:(

  81. Dustin Diaz

    @xx & Daniel:
    Are you working on the same domain path. I know that there’s been issues with having something be ‘www.domain.com’ and just ‘domain.com’ - I don’t know why, just a hunch though. Also, there may be some other issues with your host - but still, just another hunch.

  82. xxdesmus

    Still the same problem. I’ve tried setting the referringPage variable to:

    ‘http://www.xxdesmusxx.net’;

    and
    http://xxdesmusxx.net‘;

    same problem with both. =(

  83. xxdesmus

    random…does it matter that my host uses:

    Path to sendmail /usr/sbin/sendmail

    just a thought perhaps.

  84. George

    I haven’t seen anyone discuss whether the form combats header injection SPAM abuse. Is this so with this one?

  85. Joel

    all i get is “Your Email could not be sent. Please try back at another time.” even if i fill the email field with “dsahjasd” and an error on line 24 , Char 1 , Object required , and i only changed the four lines as instructed in the two files….

  86. davidbisset.com » AJAX Contact Form

    […]

    davidbisset.com

    AJAX Contact Form Good working example for Ajax newbies.
    Comments are closed.

    […]

  87. Rerum Varium

    AJAX para integracin de socios de negocios en Monografias.com

    Alivianamos la carga del servidor y mejoramos la experiencia del usuario gracias a un script asncrono.

  88. Top Ten Rap Albums of 2005: Day 2 at echoshock

    […] different, but the about page is what I spent most of today working on. After testing out a cool AJAX contact form, which I somehow couldn’t get running properly, I reverted back to th […]

  89. thTeong WebLog | Blog About Everything

    […] There a few plugin that I recently installed in this blog. There is a new plugin called as AJAX Contact Form in my contact page. You can download the plugin from […]

  90. WordPress Plugins at JohnTP’s Home

    […] Download Ajax Contact […]

  91. Sri’s weblog » Blog Archive » Ajax contact form installation

    […] 2. Download the zip file from http://www.dustindiaz.com/ajax-contact-form/ […]

  92. Brian Getting’s Blog»Blog Archive » AJAX Contact Form

    […] I tried a bunch of different methods before finding Dustin’s. There were problems with all of them, which are indicative of the challenges facing AJAX developers. The first was the issue of creating a cross browser XMLHttpRequest object, since Microsoft browsers use ActiveX to accomplish this. Not a big deal, you simply need a small switch to check what browser is being used, and create the appropriate object. However, I was surpised at how many scripts did not do this, or had some giant libraries associated with them to pull this off. Dustin’s scripts are easy to follow, and are very well written. […]

  93. İletişim Formunuzu Ajax ile yapın at Ajax Nedir? [Beta]

    […] Kaynak kodunu indirmek için : iletisim_formu.rar Örnekte değişkenleri scripts klasöründeki contact.php dosyasının içerisinden değiştirmelisiniz. Orjinali için : http://www.dustindiaz.com/ajax-contact-form/ aa […]

  94. FocusedTutorials.com » Blog Archive » Simple Contact Form

    […] If you are looking to add a bit of flashy-ness to your site I would suggest looking into an AJAX contact form by Dustin Diaz’s. It is a simple one like this, only it involves Javascript. Quite cool as it processes instantly before your eyes and even has a processing image. […]

  95. Ajax Contact Form 1.0! Yay

    […] Anyway, for any of you out there that sat around for what seems to have been ages for me to update my cheesy Ajax Contact Form, I’ve now rebuilt it on top of the YUI Connection Manager (translation for the teenagers (AJAX!)). Oh yea. Check out the demo in action. […]

  96. test blog » Blog Archive » Ajax Contact Form 플러그인

    […] 예전에 찜해두었던 Ajax Contact Form을 이용해서 플러그인을 만들어 봤습니다. 만들어 봐야겠다는 생각을 한 지가 오래되어서 그 사이 혹시 누군가 플러그인으로 만들어놓은게 있나 싶어 찾아보니 같은건 아니지만 Ajax로 구현된 intouch라는 플러그인이 있더군요. […]

  97. Wordpress improvements I’d love to see at Karmakars.com

    […] Integration with a ready to use contact form (hack 1 | hack 2), author pages, searching ‘pages’ + ‘post’(hack) […]

  98. Seba Sandoval, diseño y otras cosas.

    […] Después de un tiempo esta casi listo mi sitio, ya agragué el Personal (con la única foto que encontré) y el Contacto, solo me falta afinar algunos detalles en la sección de proyectos y estamos. Bueno espero que el formulario funcione correctamente, cortesía de Dustindiaz.com para que me envíen sus comntarios acerca del sitio. Bueno…si tienen algo que decir lo pueden hacer aquí en este post. Me interesan sus opiniones. […]

  99. The Lame Goat » Adding Forms to Your Website

    […] The honorable mention goes to the cool AJAX (language) Contact Form available here: http://www.dustindiaz.com/ajax-contact-form/ – using the new AJAX (2005) technology pioneered by Google, this form does not cause the page to refresh while contacting the server for info. […]

  100. The Ecommerce Blog » Using Ajax with a Business Website

    […] Customer Contact Forms The final goal of most business and ecommerce websites is for a customer to fill out an application or make a purchase from them. Ajax forms can make this entire process much cleaner. The visitor never leaves the page, no reloading, refreshing, or even switching pages. The contact form is submitted, and almost instantly, the form received message appears. This is a perfect use for Ajax on the business website. There are a number of developed Ajax contact scripts, and I recommend Dustin Diaz’s php based Ajax contact form. […]

  101. Particletree » The Hows and Whys of Degradable Ajax

    […] And so we’ve developed some solid strategies to help us use Ajax in our apps without having to worry if they’re essential or not to the application. After some heavy experimenting, we’ve developed a method for making web pages work regardless of the user’s browser settings. While other sites have implemented their own versions of degradable Ajax, we found the lack of documentation on the subject discouraging. And so it is with great pleasure that we present to you the Particletree method of degradable Ajax. […]

  102. Simple Contact Form « FocusedTutorials.com

    […] If you are looking to add a bit of flashy-ness to your site I would suggest looking into an AJAX contact form by Dustin Diaz’s. It is a simple one like this, only it involves Javascript. Quite cool as it processes instantly before your eyes and even has a processing image. […]

  103. Ajax Plugins » Blog Archive » AJAX Contact Form for Wordpress

    […] ajaxContact is basically the excellent wp-contactform by Ryan Duff, mashed together with Dustin Diaz’s fine Ajax Comment Form, which isn’t a Wordpress plugin. So basically 95% of the credit for this plugin goes to those fine gentlemen!Please leave feedback in the comments below. […]

  104. scriptvote » Blog Archive : Dustin’s Ajax Contact Form » Dustin’s Ajax Contact Form

    […] entry was posted on Tuesday, February 20th, 2007 at 11:17 pm and is filed under E-Mail. You can trackback from your ownsite. […]

  105. ajax at comatags

    […] An AJAX contact form Introducing Dustin’s Ajax Contact Form […]

  106. Screencast 05: Build your own Ajax Contact form in less than 15 minutes

    […] Today I felt the “mini” effect as the result of a second-hand digging from a website called miniajax (I thought about this intro sentence for all of about two minutes). Today that website was dugg. There is a link directly at the top of that page linking to my Ajax Contact Form I wrote near a year and a half ago of July ‘05. I thought to myself… “wow, that darn thing is still kickin.’” Then it occurred to me, that it would probably be a good idea just to show people how to make their own ajax contact form… surely it would only take about 15 minutes. […]

  107. AjaxNedir » Blog Archive » Ajax ile iletişim formu

    […] Orjinali için : http://www.dustindiaz.com/ajax-contact-form/ […]

  108. Baz Web Development: AJAX, Joomla, CSS » Blog Archive » AJAX Contact Form

    […] Before we even begin, one good question that anyone would ask is since this came out over one and a half years ago, why am I only now getting wind of this? Good question. Wish I had a good answer. But on to business: AJAX Contact form 0.9. […]

  109. CreatixBlog ;) » Miniajax, de l’ajax à gogo

    […] Dedans, il y a aussi bien des formulaires de contact, des outils de statistiques de cliques qui indique par des codes de couleur (température)  les endroit sur la page les plus cliquer (voir ici). […]

  110. links for 2007-03-06 | Patrick Kempf

    […] An AJAX contact form (tags: AJAX javascript contact form forms email code) […]

  111. at Web2.Office

    […] An AJAX contact form - 演示 […]

  112. Dicas Neosite » Blog Archive » Envio de formulário com Ajax

    […] Para copiar o Ajax Contact Form visite: http://www.dustindiaz.com/ajax-contact-form/ […]

  113. 3/27/06 - Ajax Contact Form & More « Nintendo-Friends.com News and Updates

    […] Onto the new content!  I added a contact form, finally.  It is shiny new Ajax and while I would love to claim it as my own it isn’t.  I got the script from http://www.dustindiaz.com/ajax-contact-form/.  It is kind of slow on my server but hopefully I can find a way to speed it up.  Also I need to find a way to add some sort of spam/bot protection so my inbox doesn’t get flooded. […]

  114. AJAX Quellensammlung | Dr. Web Weblog

    […] An AJAX contact form Introducing Dustin’s Ajax Contact Form […]

  115. SachinKRaj - get something useful from web Lots of AJAX widgets and mini-apps «

    […] An AJAX contact form - Demo […]

  116. SachinKRaj - get something useful from web 25 Code Snippets for Web Designers & Developers «

    […] Ajax Contact Form - An unobtrusive AJAX contact form (works even with JavaScript disabled) […]

  117. Web Designers & Developers « Kunal Vijan!!

    […] Ajax Contact Form - An unobtrusive AJAX contact form (works even with JavaScript disabled) […]

  118. TeknoDergi.Org » Ajax ile iletişim formu

    […] ajax ile yapılmış bir iletişim formu mevcut : site için buradan , demosu için buradan buyrun. […]

  119. Ajax Contact 0.9 - Webmaster Forum

    […] Ajax Contact 0.9 Ajax destekli iletiim formu. Buradan indirebilir, buradan test edebilir, buradan ise aklamay(ing) okuyabilirsiniz. __________________ Tosbam ld […]

  120. MiniAjax.com - Ajax scripts showcase » Blog Archive - Myo Kyaw Htun . com

    […] MiniAjax.com collects so many (55 updated March 5, 2007) ajax applications such as star rating, contact form, tab content, tooltips, poller, slide show and much more which can be used in your web site/blog. […]

  121. AJAX Widgets « Kunal Vijan

    […] An AJAX contact form - Demo A drop-in AJAX contact form that can be used in WP. PHP () Mail ready. […]

  122. 7 AJAX simple scripts that can make your site more interesting at eBlog - The Entertainment Blog

    […] 4 An AJAX contact form - demo […]

  123. imageuppers.com » Blog Archive » Dustin’s Ajax Contact Form

    […] Download: Dowload the package at Dustin Diaz’ site. […]

Get "JavaScript Design Patterns"

"As a web developer, you'll already know that JavaScript™ is a powerful language, allowing you to add an impressive array of dynamic functionality to otherwise static web sites. But there is more power waiting to be unlocked--JavaScript is capable of full object-oriented capabilities, and by applying OOP principles, best practices, and design patterns to your code, you can make it more powerful, more efficient, and easier to work with alone or as part of a team."

Buy JS Design Patterns from Amazon.com Buy JS Design Patterns from Apress

Flickr

Submit a Prototype

All content copyright © 2003 - 2007 under the Creative Commons License. Wanna know something? Just ask.

About | Archives | Blog Search

[x] close

Loading...

Submit a prototype

By checking this prototype I agree that I am not submitting false credentials, pornography, or a hate crime website. I also understand that by submitting my entry I may or may not be accepted, and if accepted, my entry may be taken down at any given time if I violate these terms.