JQuery Populate Fields and Serialize Objects
JQuery
by B L Praveen
HTML
<form id="profile">
<input type="text" name="name_field[first]" value="Time"/>
<input type="text" name="name_field[last]" value="New"/>
</form>
<form id="result">
<input type="text" name="name_field[first]" value="Test"/>
<input type="text" name="name_field[last]" value="One"/>
</form>
JavaScript
$.fn.populate = function populate(value,key) {
var form_fields= $(this),new_value=value;
patterns = {
key: /[a-z0-9_-]+|(?=\[\])/gi,
push: /^$/,
}
form_fields.find('input,select,textarea').each(function(i,input_field) {
console.log(input_field);
var val,key = $(input_field).attr('name');
console.log(key);
if(new_value instanceof Array) {
val= new_value[i];
}
if(new_value instanceof Object) {
var keys = key.match(patterns.key), k;
if (patterns.push.test(keys[(keys.length - 1)])) {
new_key = key.replace(/\[\]$/, '');
} else {
new_key = key;
}
var prevObj;
var count = keys.length;
$(keys).each(function(i,val) {
if(i == 0) {
if(value[val] === undefined){
new_value[new_key] = "";
return false
}
prevObj = value[val];
} else if (patterns.push.test(val)) {
new_value[new_key] = prevObj;
} else {
prevObj = prevObj[val];
console.log(prevObj);
}
if(i == (count -1)) {
console.log(new_key);
console.log(new_value);
new_value[new_key] = prevObj;
}
});
val= new_value[new_key];
}
if ($(input_field).is('select')){
$('option', $(input_field)).each(function() {
if (this.value == val)
this.selected = true;
});
} else if ($(input_field).is('textarea')) {
$(input_field).val(val);
} else {
switch($(input_field).attr("type")) {
case 'radio':
// use the single value to check the radio button
$(input_field).checked = ($(input_field).val() != '' && val.toString() == $(input_field).val());
break;
case...