Skip to main content

Create Custom New Edit and Display form for sharepoint list

Reference URL
http://blog.karstein-consulting.com/2010/12/29/walkthrough-create-custom-sharepoint-2010-list-form-for-deployment-in-a-visual-studio-2010-project/

Another post

http://www.ilikesharepoint.de/2013/11/sharepoint-create-custom-list-forms-with-visual-studio-part-1/

Check out the other solution for 2013 

http://www.ilikesharepoint.de/2013/11/sharepoint-create-custom-list-forms-with-visual-studio-part-1/


Walkthrough: Create custom SharePoint 2010 list form for deployment in a Visual Studio 2010 project

(This is part 1 of 2. See link below.)

Today I want to show you how to create a custom list form for deployment within a custom list template developed in Visual Studio 2010.
Download or update or modify my demo code on Codeplex.com:
http://spcustomlistformdemo.codeplex.com/

For me I was difficult to figure out this way. I could not find a good documentation about this topic so Iā€™ll write ist ā€“ If you found another description please post a link in the comments below. Thanks!

1. Create a Site Collection in your SharePoint 2010. Mine is called ā€œhttp://sharepoint.local/sites/listformā€

2. In Visual Studio 2010 create an empty SharePoint 2010 project.




Choose ā€œDeploy as farm solution!ā€



3. Add new item to you project: ā€œList Definitionā€ with type ā€œCustom listā€ and with ā€œAdd a list instanceā€






4. Deploy this project ā€œas isā€.

5. Have a look in your browser:




6. Open SharePoint Designer 2010 (SPD) and open the site ā€œhttp://sharepoint.local/sites/listformā€. Open the deployed list ā€œSPCustomListFormDemo ā€“ ListInstance1ā€




7. In the SPD in the List Settings of ā€œSPCustomListFormDemo ā€“ ListInstance1ā€ click the Ribbon tab ā€œList Settingsā€. Then click ā€œList Formā€. You get this dialog:




Enter the name of the new list form, e.g. ā€œnew2.aspxā€.

8. In SPD in the List Settings in the ā€œFormsā€ view you can see your newly created list form.





Select it and open it for edit.

Click ā€œAdvanced Modeā€ in the Ribbon !!!



Select all the content of the new2.aspx file.

Copy the HTML code.

Open NOTEPAD and paste the HTML code.



9. Go into your project in Visual Studio 2010. There add a new project item of type ā€œApplication Pageā€. Name it ā€œnew2.aspxā€.





The page will be created in folder ā€œLayoutsSPCustomListFormDemoā€



With ā€œdrag & dropā€ Move the new2.aspx note to your List Definition:



Remove the ā€œLayoutsā€ folder. You get:



Select ā€œnew2.aspxā€ in the Solution Explorer and change its property ā€œDeploymentTypeā€ to ā€œElementFileā€



10. In VS2010 open ā€œnew2.aspxā€ for edit. Delete all content of the file except this two lines:




Replace the ā€œDynamicMasterPageFileā€ attribute name through ā€œMasterPageFileā€. You get:



11. Got to NOTEPAD. Remove the ā€œPageā€ tag as marked in the screenshow:




Select the rest of the file and copy it to the clipboard.

Now remove the complete content of the ā€œZoneTemplateā€ node. ā€“ Do not remove the ā€œZoneTemplateā€ node itself. Now the specific part of ā€œnew2.aspxā€ looks like this:



(There is a ā€œDataFormWebPartā€ included in the ā€œZoneTemplateā€ node. This you remove by following the last step from above. But at runtime SharePoint will create a new DataFormWebPart in the Web Part Zone with ID ā€œMainā€. Thatā€™s the reason why we need to remove the copied and pasted Web Parts: Itā€™s one of such a DataFormWebPart too much on the site after SharePoint creates the new one on runtimeā€¦)

12. In VS2010 paste the code into ā€œnew2.aspxā€

13. Open ā€œnew2.aspx.csā€ from the Solution Explorer:





Insert this ā€œusingā€:



Replace the base type of your class definition from ā€œLayoutsPageBaseā€ to ā€œWebPartPageā€.

14. In the Solution Explorer open ā€œschema.xmlā€ of your list definition:





Scroll to the bottom of the file and find this part of XML code:



Replace the ā€œSetupPathā€ attribute of the Form node with type ā€œNewFormā€ with this value:features$SharePoint.Feature.DeploymentPath$ListDefinition1new2.aspx


You get:



15. Deploy your solution.

16. Go into the browser, reload the list and ā€œadd new itemā€.


Now your custom list form will be used!

The URL in the Browser is identically to the first try! Why is it ā€œNewForm.aspxā€ and not ā€œnew2.aspxā€?

-> SharePoint uses ā€œNewForm.aspxā€ as page for ā€œAdd new itemā€ but internally redirects to the defined ā€œNew Formā€ of the list.

You can add some code for demo purpose to help you identifying your custom list form. For that reason I inserted

<h1>Hello World</h1>

into the the ASP Content PlaceHolder ā€œPlaceHolderMainā€:




The final result:



Now you can do your own staff on your custom list form.

Part Two Your can check here 

Regards
3art Technology Experts
http://www.3art.tech

Comments

Popular posts from this blog

[Solved] SharePoint 2013 And Adobe Reader Problem : The URL you have provided could not be reached. Please verify that the URL is correct and that the network location is reachable

Dear All  When trying to open a PDF file from a mapped drive in SharePoint 2010.  You might see the following error message. The URL you have provided could not be reached. Please verify that the URL is correct and that the network location is reachable. 1. Open the registry. 2. Go to HKLM Local Software\SOFTWARE\Policies\Adobe\\\FeatureLockDown. 3. Create a key called cSharePoint. 4. Create a DWORD value called bDisableSharePointFeatures. 5. Set its value to 1. Regards Rashid Imran Bilgrami CEO Best visualization http://www.bestvisualization.com  

Content Query Webpart Template In SharePoint 2013 and add new column in it

Dear All, Here is the easiest way to make add custom column under your content query web part and then you can format it as you want. Step 1:  Open Sharepoint design Step 2:  Open site for sharepoint parent site collection Step 3:  Locate the following folder Style Library > XLS Style Sheets Step 4:  Open "ItemStyle.xsl"  file Add the custom style sheet as you want <xsl:template name="[Your Style Name]" match="Row[@Style='[Your Style Name]']" mode="itemstyle">                                                   <xsl:param name="CurPos" />                          ...

SharePoint: A Complete Guide to Getting and Setting Fields using C#

Original article https://social.technet.microsoft.com/wiki/contents/articles/21801.sharepoint-a-complete-guide-to-getting-and-setting-fields-using-c.aspx Introduction This article demonstrates how to set and get the various SPField types for a SharePoint list using C#. The examples demonstrated set and get fields from an item that belongs to a custom list. The custom list contains a number of fields, and all the fields are named based on the type of field they are. For example, there is a Text field, which has been named, textfield. This is depicted in the following picture:   Applies To The examples demonstrated below are tested with and apply to the following versions of SharePoint: SharePoint 2010 SharePoint 2013 Get the List, and the first SPListItem This is the basic code for getting an item. If the list has at least one item, the first item is retrieved, otherwise a new item is created. var web = SPContext.Current.Site.RootWeb; var list = web.Lists...