Author: Manpreet Singh

Cascading of Lookup Dropdown Fields on SharePoint 2013 and Office 365

/ Manpreet Singh / 1 Comment

Welcome to an article on the ‘Cascading of Dropdown fields on SharePoint 2013 & Office 365’. This is a major approach when we build forms and when we have to use multiple look up fields on the form and they should be related to each other as a parent and child relationship.

So what happens is, when you select a parent, other child items are related to it. So if you select a particular parent, all the child items related to the parent will appear.

Let’s see it.

  • Create a list named “Company”.
  • Click on Add an app,

    Add an app

  • Choose the Custom List App.

    Custom List App

  • Click on it and create a ‘Company’ List.

    create a Company List

  • Once the list is created, add in the names of the companies.

    list is created

  • As per the screenshot below.

    Company

  • Create another list named as “Employee”

    Create another list

  • Once the list is created, Create a look up column named as Company from our Company List.

    Company List

  • As you can see below, Clock on Create Column and the choose Lookup.

    Create Column

  • Select the list as Company and choose the Title field while configuring the lookup column.

    configuring the lookup

  • So here we can see our look up column has values from another list.

    values from another list

  • Fill in your required values; as for mine, I have filled in the name of the employees under the Title and have selected the company names from my look up field.

    employees

  • Now create a third list as Database.

    list as Database

    new item

  • Add the two look up columns, Company from the company list, and select title as the source of the column as per the screen shot below.

    Add the two look up column

  • Add the second look up columns; Employee from the employee list as per the screen shot below, selecting title as the field of source column.

    Employee from

  • So this will be your blank list view with all the columns,

    list view

  • When you click on New Item as you have added both the column as lookup they should display all the values but no, we are controlling their values as parent and child relationship as per the screen below.

    – If you select Company as “CTS”, the employee sees Manpreet as the value.

    select Company as CTS

    CTS

    – Here when you select “Infy” as the Company name, Baghel is displayed as the Employee.

    Infy

  • How was it done?

    – Go to the Database list.

    – Under the list tab select “Default New Form”.

    Default New Form

    – Add a ‘Script Editor’ web part and paste the code below.

    database

    Code:

    1. “https://site name/jquery.min.js”>
    2. “https://sitename/jquery.SPServices.min.js”>
    3. “text/javascript”>
    4. $(document).ready(function ()
    5. {
    6.     $().SPServices.SPCascadeDropdowns(
    7.     {
    8.         relationshipList: “Employee”,
    9.         relationshipListParentColumn: “Company”,
    10.         relationshipListChildColumn: “Title”,
    11.         parentColumn: “Company”,
    12.         childColumn: “Employee”,
    13.         debug: true
    14.     });
    15. });
  • Click on OK and come back to the Database List and click on New Form.
  • Your Cascading will start functioning.

Here we saw today an amazing functionality of Cascading of lookup Dropdown fields on SharePoint 2013 & Office 365. Keep reading more articles and keep learning.

Create A SharePoint Group Using REST API In SharePoint Online And Office 365

/ Manpreet Singh / 1 Comment

