Tuesday, June 5, 2012

Custom List Form in SharePoint Designer 2010 will not render if the list columns are more then 70 : Resolved

In SharePoint 2010, You can easily create custom list forms in SharePoint Designer, but some List Form will not render through error as “Unable to display this Web Part. To troubleshoot the problem, open this Web page in a Microsoft SharePoint Foundation-compatible HTML editor such as Microsoft SharePoint Designer. If the problem persists, contact your Web server administrator.”



Here is the resolution of problem. Follow below link.

http://social.technet.microsoft.com/Forums/en/sharepoint2010customization/thread/11a8b7c7-6bdd-485e-a8c6-083896cf6f83

Also I have copied the solution provide by Linda Chapman [MSFT]. Thanks Linda for your contribution.
Custom List Form in SharePoint Designer 2010 will not render if the list has a large number of columns.

Symptom
Custom List Form will not render if the list has a large number of columns. To reproduce this issue create a custom list and add 68 single line of text columns. The custom list form web part will not render and an error message such as this will occur in the browser:

Unable to display this Web Part. To troubleshoot the problem, open this Web page in a Microsoft SharePoint Foundation-compatible HTML editor such as Microsoft SharePoint Designer. If the problem persists, contact your Web server administrator.

Correlation ID:

For more information about custom list forms please refer to this article:

http://office.microsoft.com/en-us/sharepoint-designer-help/create-a-custom-list-form-using-sharepoint-designer-HA010378258.aspx

Cause

This occurs when a large XSL transforms happens in a single template.

Resolution
The issue can be resolved by breaking up the offending xsl template into smaller parts to avoid a large transform.

This example is for a New Form custom list form. The Edit Form is similar in template naming convention. Please refer to the end of the article for the template names of the various form modes.

1. Open the page that contains the none working custom list form web part.
2. Switch to code for this this workaround.
3. Search for the following string:


<xsl:call-template name="dvt_1.rowedit"/>


4. Copy this line paste it 3 to 5 times. The table structure and other components that makeup this template will be divided into the other copied templates. A general guideline is to have about 20 to 40 table rows per template. There is a fair amount of give with this recommendation.

5. Rename each pasted template by adding a number to the end of it.


<xsl:call-template name="dvt_1.rowedit"/>
<xsl:call-template name="dvt_1.rowedit2"/>
<xsl:call-template name="dvt_1.rowedit3"/>
<xsl:call-template name="dvt_1.rowedit4"/>
<xsl:call-template name="dvt_1.rowedit5"/>


6. Now, press the control key and click the dvt_1.rowedit. This will highlight the template's first line which is this:


<xsl:template name="dvt_1.rowedit">

7. Place the cursor infront of the less than sigh of <xsl:template name="dvt_1.rowedit">
8. Hold down Control + Shift and then press semicolon. This will highlight the entire template.
9. Go to the bottom of the template. The following should be the last line: </xsl:template>

9. Paste the following markup after the closing xsl temlate tag from stpe 9. In this example there are 5 different dvt_1.rowedit templates calls so we'll need 5 <xsl:template> elements to match.


<xsl:template name="dvt_1.rowedit">
<xsl:param name="Pos" select="position()"/>
<tr>
<td>
<table border="0" cellspacing="0" width="100%">

</table>
</td>
</tr>
</xsl:template>


10. Rename each of the templates pasted in step 9 to match the templates from step 5.


<xsl:template name="dvt_1.rowedit">

<xsl:template name="dvt_1.rowedit2"> 

11. Next, the conents of <xsl:template name="dvt_1.rowedit"> needs to be divided among the new templates, <xsl:template name="dvt_1.rowedit2">, <xsl:template name="dvt_1.rowedit3"> and so forth. The easiest way to do this is to start at the end of the template and cut out the last few table rows and paste them into the last template that was created. In this example that would be <xsl:template name="dvt_1.rowedit5">

The individual table rows that represent the various SharePoint fields are stored inside of the table HTML element and that valid HTML needs to be persisted into the new templates. A good way of ensure this happens is to find <table border="0" cellspacing="0" width="100%"> in <xsl:template name="dvt_1.rowedit"> and perform a Control + Shift + Semicolon to highlight the entire table.

Once this is done scroll down to the end of the table and carefully take entire table rows, <tr>, and their contents over to the last xsl template.

