How to use the SharePoint Web Controls

SharePoint brings its own controls, which can be used to display list items. In this article I want to show you how to use them in a Webpart. It took me a while to figure this out, because the documentation is kind of incomplete L…

OK. Lets start. First lets find out which SharePoint Web Control belongs to which data type in SharePoint.

 

 

 

 

 

SharePoint Web Control

How do we find which control belongs to the data type? We can simply look up this information on each field:

string siteUrl = “http://sharepoint”;
string webUrl = “spscontrols”;

using (SPSite site = new SPSite(siteUrl))

{

using (SPWeb web = site.AllWebs[webUrl])

{

SPList list = web.Lists[“ControlTest”];

foreach (SPField field in list.Fields)

{

Console.WriteLine(field.Title + " – “ + field.FieldRenderingControl);

}

}
}

SPControlMode

You can the controls in different Control Modes:

Use the Controls

So how do we use these controls? The answer to this question is simple: Just use them like “normal” System.Web Controls.

RichTextField rtf = new RichTextField();
rtf.ID = "MultilineRichText";
rtf.ListId = list.ID;
rtf.ItemId = item.ID;
rtf.FieldName = "MultilineRichText";
rtf.ControlMode = SPControlMode.Edit;
this.Controls.Add(rtf);

In this case the RichTextField shows the content from the “MultilineRichText” field from our list, and our listitem in the Editmode. ID and FieldName are the Displayname from our field. You have to set the List, Item and FieldName for the Control, because usually the SharePoint Controls will use the SPContext content (remember: the controls are used in the editform, newform.. pages of every SharePoint List).

With some lines of code, you can display all fields e.g. from the DefaultView of a SharePoint List:

Table table = new Table();
TableRow row;
TableCell cell;
for (int i = 0; i < list.DefaultView.ViewFields.Count; i++)
{

string fieldName = list.DefaultView.ViewFields[i];
SPField field = list.Fields.GetField(fieldName);

row = new TableRow();
cell = new TableCell();
cell.Text = field.Title;
row.Cells.Add(cell);

cell = new TableCell();

// Add a control from RH.SharePoint.SharePointWebControls
Control cntrl = SharePointWebControls.GetSharePointControls(field, list, item, SPControlMode.Display);
// if the control is null (because it can not be rendered with a SharePoint Control) return
if (cntrl == null) continue;

<p>
  cell.Controls.Add(cntrl); <br />row.Cells.Add(cell);
</p>

<p>
  cell = <span style="color:blue">new</span> <span style="color:#2b91af">TableCell</span>(); <br />cell.Controls.Add(SharePointWebControls.GetSharePointControls(field, list, item, <span style="color:#2b91af">SPControlMode</span>.Edit)); <br />row.Controls.Add(cell); <br />table.Rows.Add(row); </span>
</p>

<p style="background:#eeece1">
  <span style="font-size:9pt"><span style="font-family:consolas">} </p> 
  
  <p>
    <span style="color:blue">this</span>.Controls.Add(table);</span> </span>
  </p>
  
  <p>
    <img alt="" src="/files/042907_0902_Howtousethe2.png" />
  </p>
  
  <h2>
    Use a generic control
  </h2>
  
  <p>
    Instead of finding a specific control for each SPField, you can use the BaseFieldControl. The advantage is, that it doesn’t matter which field you want to render. The right control will be used.
  </p><div class=csharpcode> <pre class=alt><span class=lnum> 1: </span>BaseFieldControl webControl = field.FieldRenderingControl;</pre> 
  
  <pre>&lt;span class=lnum>   2:  &lt;/span>webControl.ListId = list.ID; </pre><pre class=alt><span class=lnum> 3: </span>webControl.ItemId = item.ID; </pre> 
  
  <pre>&lt;span class=lnum>   4:  &lt;/span>webControl.FieldName = field.Title;</pre><pre class=alt><span class=lnum> 5: </span>webControl.ID = GetControlID(field);</pre> 
  
  <pre>&lt;span class=lnum>   6:  &lt;/span>webControl.ControlMode = mode;</pre>
</p></div> </div> <div class=ExternalClassC839B5ACA0E64E7B91791F281FEFB4F2> </div> <div class=ExternalClassC839B5ACA0E64E7B91791F281FEFB4F2>I have updated my class to use the generic instead of finding the matching Webcontrol. This approach makes it easier to use MOSS controls. You don’t have to distinct between WSS and MOSS controls any more.</div> <div class=ExternalClassC839B5ACA0E64E7B91791F281FEFB4F2> 

<p>
  <img src="/files/download2.gif" /> You can Download the RH.SharePoint.SharePointWebControls class <a href="/files/RH.SharePoint.SharePointWebControls.zip">here</a>.
</p>

<p>
  <font size=3>Update:</font>
</p>

<p>
  I updated my SharePointWebControls.
</p>

<p>
  <font size=3>Update 21. Apr 2008:</font>
</p>

<p>
  I updated my SharePointWebControls. This version includes a seperate file, which handels publishing controls from the Microsoft Office SharePoint Server 2007.
</p>

<p>
  <font size=3>Update 19. Jan 2009:</font>
</p>

<p>
  <a href="">SharePoint Web Controls to access remote content</a>
</p></div> 

<p>
  <font size=3>Update 22. Feb 2009:</font>
</p>

<p>
  The class not uses a generic control instead of a control for each field type.
</p></div>