I have created a new custom list form (NewFormList.aspx) using Sharepoint designer.

Sharepoint will provide html controls (input, select,..) in below format.

<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"/>

I want to customize and handle all the controls like adding Class="", Custom attributes, AngularJs directives in the form elements

<div ng-app="">
Name: <input type="text" ng-model="Name">
<!--Ex: I want to get the above input tag with ng-model directive  
<SharePoint:FormField ng-model="Name"></SharePoint:FormField> -->
My Name : {{Name}}

I have tried to add CssClass for adding class and custom attribute but sharepoint doesn't accept it.

I'm new to Sharepoint and looking for your help on how to handle this part.

Thanks in Advance !

1 Answer 1


While not able to add custom fields, I decided to wrap the target input control with a tag so that I can manipulate the target SharePoint Field by referencing it's parent:

<td width="400px" valign="top" class="ms-formbody" title="tdcompanynamezhi">

    <SharePoint:FormField runat="server" id="ff3{$Pos}" ControlMode="New" FieldName="companynamechi" __designer:bind="{ddwrt:DataBind('i',concat('ff3',$Pos),'Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@companynamechi')}"/>


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.