By default the following is the last chunk of markup in <xsl:template name="dvt_1.rowedit">:


<tr id="idAttachmentsRow">
<td nowrap="true" valign="top" class="ms-formlabel" width="20%">
<SharePoint:FieldLabel ControlMode="New" FieldName="Attachments" runat="server"/>
</td>
<td valign="top" class="ms-formbody" width="80%">
<SharePoint:FormField runat="server" id="AttachmentsField" ControlMode="New" FieldName="Attachments" __designer:bind="{ddwrt:DataBind('i','AttachmentsField','Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@Attachments')}"/>
<script>
var elm = document.getElementById('idAttachmentsTable');
if (elm == null || elm.rows.length == 0)
document.getElementById('idAttachmentsRow').style.display='none';
</script>
</td>
</tr>
<xsl:if test="$dvt_1_automode = '1'" ddwrt:cf_ignore="1">
<tr>
<td colspan="99" class="ms-vb">
<span ddwrt:amkeyfield="ID" ddwrt:amkeyvalue="ddwrt:EscapeDelims(string(@ID))" ddwrt:ammode="view"></span>
</td>
</tr>
</xsl:if>


This particular table row represents the attachment functionality inside of a custom list form. This should not be in multiple templates and makes sense to go to the last XSL template created.

All the other table rows, <tr>, should contain the various columns in your list. Again, start from the bottom and work up to keep this exercise easy.

Adjust these steps accordingly if custom HTML layout is used to display field controls.

12. Finally, here is an example of the finished product. Each template only contains 1 column and the attachment functionality in the last xsl template. Also, only <xsl:template name="dvt_1.rowedit"> and <xsl:template name="dvt_1.rowedit2"> were included.


<xsl:template name="dvt_1.rowedit">
<xsl:param name="Pos" select="position()"/>
<tr>
<td>
<table border="0" cellspacing="0" width="100%">
<tr>
<td width="190px" valign="top" class="ms-formlabel">
<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>
</table>
</td>
</tr>
</xsl:template>

<xsl:template name="dvt_1.rowedit5">
<xsl:param name="Pos" select="position()"/>
<tr>
<td>
<table border="0" cellspacing="0" width="100%">
<tr>
<td width="190px" valign="top" class="ms-formlabel">
<H3 class="ms-standardheader">
<nobr>NewColumn90</nobr>
</H3>
</td>
<td width="400px" valign="top" class="ms-formbody">
<SharePoint:FormField runat="server" id="ff91{$Pos}" ControlMode="New" FieldName="NewColumn90" __designer:bind="{ddwrt:DataBind('i',concat('ff91',$Pos),'Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@NewColumn90')}"/>
<SharePoint:FieldDescription runat="server" id="ff91description{$Pos}" FieldName="NewColumn90" ControlMode="New"/>
</td>
</tr>
<tr id="idAttachmentsRow">
<td nowrap="true" valign="top" class="ms-formlabel" width="20%">
<SharePoint:FieldLabel ControlMode="New" FieldName="Attachments" runat="server"/>
</td>
<td valign="top" class="ms-formbody" width="80%">
<SharePoint:FormField runat="server" id="AttachmentsField" ControlMode="New" FieldName="Attachments" __designer:bind="{ddwrt:DataBind('i','AttachmentsField','Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@Attachments')}"/>
<script>
var elm = document.getElementById('idAttachmentsTable');
if (elm == null || elm.rows.length == 0)
document.getElementById('idAttachmentsRow').style.display=&apos;none&apos;;
</script>
</td>
</tr>
<xsl:if test="$dvt_1_automode = '1'" ddwrt:cf_ignore="1">
<tr>
<td colspan="99" class="ms-vb">
<span ddwrt:amkeyfield="ID" ddwrt:amkeyvalue="ddwrt:EscapeDelims(string(@ID))" ddwrt:ammode="view"></span>
</td>
</tr>
</xsl:if>
</table>
</td>
</tr>
</xsl:template>

Supplemental Information

The following are the template names for Edit Forms and Display Forms. The same concept applies to these as the New Form templates.

Display Form:


<xsl:call-template name="dvt_1.rowview"/> and <xsl:template name="dvt_1.rowview">


Edit Form, which is the same as New Form:


<xsl:call-template name="dvt_1.rowedit"/> and <xsl:template name="dvt_1.rowedit">

Enjoy !!!

1 comment: