Customizing List Forms using Javascript

A cool feature you can get access to using SharePoint Designer is the ability to create your own List forms. You can create a new NewForm page, with certain fields removed, or add the form to another page, allowing users to create or edit a new item without having to dig into the appropriate NewForm or EditForm.

In Designer, it's under the Insert -> SharePoint Controls -> Custom List Form.


I've been using this recently, and I wanted to be able to manipulate the fields using JavaScript. I would like to pre-fill certain fields with data, and hopefully create a better user experience.

So far, I've found two pages to be helpful:
Accessing and Changing Form fields - http://blogs.msdn.com/sharepointdesigner/archive/2007/06/13/using-javascript-to-manipulate-a-list-form-field.aspx

There is an example about halfway down for grabbing a people Picker field. Looks like it can only grab the first one?




I also needed to be able to grab and edit a Radio Button option
One solution I found was at:
http://blog.markuso.com/posts/9/using-javascript-to-access-a-list-form-field-in-sharepoint-designer/

This solution didn't work for me, it was looking for:

'FieldName="'+title+'" 

somewhere in the parent's innerHTML. My customized forms don't have that. I changed the code to look up another level and look for the Field name there. Seems to work ok. Example below:

function SetRadio(tagName, identifier, title, value) {
var len = identifier.length;
var tags = document.getElementsByTagName(tagName);
for (var i=0; i < idstring =" tags[i].id;" namestring =" tags[i].name;" type ="="" identifier ="="" tagparenthtml =" tags[i].parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.innerHTML;">'+title) > -1) {
var radioButtons = document.getElementsByName(nameString);
var radioValue = "";

for (var x=0; x < radioButtons.length; x++) {
if(radioButtons[x].parentElement.title == value){
radioButtons[x].checked = true;
}
else{
radioButtons[x].checked = false;
}
}
}
}
}
return null;
}