Saturday, January 8, 2022

PowerApps: Change Type Of Column On Form

Hello Friends,

Welcome back with another post on PowerApps. Today, we will discuss something different. Let's suppose, you have a list where you are having columns as "Single line of text". But you need to provide a functionality in which, the PowerApps form should show a dropdown to pick value for that particular column. Based upon this selection, you need to fill another dropdown. But the problem is that the values in dropdown need to pull from another master list. How will you do that?

Let's try-

  1. I have a master list of Country vs States-
  2. I have created another list named ApproversMaster-
  3. This list have 3 columns-
    1. Title: It represents Country (Single line of text)
    2. State: It represents State (Single line of text)
    3. Approver1: It represents the name of approver (Person or group)
  4. Now, we want to save records in ApproversMaster but on New/Edit form, instead of text box for Country/State, I need dropdown which are linked to Country-States list.
  5. So, How do we do it? Start with a PowerApps app-
  6. I am creating a Canvas App of Tablet format with name as ApproversMasterApp.
  7. Now add SharePoint connection by clicking on Data link-
  8. Choose SharePoint as data source, create connection. choose SharePoint Site, and then choose both lists and click on Connect-
  9. This way, we had added both lists to PowerApps.
  10. Save the app.
  11. Now, click on Insert >> Forms >> Edit Form from top navigation bar to add an Edit Form.
  12. Choose "ApproverMaster" as Data source. The form will look like-
  13. Now, change the Default mode of form to New-
  14. As we can see, that Title & State fields are reflecting as TextInput, we need drop down here, so we will edit the DataCard for both and replace the TextInput control with Dropdown control.
  15. Unlock the Datacard properties for both controls-
  16. Save the app.
  17. First we will replace the control for Title. For this, just copy the X, Y, Height, Width property values in notepad for this text input control (DataCardValue1) select the TextInput control for Title and delete it-
    1. Now update it's X, Y, Height, Width, Name (as DataCardValue1) properties. The control will still showing error. It is because, The Update property of This DataCard is still saying to fetch values as DataCardValue1.Text but drop down does not have Text property. It has .Selected property. Well we will come to it later. First we will bind the data to it.
    2. Update the Items property of dropdown-
      1. Distinct('Country-States',Title)
    3. Now, click on the error, your form is showing and update the formula as 
      1. DataCardValue1.Selected.Result
    4. The moment you update it, the error will get removed-
  18. Change the Default property of this dropdown to-
    1. Parent.Default
  19. Save and play it. It data doesn't loaded. Close the app completely and re-open it. Now data will start reflecting.
  20. Next is State field. Repeat the process by-
    1. Delete the existing control
    2. Add drop down
    3. rename it
    4. set X, Y, Height, Width
    5. set Default
  21. Now, we will bind items. Here we need to filter the Country-State list based upon what is selected in Country (Title) field upon screen-
  22. Update the Items property as-
    1. Filter('Country-States',Title=DataCardValue1.Selected.Result).State
  23. Last update the error by changing the Udpate property to -
    1. DataCardValue2.Selected.State
  24. Save it, close it, reopen it and play it.
  25. The magic is here-
  26. It's not over yet. We need to save the data into list as well. Let's see, if it will work or not?
  27. Add a button. Name it Submit and change the OnSelect property as-
    1. SubmitForm(Form1)
  28. Save the app and play it.
  29. I am trying to save below data-
  30. After clicking on Submit button, I checked the list and it comes out to be-
  31. Hurray! We have done it.
  32. It does not ends here. If we are editing the item then what will happen? Let's see, I have added 2 more records-
  33. Also, I have created a copy of the screen to set the form property as Edit. Let us suppose, we need to update the second item (USA/Arizona). For demo purpose, I am statically setting the Item property of the second screen form as -
    1. First(Filter(ApproversMaster,ID=2))
  34. The screen would like display as-
  35. You will see, the moment you will save the app, content in respective controls will get automatically adjusted according to that particular item.
  36. Now, I am going to change Arizona to Alaska and clicking on Submit button. Let's see, what the list is now showing-
  37. This way, you can manage the situation between what is in the list and what needs to show on screen.
With this, I am concluding this post.
Happy Coding !!!
Will see you again with some new topics.

Stay Safe !
Stay Healthy !

No comments:

Post a Comment

Note: Only a member of this blog may post a comment.