SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Wizard Zaggs's Avatar
    Join Date
    Feb 2005
    Posts
    1,048
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Passing all form values to AJAX

    Hi - is it possible to pass a form's variables/arrays to AJAX?

  2. #2
    SitePoint Wizard
    Join Date
    Nov 2004
    Location
    Nelson BC
    Posts
    2,310
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well, if you're using prototype.js you can do

    Code:
    formData = document.myform.serialize();

  3. #3
    SitePoint Wizard Zaggs's Avatar
    Join Date
    Feb 2005
    Posts
    1,048
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I have never heard of/or used prototype.js before...Do I need to use this or is there an alternative?

  4. #4
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,678
    Mentioned
    99 Post(s)
    Tagged
    4 Thread(s)
    http://bulletproofajax.com/code/ includes code for a Contact Us form that uses the following code to piece together the data to be posted off

    Code javascript:
    var data = "";
    for (var i=0; i<this.elements.length; i++) {
        data+= this.elements[i].name;
        data+= "=";
        data+= escape(this.elements[i].value);
        data+= "&";
    }
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  5. #5
    SitePoint Addict
    Join Date
    Dec 2007
    Posts
    207
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    AFAIK there is no built in function to do this for you, you'd have to do it generically; something like Paul posted.

  6. #6
    SitePoint Wizard
    Join Date
    Nov 2004
    Location
    Nelson BC
    Posts
    2,310
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That code probably won't do so well if you have radio buttons on the form.

  7. #7
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,678
    Mentioned
    99 Post(s)
    Tagged
    4 Thread(s)
    Then you would need to update the code so that it takes such things onto account.

    I would imagine you would create a new array in which it holds all the values you want to send, then you would loop through that array building the data string.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  8. #8
    SitePoint Wizard
    Join Date
    Nov 2004
    Location
    Nelson BC
    Posts
    2,310
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This one might work for you:
    Code:
    function serialize(someForm) {
    	var serialized = [];
    	for (var i=0; i < someForm.elements.length; i++) {
    		var el = someForm.elements[i];
    		if (!el.disabled && el.name) {
    			switch (el.tagName.toLowerCase()) {
    	
    				case "input":
    					switch (el.type.toLowerCase()) {
    						case "radio":
    						case "checkbox":
    							if (el.checked) {
    								serialized.push(encodeURIComponent(el.name) + "=" + encodeURIComponent(el.value));
    							} 
    						break;
    	
    						case "file":
    							// don't do anything
    						break;
    	
    						default:
    							serialized.push(encodeURIComponent(el.name) + "=" + encodeURIComponent(el.value));
    						break;							
    					}
    				break;
    	
    				case "select":
    					for (var j=0; j < el.options.length; j++) {
    						if (el.options[j].selected) {
    							serialized.push(encodeURIComponent(el.name) + "=" + encodeURIComponent(el.options[j].value));
    						}
    					}
    				break;
    	
    				case "textarea":
    				case "button":
    				default:
    					serialized.push(encodeURIComponent(el.name) + "=" + encodeURIComponent(el.value));
    				break;
    			}
    		}
    	}
    	return serialized.join("&");
    }


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •