1

I need to add a list view web part with c# like below:

enter image description here

My best guess is using PnP is the wat to go. I would think something like below is the first part (correct me if I am wrong):

var page = OfficeDevPnP.Core.Pages.ClientSidePage.Load(ctx, "Home.aspx");
var imageWebPart = page.InstantiateDefaultWebPart(DefaultClientSideWebParts.List);

However I can fint anything documentation on how to set the properties as shown in the image above. All help are apreciated.

Working sample from Lee's input: Add following to url to get properties: ?maintenancemode=true

  var ctx = ClientContextExtension.GetAppContext(txtSiteUrl.Text, _configuration.AppRegistrationId, _configuration.AppRegistrationKey, new EmptyLogger());
    var page = OfficeDevPnP.Core.Pages.ClientSidePage.Load(ctx, "Home.aspx");

    var components = page.AvailableClientSideComponents();

    var myWebPart = components.Where(s => s.ComponentType == 1 && s.Name == "f92bf067-bc19-489e-a556-7fe95f508720").FirstOrDefault();
    if (myWebPart != null)
    {
        ClientSideWebPart ListWP = new ClientSideWebPart(myWebPart);
        ListWP.PropertiesJson = "{\"isDocumentLibrary\": true,\"showDefaultDocumentLibrary\": false,\"webpartHeightKey\": 4,\"selectedListUrl\": \"/sites/segato-slet-5000-da/Delte dokumenter\",\"listTitle\":\"Older than 30 days\",\"selectedListId\": \"2fb1f209-ea06-4a16-aed0-30980b39ccb0\",\"webRelativeListUrl\": \"/Delte dokumenter\",\"selectedViewId\":\"a20b1b00-6659-4e12-8522-609f9367631a\",\"selectedFolderPath\":\"\",\"hideCommandBar\": true}";
        var column = page.Sections[0].Columns[1];
        page.AddControl(ListWP, column);
    }
    page.Save("Home.aspx");
  • Configure a page, use Export-PnPClientSidePage to save the file as a template and examine the properties for the part. That should help on what is needed. – Mikael Svenson May 14 at 20:22
  • 1
    I found out you can add following to url and you get all properties. ?maintenancemode=true – Thomas Segato May 15 at 7:28
0

Sample code for your reference.

Use SharePointPnPCoreOnline

string _FullUrl = "https://tenant.sharepoint.com/sites/lee";
            using (var clientContext = new ClientContext(_FullUrl))
            {
                Console.ForegroundColor = ConsoleColor.Green;
                string password = "password";
                SecureString sec_pass = new SecureString();
                Array.ForEach(password.ToArray(), sec_pass.AppendChar);
                sec_pass.MakeReadOnly();
                clientContext.Credentials = new SharePointOnlineCredentials("user@tenant.onmicrosoft.com", sec_pass);

                Web web = clientContext.Web;

                // load the page with name "page3.aspx"
                //ClientSidePage p = ClientSidePage.Load(clientContext, "ListPage.aspx");

                // get a list of possible client side web parts that can be added
                //var _components = p.AvailableClientSideComponents();

                // cc is the ClientContext instance for the site you're working with
                OfficeDevPnP.Core.Pages.ClientSidePage myPage = new OfficeDevPnP.Core.Pages.ClientSidePage(clientContext);
                myPage.PageTitle = "pageTitle";

                // get a list of possible client side web parts that can be added
                var components = myPage.AvailableClientSideComponents();

                // Find our custom "HelloWord" web part
                var myWebPart = components.Where(s => s.ComponentType == 1 && s.Name == "f92bf067-bc19-489e-a556-7fe95f508720").FirstOrDefault();
                if (myWebPart != null)
                {
                    // Instantiate a client side web part from our found web part information
                    ClientSideWebPart ListWP = new ClientSideWebPart(myWebPart);
                    ListWP.PropertiesJson = "{\"isDocumentLibrary\":false,\"selectedListId\":\"b15079b5-869b-4da8-87b6-ac0bfdf059e4\",\"listTitle\":\"MyList\",\"selectedListUrl\":\"/sites/lee/Lists/MyList\",\"webRelativeListUrl\":\"/Lists/MyList\",\"webpartHeightKey\":4}";
                    // Add the custom client side web part to the page
                    myPage.AddControl(ListWP);
                }

                // Persist the page to SharePoint
                myPage.Save("MyListWP1.aspx");
                Console.WriteLine("done");
                Console.ReadKey();
            }

According to Lee's feedback I tried getting properties from an existing configured web part:

var allWebParts = page.Controls.ToList();
var webParts = page.Controls.Where(c => c.Type.Name == "ClientSideWebPart").ToList();
var listViewWebPart = webParts[3];

The properties for this web part:

Properties:
{{
  "isDocumentLibrary": true,
  "showDefaultDocumentLibrary": true,
  "webpartHeightKey": 4,
  "selectedListUrl": "",
  "listTitle": "Documents"
}}

PropertiesJSON:

"{\"isDocumentLibrary\":true,\"showDefaultDocumentLibrary\":true,\"webpartHeightKey\":4,\"selectedListUrl\":\"\",\"listTitle\":\"Documents\"}"
  • Thanks appreciated! Do you know how to set the view and the title of the web part too? How do you know what properties you can set? – Thomas Segato May 14 at 7:43
  • Add one manually and then grab the webpart properties. ClientSidePage p = ClientSidePage.Load(clientContext, "ListPage.aspx") monitor p.Controls[i] properties. – Lee_MSFT May 14 at 7:48
  • I tried getting the properties but dosent provide much info: Properties: {{ "isDocumentLibrary": true, "showDefaultDocumentLibrary": true, "webpartHeightKey": 4, "selectedListUrl": "", "listTitle": "Documents" }} PropertiesJSON: "{\"isDocumentLibrary\":true,\"showDefaultDocumentLibrary\":true,\"webpartHeightKey\":4,\"selectedListUrl\":\"\",\"listTitle\":\"Documents\"}" Are you from Microsoft Lee? – Thomas Segato May 14 at 16:52
  • Lee what is the monitor part of your code? – Thomas Segato May 14 at 18:14
  • Got it working. Updated post. – Thomas Segato May 14 at 19:20

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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