{"id":235,"date":"2019-10-09T09:35:35","date_gmt":"2019-10-09T09:35:35","guid":{"rendered":"http:\/\/4us2use.at\/?p=235"},"modified":"2019-10-10T07:57:03","modified_gmt":"2019-10-10T07:57:03","slug":"create-cascading-dropdowns-for-sharepoint-lists","status":"publish","type":"post","link":"http:\/\/4us2use.at\/?p=235","title":{"rendered":"Create Cascading Drop Down Input Form for SharePoint with PowerApps"},"content":{"rendered":"\n<p class=\"has-medium-font-size\">\n\nMy Scenario: \n\n<\/p>\n\n\n\n<p>I had the requirement to have a list input form in SharePoint online, that contains &#8220;Scope&#8221;, &#8220;Category&#8221; and a &#8220;Subcategory&#8221;. <br>Of course &#8211; to have it end user friendly &#8211; these dropdowns had to be cascading. <\/p>\n\n\n\n<p>First of all: as of today, cascading dropdowns in PowerApps only works smooth with TEXT only values!! (yes, it&#8217;s a real mess)<br>So how to prevent the user from typing mistakes with text only fields?<br>&#8211;> Provide the user a lookup input interface and create the text only values with a simple Flow.<\/p>\n\n\n\n<p class=\"has-medium-font-size\">Solution:<\/p>\n\n\n\n<ul><li>First of all create the lists &#8211; 3 simple lists with Title only for the lookup values and 2 lists for mapping<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" width=\"322\" height=\"208\" src=\"http:\/\/4us2use.at\/wp-content\/uploads\/2019\/10\/casc_lists-1.png\" alt=\"\" class=\"wp-image-248\" srcset=\"http:\/\/4us2use.at\/wp-content\/uploads\/2019\/10\/casc_lists-1.png 322w, http:\/\/4us2use.at\/wp-content\/uploads\/2019\/10\/casc_lists-1-300x194.png 300w\" sizes=\"(max-width: 322px) 100vw, 322px\" \/><\/figure>\n\n\n\n<ul><li>In the mapping lists make the Title not required, add 2 lookup columns that are required and 2 additional columns for the text value<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" width=\"894\" height=\"210\" src=\"http:\/\/4us2use.at\/wp-content\/uploads\/2019\/10\/casc_maplist.png\" alt=\"\" class=\"wp-image-249\" srcset=\"http:\/\/4us2use.at\/wp-content\/uploads\/2019\/10\/casc_maplist.png 894w, http:\/\/4us2use.at\/wp-content\/uploads\/2019\/10\/casc_maplist-300x70.png 300w, http:\/\/4us2use.at\/wp-content\/uploads\/2019\/10\/casc_maplist-768x180.png 768w\" sizes=\"(max-width: 767px) 89vw, (max-width: 1000px) 54vw, (max-width: 1071px) 543px, 580px\" \/><\/figure>\n\n\n\n<ul><li>Create a simple Flow for each of the two mapping lists, that updates the text columns, that we&#8217;ll use later for our dropdown values<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" width=\"451\" height=\"484\" src=\"http:\/\/4us2use.at\/wp-content\/uploads\/2019\/10\/casc_flow.png\" alt=\"\" class=\"wp-image-254\" srcset=\"http:\/\/4us2use.at\/wp-content\/uploads\/2019\/10\/casc_flow.png 451w, http:\/\/4us2use.at\/wp-content\/uploads\/2019\/10\/casc_flow-280x300.png 280w\" sizes=\"(max-width: 451px) 100vw, 451px\" \/><\/figure>\n\n\n\n<ul><li> Then create a target list (also text only fields for these three &#8220;dropdown&#8221; columns!) Of course all other columns can be treated as standard.<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" width=\"892\" height=\"184\" src=\"http:\/\/4us2use.at\/wp-content\/uploads\/2019\/10\/casc_maincol.png\" alt=\"\" class=\"wp-image-250\" srcset=\"http:\/\/4us2use.at\/wp-content\/uploads\/2019\/10\/casc_maincol.png 892w, http:\/\/4us2use.at\/wp-content\/uploads\/2019\/10\/casc_maincol-300x62.png 300w, http:\/\/4us2use.at\/wp-content\/uploads\/2019\/10\/casc_maincol-768x158.png 768w\" sizes=\"(max-width: 767px) 89vw, (max-width: 1000px) 54vw, (max-width: 1071px) 543px, 580px\" \/><\/figure>\n\n\n\n<ul><li>In the main list click on &#8220;Customize Form&#8221; under PowerApps menu<\/li><li> Unlock the 3 Data Cards under &#8220;Advanced&#8221;, replace the text input controls with dropdown controls and rename them to something meaningful like  <br>&#8220;ddScope&#8221;, &#8220;ddCategory&#8221; and &#8220;ddSubCategory&#8221; <\/li><li> set the &#8220;UPDATE&#8221; property of the data cards to the name of the SP field to be updated with the value <\/li><\/ul>\n\n\n\n<ul><li>Now modify the &#8220;Items&#8221; property of the new dropdown fields. <\/li><li><\/li><\/ul>\n\n\n\n<p>ddScope: <br><em>Distinct(cascMap_ScopeCat, LUScopeText) <\/em><br>ddCategory: <br><em>Filter(cascMap_ScopeCat, LUScopeText = ddScope.Selected.Result)<\/em> <br>ddSubCategory:<br><em>Filter(cascMap_CatSub, LUCategoryText = ddCategory.SelectedText.Value)<\/em> <\/p>\n\n\n\n<p class=\"has-small-font-size\">(if you want to sort the values, you can put a SortByColumns() function around the filter formula)<\/p>\n\n\n\n<ul><li>Now the lookups are already working, but if you click on Save, the values are not written to SharePoint. To fix this, we have to re-add the original columns to the form.  When added again, unlock them under Advanced and set the  &#8220;Default&#8221; property to the value of the dropdowns.  <\/li><\/ul>\n\n\n\n<p>Scope:<br><em>ddScope.Selected.Result<\/em><br>Category:<br><em>ddCategory.SelectedText.Value<\/em> <br>SubCategory:<br><em>ddSubCategory.SelectedText.Value<\/em> <\/p>\n\n\n\n<ul><li>Last but not least, hide those fields from the form by setting the &#8220;Visible&#8221; property to false<\/li><\/ul>\n\n\n\n<ul><li>Save, publish and enjoy \ud83d\ude09<\/li><\/ul>\n\n\n\n<p> <br><span id=\"post-ratings-235\" class=\"post-ratings\" data-nonce=\"df48a76ff3\"><img id=\"rating_235_1\" src=\"http:\/\/4us2use.at\/wp-content\/plugins\/wp-postratings\/images\/stars\/rating_off.gif\" alt=\"1 Star\" title=\"1 Star\" onmouseover=\"current_rating(235, 1, '1 Star');\" onmouseout=\"ratings_off(0, 0, 0);\" onclick=\"rate_post();\" onkeypress=\"rate_post();\" style=\"cursor: pointer; border: 0px;\" \/><img id=\"rating_235_2\" src=\"http:\/\/4us2use.at\/wp-content\/plugins\/wp-postratings\/images\/stars\/rating_off.gif\" alt=\"2 Stars\" title=\"2 Stars\" onmouseover=\"current_rating(235, 2, '2 Stars');\" onmouseout=\"ratings_off(0, 0, 0);\" onclick=\"rate_post();\" onkeypress=\"rate_post();\" style=\"cursor: pointer; border: 0px;\" \/><img id=\"rating_235_3\" src=\"http:\/\/4us2use.at\/wp-content\/plugins\/wp-postratings\/images\/stars\/rating_off.gif\" alt=\"3 Stars\" title=\"3 Stars\" onmouseover=\"current_rating(235, 3, '3 Stars');\" onmouseout=\"ratings_off(0, 0, 0);\" onclick=\"rate_post();\" onkeypress=\"rate_post();\" style=\"cursor: pointer; border: 0px;\" \/><img id=\"rating_235_4\" src=\"http:\/\/4us2use.at\/wp-content\/plugins\/wp-postratings\/images\/stars\/rating_off.gif\" alt=\"4 Stars\" title=\"4 Stars\" onmouseover=\"current_rating(235, 4, '4 Stars');\" onmouseout=\"ratings_off(0, 0, 0);\" onclick=\"rate_post();\" onkeypress=\"rate_post();\" style=\"cursor: pointer; border: 0px;\" \/><img id=\"rating_235_5\" src=\"http:\/\/4us2use.at\/wp-content\/plugins\/wp-postratings\/images\/stars\/rating_off.gif\" alt=\"5 Stars\" title=\"5 Stars\" onmouseover=\"current_rating(235, 5, '5 Stars');\" onmouseout=\"ratings_off(0, 0, 0);\" onclick=\"rate_post();\" onkeypress=\"rate_post();\" style=\"cursor: pointer; border: 0px;\" \/> (No Ratings Yet)<br \/><span class=\"post-ratings-text\" id=\"ratings_235_text\"><\/span><\/span><span id=\"post-ratings-235-loading\" class=\"post-ratings-loading\"><img src=\"http:\/\/4us2use.at\/wp-content\/plugins\/wp-postratings\/images\/loading.gif\" width=\"16\" height=\"16\" class=\"post-ratings-image\" \/>Loading...<\/span>  <br><\/p>\n\n\n\n<p><br><\/p>\n","protected":false},"excerpt":{"rendered":"<p>My Scenario: I had the requirement to have a list input form in SharePoint online, that contains &#8220;Scope&#8221;, &#8220;Category&#8221; and a &#8220;Subcategory&#8221;. Of course &#8211; to have it end user friendly &#8211; these dropdowns had to be cascading. First of all: as of today, cascading dropdowns in PowerApps only works smooth with TEXT only values!! &hellip; <\/p>\n<p class=\"link-more\"><a href=\"http:\/\/4us2use.at\/?p=235\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Create Cascading Drop Down Input Form for SharePoint with PowerApps&#8221;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":253,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[11,6],"tags":[],"_links":{"self":[{"href":"http:\/\/4us2use.at\/index.php?rest_route=\/wp\/v2\/posts\/235"}],"collection":[{"href":"http:\/\/4us2use.at\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/4us2use.at\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/4us2use.at\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/4us2use.at\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=235"}],"version-history":[{"count":14,"href":"http:\/\/4us2use.at\/index.php?rest_route=\/wp\/v2\/posts\/235\/revisions"}],"predecessor-version":[{"id":261,"href":"http:\/\/4us2use.at\/index.php?rest_route=\/wp\/v2\/posts\/235\/revisions\/261"}],"wp:featuredmedia":[{"embeddable":true,"href":"http:\/\/4us2use.at\/index.php?rest_route=\/wp\/v2\/media\/253"}],"wp:attachment":[{"href":"http:\/\/4us2use.at\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=235"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/4us2use.at\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=235"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/4us2use.at\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=235"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}