Tweaking out of the box SharePoint 2013 forms - html

Question

I have the following situation. We are building a new intranet for our company and, being a charity, accomplishing AA accessibility is a must. I am a SharePoint developer and we are getting the design from a third party company. That said, designers made a custom design in a way that it is barely recalling SharePoint at all, like a kind of mixture between a completely different design like if it was a publishing site and at the same time, the idea is to work with as much out of the box functionality as possible.
That means that if I create a list, all the look and feel will be the customized one while the functionality must be kept. So I would get a settings page for the list whose functionality should be kept as is but the design should be the new design. A custom list (custom but created in SharePoint) would have a new, editing and display form which should be out of the box... but with the new design.
The problem comes with this out of the box forms. The design is using divs for displaying all the HTML controls that are linked to each of the columns of a custom list. Unfortunately, SharePoint 2013 out of the box list forms tabulate the fields using HTML tables.
Apparently there is a limit of 30000 characters in this post, so I can't paste the code from the out of the box form to show the tables, but what I did is to create a form with an example of each of the possible fields in SharePoint and then look at how many tables I was getting there. And I can't add a screenshot because I need 10 reputation...
I have removed in previous projects the tables in SharePoint webparts using a control adapter, which, by the way, I am using in this website too. But I am struggling with how I can change this HTML tables in the forms. I have tried to render the form same way that I did with the webpart zones but it is not working in a similar way.
Here you have the code for the Control Adapter for webpart zones:
public class WebpartControlAdapter : System.Web.UI.Adapters.ControlAdapter
{
protected override void Render(HtmlTextWriter writer)
{
var wpz = Control as Microsoft.SharePoint.WebPartPages.WebPartZone;
if (wpz != null)
{
WebPartCollection wpColl = new WebPartCollection(wpz.WebParts);
foreach (System.Web.UI.WebControls.WebParts.WebPart wp in wpColl)
{
wp.RenderControl(writer);
}
}
}
}
And here what I tried based on that, which is basically destroying my page completely:
public class PageControlAdapter : System.Web.UI.Adapters.PageAdapter
{
protected override void Render(HtmlTextWriter writer)
{
var currentPage = Control as Page;
if (currentPage != null)
{
System.Web.UI.HtmlControls.HtmlForm form = new System.Web.UI.HtmlControls.HtmlForm();
form = currentPage.Form;
form.RenderControl(writer);
}
}
}
So my question are if anyone has a solution or way to achieve this.
Thanks for any possible help.
P.D.: before you propose that, changing the .aspx files coming OOTB from SharePoint is not an option because we hold other web applications in the same farm and making changes there would provoke changes in all other websites.

Answer 1

I'am not sure what you want to acomplish.
If you are creating totally custom list and want a New, Display and Edit forms completly different then you can define which forms to use in contentType:
https://msdn.microsoft.com/en-us/library/office/aa543825.aspx
Example:
<?xml version="1.0" encoding="utf-8"?>
<Elements xmlns="http://schemas.microsoft.com/sharepoint/">
<!-- Parent ContentType: Workflow Task (0x010801) -->
<ContentType ID="0x010100AF4E4BE6CF8048959C4172F4298CE42A"
Name="MyName"
Group="MyGroup"
Description="MyDescription"
Version="0">
<FieldRefs>
</FieldRefs>
<XmlDocuments>
<XmlDocument NamespaceURI ="http://schemas.microsoft.com/sharepoint/v3/contenttype/forms/url">
<FormUrls xmlns="http://schemas.microsoft.com/sharepoint/v3/contenttype/forms/url">
<New>_layouts/MyFolder/New.aspx</New>
<Display>_layouts/MyFolder/New.aspx</Display>
<Edit>_layouts/MyFolder/Edit.aspx</Edit>
</FormUrls>
</XmlDocument>
</XmlDocuments>
</ContentType>
</Elements>
In code behind you get current item:
SPListItem item = SPContext.Current.ListItem;
Other possibility is to add script editor webpart on NewFrom, DisplayForm and EditForm. In script use jquery to change look of fields.
To auto populate scriptEditorWebparts you can make eventhandler fired on ListAdded event