Change log
June 27. 2013
I have changed the function “init_fields_customForm()” to properly set the “fieldType” and “fieldDispName” in the fields object.
This is a repost of a previously published article. I have updated the code examples for compatibility with newer solutions. I cannot guarantee that this code will make all my various solutions work in a modified form as some of the solutions have a variant or the init_fields function embedded and you would have to modify it in the *.js file for that particular solution, but it will give you an idea on how it works.
I get this question a lot:
How can i use these scripts in a customized form?
The answer is simple, but i will explain it so that you understand why it’s not working.
This script relays in the function init_fields() to identify and “objectify” the form by it’s <TR> tags (table rows). What the function does is to find all the FieldInternalNames in the code by this “information-tag”:
<!-- FieldName="This is the DisplayName"
FieldInternalName="ThisIsTheFieldInternalName"
FieldType="SPFieldText"
-->
It then make an object which, when called with the FieldInternalName of a field, returns an object containing that table row (both formlabel and formtable).
When initiated like this:
fields = init_fields_v2();
You address a <TR> like this:
$(fields[FieldInternalName])
Where “FieldInternalName” is the FieldInternalName of your field. Read here how to identify the FieldInternalName.
This is the original function for use in standard SharePoint forms:
function init_fields_v2(){
var res = {};
$("td.ms-formbody").each(function(){
var myMatch = $(this).html().match(/FieldName="(.+)"\s+FieldInternalName="(.+)"\s+FieldType="(.+)"\s+/);
if(myMatch!=null){
// Display name
var disp = myMatch[1];
// FieldInternalName
var fin = myMatch[2];
// FieldType
var type = myMatch[3];
if(type=='SPFieldNote'){
if($(this).find('script').length>0){
type=type+"_HTML";
}else if($(this).find("div[id$='_TextField_inplacerte']").length>0){
type=type+"_EHTML";
}
}
if(type=='SPFieldLookup'){
if($(this).find('input').length>0){
type=type+"_Input";
}
}
// Build object
res[fin] = this.parentNode;
$(res[fin]).attr('FieldDispName',disp);
$(res[fin]).attr('FieldType',type);
}
});
return res;
}
Customized form
When you modify the list form in SharePoint Designer, you loose the FieldInternalName and therefore the function init_fields_v2() does not return anything.
To address the fields on a custom form you have to find another way of addressing these fields and to “objectify” them in the same way as the script init_fields_v2().
To achieve this, we add an id attribute to the <TD> that holds the ms-formlabel.
Here is an example of code from a customized form:
<tr>
<td width="190px" valign="top" class="ms-formlabel" id="TitleColumnCustomID" fieldType="SPFieldText" fieldDispName="Title">
<H3 class="ms-standardheader">
<nobr>Title<span class="ms-formvalidation"> *</span>
</nobr>
</H3>
</td>
<td width="400px" valign="top" class="ms-formbody">
<SharePoint:FormField runat="server" id="ff1{$Pos}" ControlMode="New" FieldName="Title" __designer:bind="{ddwrt:DataBind('i',concat('ff1',$Pos),'Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@Title')}"/>
<SharePoint:FieldDescription runat="server" id="ff1description{$Pos}" FieldName="Title" ControlMode="New"/>
</td>
</tr>
Note the id, fieldType and fieldDispName:
id=”TitleColumnCustomID” fieldType=”SPFieldText” fieldDispName=”Title”
To use the a custom made ID attribute, replace the init_fields_v2() function with this one:
function init_fields_customForm(){
var res = {};
$("td.ms-formlabel").each(function(i,e){
res[this.id] = $(this).parents('tr:first');
$(res[this.id]).attr("fieldType",$(this).attr("fieldType"));
$(res[this.id]).attr('fieldDispName',$(this).attr("fieldDispName"));
});
return res;
}
The field type attribute is essential to get right for the functions “getFieldValue” and “setFieldValue” to work!
List of field type identifiers
Field type |
FieldType identifier |
Singele line of text |
SPFieldText |
File name |
SPFieldFile |
Number |
SPFieldNumber |
Currency |
SPFieldCurrency |
Single choice column |
SPFieldChoice |
Multi choice column |
SPFieldMultiChoice |
User |
SPFieldUser |
Singel lookup |
SPFieldLookup |
MultiLookup |
SPFieldLookupMulti |
Boolean value (Yes/No) |
SPFieldBoolean |
Hyperlink or image |
SPFieldURL |
Date and time |
SPFieldDateTime |
Multi line of text |
SPFieldNote |
To “get” the Title field value you address it like this:
fields = init_fields_customForm();
var myTitleFieldValue = $(fields['TitleColumnCustomID']).find("input").val();
alert(myTitleFieldValue);
Ask if anything is unclear.
Regards
Alexander
Like this:
Like Loading...