photo
Jordan Sissel
geek

Fri, 30 Jun 2006

jQuery autofill version 2

This post marks 4 in one day. Whew!

Resig and I were bouncing ideas around after I made the form filler, and we came up with something that fits very nicely into the jQuery api (in the form of something very pluggable).

You'll need the following code that will extend jQuery's functionality. Basically, it adds 'saveAsCookie' and 'loadAsCookie' function calls to $() objects.

$.fn.saveAsCookie = function(n,t){
   return this.each(function(){
     createCookie( (n || '') + (this.name || this.id), this.value, t );
   });
 };

$.fn.loadAsCookie = function(n){
  return this.each(function(){
    this.value = readCookie( (n || '') + (this.name || this.id) );
  });
};
You can safely put that code somewhere and load it anywhere you need autofill. Reusable code is awesome.

Now, we don't want to cache *all* input elements, becuase only some contain user-input and only some need to be saved. For this, I put the class 'cookieme' on all input elements I wanted to save.

 $(document).ready(function(){
   $("form#comments_form").submit(function(){
     $("input.cookieme",this).saveAsCookie("formdata");
   })
   .find("input.cookieme").loadAsCookie("formdata");
 });
The arguments to 'saveAsCookie' and 'loadAsCookie' are namespace prefixes. This way, you can avoid namespace collisions with other cookies. All of my autofill cookies will be prefixed with 'formdata' and suffixed with the element name or id attribute.

So, we squished the code down to 6 lines, 4 of which are actually meaningful.

jQuery++

Comments: 6 (view comments)
Tags: , , ,
Permalink: /geekery/jquery-formfill-v2
posted at: 05:38


6 responses to 'jQuery autofill version 2'

Jordan Sissel posted at Fri Jun 30 03:23:21 2006...
Hurray for cookies!

John Resig posted at Fri Jun 30 21:01:13 2006...
Testing the snazzy comment system.

Ken Petri posted at Mon Jan 29 17:03:21 2007...
Question: how can you do this on an unload event?

Here's the scenario: I have a page that someone might navigate away from using a link. The page contains a form--and it's a fairly long one. I would like to save the person's form choices before the page unloads so that when they come back the choices are preserved. It is likely the person will navigate away from the page by using a link on the page.

Tried doing this by using the current code above and setting an unload event to write the cookie, but it wouldn't work. I'm experimenting by setting the code for all links of a certain class--maybe that will work.... Or maybe I could have it listen for onchange events within the form??

Anyway, if you have any solutions or even ideas, I'm all ears.

Thanks,
ken

Ken Petri posted at Mon Jan 29 17:52:42 2007...
Question: how can you do this on an unload event?

Here's the scenario: I have a page that someone might navigate away from using a link. The page contains a form--and it's a fairly long one. I would like to save the person's form choices before the page unloads so that when they come back the choices are preserved. It is likely the person will navigate away from the page by using a link on the page.

Tried doing this by using the current code above and setting an unload event to write the cookie, but it wouldn't work. I'm experimenting by setting the code for all links of a certain class--maybe that will work.... Or maybe I could have it listen for onchange events within the form??

Anyway, if you have any solutions or even ideas, I'm all ears.

Thanks,
ken

Yupi posted at Tue Jul 24 00:33:47 2007...
wanted to test this as well...

Funny Face posted at Wed Jul 16 18:59:39 2008...
ditto


Leave a reply

You need javascript enabled to use this form. Anti-spam efforts ongoing. Also, if the comment doesn't show up, it's because the form expired. Go back and copy your comment, reload the form, and resubmit. Apologies if this is a hassle, I'm just playing with antispam methods right now. If this insists on not working, please email me about it.

Name (required)
E-mail (optional, if you want me to be able to email you back)
URL (also optional)
Comment:


Search this site

Navigation

Metadata

Home About Resume My Code (SVN)

Articles

ARP Security Dynamic DNS with DHCP OpenLDAP+Kerberos+SASL PPP over SSH SSH Security: /bin/false Week of Unix Tools Work Efficiency

Projects

fex firefox tabsearch firefox urledit grok keynav liboverride newpsm (FreeBSD) nis2ldap pam_captcha poor man's backup Solaris audio utility xboxproxy xdotool xmlpresenter xpathtool misc scripts

Presentations

Yahoo! Hack Day '06 Unix Essentials Vi/Vim Essentials

Tag Cloud

Calendar

< June 2006 >
SuMoTuWeThFrSa
     1 2 3
4 5 6 7 8 910
11121314151617
18192021222324
252627282930 

Friends

BarCamp Kent Brewster Tantek Çelik John Resig Wesley Shields Tyler Shields

Technorati