Return to Snippet

Revision: 31905
at September 15, 2010 19:42 by dom111


Initial Code
(function() {
  var data = {
    // personal details
  	'forename': {
  		'expression': /^(delivery|billing|card)?_?(fore|first)_?name$/i,
  		'value': [
  		  'Bob',
  		  'Alice'
  		]
  	},
  	'surname': {
  		'expression': /^(delivery|billing|card)?_?(sur|family|last)_?name$/i,
  		'value': [
  		  'Tester',
  		  'O\'Test' // test for quote acceptance
  		]
  	},
  	'company': {
  	  'expression': /^(delivery|billing|card)?_?(company|business|organisation)_?(name)?$/i,
  	  'value': [
  	    'Test Ltd.',
  	    'Test O\'Sites Ltd.',
  	    'Test "Testing" Ltd.'
  	  ]
  	},
  	'email': {
  		'expression': /^(confirm)?_?email_?(address|confirm)?$/i,
  		'value': '[email protected]'
  	},

  	// address details
  	'house_number': {
			'expression': /^(delivery|billing|card)?_?(house|street|building)_?(num(ber)?|no)?$/i,
  		'value': '45'
  	},
  	'address1': {
  		'expression': /^(delivery|billing|card)?_?address_?1$/i,
  		'value': [
  		  '45 Test Road',
  		  '"Test House", 45 Test Road',
  		  '\'Test House\', 45 Test Road'
  		]
  	},
  	'address2': {
  		'expression': /^(delivery|billing|card)?_?address_?2$/i,
  		'value': 'Teston'
  	},
  	'town': {
  		'expression': /^(delivery|billing|card)?_?(town|city|address_?3)$/i,
  		'value': 'Testville'
  	},
  	'county': {
  		'expression': /^(delivery|billing|card)?_?(county|state|address_?4)$/i,
  		'value': 'Testshire'
  	},
  	'postcode': {
  		'expression': /^(delivery|billing|card)?_?(post(al)?|zip)_?code$/i,
  		'value': [
  		  'WR2 6NJ' // postcode anywhere test postcode - no charge for testing!
  		]
  	},
    'country': {
      'expression': /^(delivery|billing|card)?_?country$/i,
      'value': [
        'United Kingdom',
        'Great Britain',
        'England',
        'UK'
      ]
    },

    // contact details
		'phone': {
			'expression': /^(delivery|billing|card)?_?((tele?)?phone|tel)_?(num(ber)?|no)?$/i,
			'value': '01234 567 890'
		},
		'mobile': {
			'expression': /^mob(ile)?_?(num(ber)?|no)?$/i,
			'value': '07777 123 456'
		},
		'fax': {
			'expression': /^(fax|facsimile)_?(num(ber)?|no)?$/i,
			'value': '01234 567 891'
		},

    // date of birth
    'dob_day': {
      'expression': /^d(a?te)?_?of?_?b(irth)?_?d(a?y)?$/i,
      'value': 1
    },
    'dob_month': {
      'expression': /^d(a?te)?_?of?_?b(irth)?_?m((on)?th)?$/i,
      'value': 1
    },
    'dob_year': {
      'expression': /^d(a?te)?_?of?_?b(irth)?_?y(ear|r)?$/i,
      'value': 1980
    },

    // card details
    'card_number': {
      'expression': /^(credit|debit)?_?card_?(num(ber)?|no)?$/i,
      'value': '4929 0000 0000 6'
    },
    'card_valid_month': {
      'expression': /^(credit|debit)?_?(card)?_?(start|valid_?(from)?)_?month$/i,
      'value': '01'
    },
    'card_valid_year': {
      'expression': /^(credit|debit)?_?(card)?_?(start|valid_?(from)?)_?year$/i,
      'value': '2010'
    },
    'card_expiry_month': {
      'expression': /^(credit|debit)?_?(card)?_?expiry_?month$/i,
      'value': '12'
    },
    'card_expiry_year': {
      'expression': /^(credit|debit)?_?(card)?_?expiry_?year$/i,
      'value': '2015'
    },
    'security_code': {
      'expression': /^(credit|debit)?_?(card)?_?(verification|cv2|security)?_?code$/i,
      'value': '123'
    },

    // message/notes
    'message': {
      'expression': /^(message|(delivery|billing|card)?_?notes?|info(rmation)?|comments?)$/i,
      'value': 'This is a test.'
    },

    // concatenation
    'name': {
      'expression': /^(full|delivery|billing|card)?_?(name(_?on_?card)?|cardholder)$/i,
      'combine': [
        'forename',
        'surname'
      ],
      'separator': ' '
    },
    'address': {
      'expression': /^(delivery|billing|card)?_?address$/i,
      'combine': [
        'address1',
        'address2',
        'town'
      ],
      'separator': ', '
    },
    'dob': {
      'expression': /^d(ate)?_?of?_?b(irth)?$/i,
      'combine': [
        'dob_day',
        'dob_month',
        'dob_year'
      ],
      'separator': '/'
    },
    'card_valid': {
      'expression': /^(credit|debit)?_?(card)?_?(start|valid_?(from)?)y_?(da?te)?$/i,
      'combine': [
        'card_valid_month',
        'card_valid_year'
      ],
      'separator': ''
    },
    'card_expiry': {
      'expression': /^(credit|debit)?_?(card)?_?expiry_?(da?te)?$/i,
      'combine': [
        'card_expiry_month',
        'card_expiry_year'
      ],
      'separator': ''
    }
  };

  var concatFields = function(values, separator, data) {
    var r = [];

    for (var i = 0; i < values.length; i++) {
      if (values[i] in data) {
        var field = data[values[i]];

        if ('value' in field) {
          var value = field.value;

          if (typeof(value) == 'string') {
            if (value.length > 0) {
              r.push(value);
            }

          } else if (value.length) {
            var key = Math.floor(Math.random() * value.length);

            if (value[key].length > 0) {
              r.push(value[key]);
            }
          }

        } else if ('combine' in field && 'separator' in field) {
          r.push(concatFields(field.combine, field.separator, data));
        }
      }
    }

    return r.join(separator);
  }

  if (document.querySelectorAll) {
    var elements = document.querySelectorAll('input, textarea, select');

  } else {
    var elements = [];

    elements = elements.concat(document.getElementsByTagName('input'), document.getElementsByTagName('textarea'), document.getElementsByTagName('select'));
  }

  for (var i = 0; i < elements.length; i++) {
    var name = (elements[i].name ? elements[i].name : elements[i].id);

    for (var key in data) {
      var field = data[key];

      if (name.match(field.expression)) {
        var value = (('combine' in field && 'separator' in field) ? concatFields(field.combine, field.separator, data) : (('value' in field) ? field.value : false));

        if (value !== false) {
          if (elements[i].tagName.toLowerCase() == 'select') {
            for (var j = 0; j < elements[i].options.length; j++) {
              if (typeof(value) == 'string' || typeof(value) == 'number') {
                if (elements[i].options[j].value == value || elements[i].options[j].text == value) {
                  elements[i].selectedIndex = j;

                  break;
                }

              } else if (value.length) {
                if (value.indexOf(elements[i].options[j].value) > -1 || value.indexOf(elements[i].options[j].text) > -1) {
                  elements[i].selectedIndex = j;

                  break;
                }
              }
            }

          } else if (elements[i].tagName.toLowerCase() == 'input' && (elements[i].type == 'checkbox' || elements[i].type == 'radio')) {
            if (elements[i].value == value) {
              elements[i].checked = true;

            } else {
              elements[i].checked = false;
            }

          } else {
            if (typeof(value) == 'string' || typeof(value) == 'number') {
              elements[i].value = value;

            } else if (value.length) {
              elements[i].value = value[Math.floor(Math.random() * value.length)];
            }
          }

          elements[i].blur();
        }

        continue;
      }
    }
  }
})();

Initial URL
http://www.dom111.co.uk/blog/coding/autopopulate-0-1/249

Initial Description
I\'m constantly testing forms over and over for one reason or another, and am fed up with making a typo and autocomplete not populating all the data, so I made this little snippet. It searches for form elements on the page (input, textarea and select) and using regular expressions, tries to match the field name and populate the data as best it can. There\'s also a generator so instead of the random test data I\'ve provided you can generate your own.\r\n\r\nDemo:\r\n[http://www.dom111.co.uk/files/autoPopulate/](http://www.dom111.co.uk/files/autoPopulate/)\r\n\r\nGenerator:\r\n[http://www.dom111.co.uk/files/autoPopulate/generate.html](http://www.dom111.co.uk/files/autoPopulate/generate.html)

Initial Title
autoPopulate 0.1 - Automatically populate form fields using a bookmarklet

Initial Tags
form, javascript

Initial Language
JavaScript