Welcome to an article on “How to Create a SharePoint Group using REST API in SharePoint Online and Office 365” where we will see the steps to creating an app using Napa Tool which will help us to create as many SharePoint groups as we require using REST API.

  • Open the “NAPA” Office 365 Development Tools through your SharePoint store.
  • Click on Add New Project.
  • It will ask you, what type of app do you want to build?

    Recent

  • Select SharePoint Add-in and provide a name to your app and click on Create.

    Run

    You will see the screen below on the app

    content

  • Click on Default.aspx and paste the code below under the “<asp:ContentContentPlaceHolderID=”PlaceHolderMain” runat=”server”>”.

    Code:

    1. <p <b>Create Site Group</b>
    2.    <br />
    3.    <input type=“text” value=“Enter the name of the group” id=“groupname” />
    4.    <button id=“creategroupbtn”>Create Group</button>
    5. </p>
  • Now on the navigation click on the App.js file and paste the code below removing the previous code completely.

    Code:

    1. ‘use strict’;
    2. var hostweblink;
    3. var applink;
    4. // on load functions to be called
    5. $(document).ready(function ()
    6. {
    7.     hostweblink = decodeURIComponent(getQueryStringParameter(“SPHostUrl”));
    8.     applink = decodeURIComponent(getQueryStringParameter(“SPAppWebUrl”));
    9.     //click function on the button click
    10.     $(“#creategroupbtn”).click(function (event)
    11.     {
    12.         createnewgroup();
    13.         event.preventDefault();
    14.     });
    15.     var scriptlink = hostweblink + “/_layouts/15/”;
    16.     $.getScript(scriptlink + “SP.RequestExecutor.js”);
    17. });
    18. //retrieve the web link 
    19. function getQueryStringParameter(paramToRetrieve)
    20.     {
    21.         var paramval = document.URL.split(“?”)[1].split(“&”);
    22.         for (var i = 0; i < paramval.length; i = i + 1)
    23.         {
    24.             var Paramval1 = Paramval1[i].split(“=”);
    25.             if (Paramval1[0] == paramToRetrieve) return Paramval1[1];
    26.         }
    27.     }
    28.     // functions to create new group
    29. function createnewgroup()
    30.     {
    31.         var newgroupName = document.getElementById(“groupname”).value;
    32.         var play;
    33.         play = new SP.RequestExecutor(applink);
    34.         play.executeAsync(
    35.         {
    36.             url: applink + “/_api/SP.AppContextSite(@target)/web/sitegroups?@target='” + hostweblink + “‘”,
    37.             method: “POST”,
    38.             body: “{ ‘__metadata’: { ‘type’: ‘SP.Group’ }, ‘Title’:'” + newgroupName + “‘}”,
    39.             headers:
    40.             {
    41.                 “content-type”: “application/json; odata=verbose”,
    42.             },
    43.             success: creategroupcompleted,
    44.             error: creategroupdenied
    45.         });
    46.     }
    47.     //creategroupcompleted
    48. function creategroupcompleted(data)
    49.     {
    50.         alert(“Group Created successfully”)
    51.     }
    52.     // creategroupdenied
    53. function creategroupdenied(data, errorCode, errorMessage)
    54. {
    55.     alert(“Group cannot be created due to the “ + errorMessage);
    56. }
  • Click on the settings icon on the tool on the left.
  • Under the properties, select Permissions and provide full control to the app on the Site Collection level.

    Permiaaion

  • Click on the deploy button on the left and run the project.

    Run project

  • Click on the launch button.

    Lunch app

  • Accept the trust and click on ‘Trust It’.

    Click on Trist it

  • Your app will be deployed and open for you as per the following screenshot:

    My app

  • Provide a name of the group you want to create and click on ‘Create Group’.

    Page title

  • Your group will be created by your own app and you can find the group the People and Group on your Site’s settings.My app

You will love your app. Keep reading and keep learning!

Honored again as “Microsoft® MVP”

/ Manpreet Singh / Leave a comment

I have two things a good news and in another need your views.
I am honored again as “Microsoft® MVP” with Microsoft’s Most Valuable Professional Award. Thank You CSharpCorner & Praveen Kumar along with all the awesome #csharpcorner editors behind the scenes.
Thank You very much Juan Carlos Ruiz Pacheco & #mvpbuzz

Secondly,
I have build a personal assistant for you, your kids and you home using artificial intelligence for your daily activities and would love to have a suggestion of name from you.
Post your comments with what would you like to call your personal assistant.

#mvp #mvpbuzz #office365#technology #csharpcorner Microsoft en ArgentinaMicrosoftMicrosoft Visual StudioMicrosoft DeveloperMicrosoft De Argentina S.A. #mvpbuzz The Official Microsoft MVP CommunityC# Corner Chennai MVP Group

 

mvp