{"id":33827,"date":"2023-01-23T15:32:00","date_gmt":"2023-01-23T10:02:00","guid":{"rendered":"https:\/\/www.inogic.com\/blog\/?p=33827"},"modified":"2023-06-13T14:35:43","modified_gmt":"2023-06-13T09:05:43","slug":"relate-and-unrelate-functions-in-canvas-apps","status":"publish","type":"post","link":"https:\/\/www.inogic.com\/blog\/2023\/01\/relate-and-unrelate-functions-in-canvas-apps\/","title":{"rendered":"Relate and Unrelate functions in Canvas Apps"},"content":{"rendered":"

Introduction:-<\/strong><\/p>\n

In this blog, we will learn how to use the relate() and unrelate() functions in the Canvas App.
\nHearing the word relate, you would have assumed that it was going to link to or relate to something. Bingo! With relate() function two records are linked with a one-to-many or many-to-many relationship in Microsoft Dataverse. Also, the unrelate() function acts the exact opposite by removing the link between two records, all in Microsoft Dataverse.<\/p>\n

Syntax:-<\/strong><\/p>\n

Relate():-<\/strong> Relate(Table1RelatedTable<\/em>, Table2Record<\/em>) \u2013For a record of Table1, the table of Table2 records related through a one-to-many or many-to-many relationship.<\/em><\/p>\n

Unrelate():-<\/strong> Unrelate(Table1RelatedTable<\/em>, Table2Record<\/em>)\u2013 For a record of Table1, the table of Table2 records is related through a one-to-many or many-to-many relationship.<\/em><\/p>\n

Let’s Understand things in detail. Suppose we have a table Teacher and Student where a teacher has a one-to-many relationship with the student table. That means one teacher can have multiple students.<\/p>\n

Step 1:-<\/strong> Go to make.powerapps.com select the environment and go to solution and create a solution. Inside the Solution select New> App > Canvas App. Create a canvas app for a tablet with a blank screen.<\/p>\n

Step 2:-<\/strong> In the Data pane, select Add data > In the Data pane, select Add data > select the required tables in our example it is teacher and student.<\/p>\n

\"canvas<\/p>\n

Step 3:-<\/strong> Follow the link<\/a> to add a blank vertical Gallery control and name it \u201cTeacher_Gallery\u201d.<\/strong> On the Properties tab, set the \u201cTeacher_Gallery\u201d<\/strong> Items property to \u201cTeachers\u201d<\/strong> and its layout to \u201cImage, title, and subtitle\u201d<\/strong>.<\/p>\n

\"\"<\/p>\n

You can also add the \u201cTeachers\u201d<\/strong> label through the insert tab and name the element as \u201cHeader_Teacher<\/strong>\u201d.<\/p>\n

\"Canvas<\/p>\n

\"Canvas<\/p>\n

Give a proper name to the elements as shown in the below screenshot.<\/p>\n

\"Canvas<\/p>\n

Step 4:-<\/strong>Here, let\u2019s add a second blank vertical Gallery control, and ensure that it’s named \u201cStudent_Gallery\u201d.<\/strong> On the Properties tab, set the \u201cStudent_Gallery\u201d<\/strong> layout to the title.<\/p>\n

\"Canvas<\/p>\n

In the formula bar, set the Items property of \u201cStudent_Gallery\u201d<\/strong> to \u201cTeacher_Gallery.Selected.Students\u201d.<\/strong><\/p>\n

\"Canvas<\/p>\n

Add the label \u201cAssigned Students\u201d <\/strong>as we have done for the teacher label and name the element \u201cHeader_Assigned_Students\u201d<\/strong>. <\/strong><\/p>\n

\"Canvas<\/p>\n

Step 5:-<\/strong> Add a Combo box control in front of the student’s name in the \u201cStudent_Gallery\u201d<\/strong> and name it \u201cTeachers_List\u201d.<\/strong><\/p>\n

\"Canvas<\/p>\n

\"Canvas<\/p>\n

On the Properties tab set the \u201cTeachers_List\u201d<\/strong> Items property to Teachers and scroll down and turn off the \u201cAllow multiple selection\u201d.<\/p>\n

\"Canvas<\/p>\n

\"Canvas<\/p>\n

In the formula bar, set the \u201cTeachers_List\u201d<\/strong> DefaultSelectedItems property to \u201cLookUp(Teachers,Teachers=ThisItem.Teacher.Teachers)\u201d.<\/strong><\/p>\n

\"Canvas<\/p>\n

Step 6:-<\/strong> In the Student gallery, set the OnSelect formula for \u201cRelateUnRelate_Button\u201d<\/strong> to the below formula:<\/p>\n

Formula:-<\/strong><\/p>\n

If( IsBlank(Teachers_List.Selected),<\/p>\n

Unrelate( Teacher_Gallery.Selected.Students, ThisItem ),<\/p>\n

Relate( Teachers_List.Selected.Students, ThisItem )<\/p>\n

);<\/p>\n

Refresh(Students)<\/p>\n

\"Canvas<\/p>\n

Step 7:-<\/strong>Insert new gallery named \u201cUnassignedStudent_Gallery\u201d.<\/strong> Add a label \u201cStudents Not Assigned\u201d <\/strong>and a name element as \u201cHeader_UnAssigned_Students\u201d<\/strong> as we did earlier for the two labels. In the formula bar set its Items property to formula \u201cFilter(Students, IsBlank(Teacher.Teacher))\u201c<\/strong>.<\/p>\n

\"Canvas<\/p>\n

Note:<\/strong> To display a student on the gallery make sure that you have at least one student who has not been assigned to any teacher.<\/p>\n

Add a Combo box again in \u201cUnassignedStudent_Gallery\u201d<\/strong> and name it \u201cTeachers_List_1\u201d.<\/strong> Disable multiple selections as done in Step 5.<\/strong><\/p>\n

\"Canvas<\/p>\n

\"Canvas<\/p>\n

OnSelect of \u201cRelate_Button\u201d<\/strong> write formula \u201cRelate(Teachers_List_1.Selected.Students,ThisItem);<\/strong><\/p>\n

Refresh(Students)\u201d.<\/strong><\/p>\n

\"Canvas<\/p>\n

Now play the canvas app we made by clicking on the play button.<\/p>\n

\"Canvas<\/p>\n

As shown in the above images \u201c<\/strong>Carol B. Melton<\/strong>\u201d has three students. Now we are changing \u201cJim J. Williams\u201d<\/strong> teacher from \u201c<\/strong>Carol B. Melton\u201d<\/strong> to \u201c<\/strong>David K. Lewis\u201d<\/strong> as shown below. Click on the button next to the dropdown to change the teacher:<\/p>\n

\"Canvas<\/p>\n

As a result, we can see now there is no \u201cJim J. Williams\u201d<\/strong> in the \u201c<\/strong>Carol B. Melton\u201d<\/strong> student list.<\/p>\n

\"Canvas<\/p>\n

He has now been assigned under\u201c<\/strong>David K. Lewis\u201d<\/strong>.<\/strong><\/p>\n

\"Canvas<\/p>\n

Now if we select nothing for \u201cJim J. Williams\u201d<\/strong> and click on the button then the link between \u201cJim J. Williams\u201d<\/strong> and the assigned teacher is removed.<\/p>\n

\"Canvas<\/p>\n

He is added to the \u201cStudents Not Assigned\u201d<\/strong> list.<\/p>\n

\"Canvas<\/p>\n

If we again select the teacher for \u201cJim J. Williams\u201d.<\/strong><\/p>\n

\"Canvas<\/p>\n

And click on the button in front of the dropdown then \u201cJim J. Williams\u201d<\/strong> will get assigned to that teacher.<\/p>\n

\"Canvas<\/p>\n

Conclusion: –<\/strong> Thus, we learn how to use relate() and unrelate()e functions in Canvas App to associate or disassociate two records in Microsoft Dataverse.<\/p>\n

\"\"<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"

Introduction:- In this blog, we will learn how to use the relate() and unrelate() functions in the Canvas App. Hearing the word relate, you would have assumed that it was going to link to or relate to something. Bingo! With relate() function two records are linked with a one-to-many or many-to-many relationship in Microsoft Dataverse.\u2026 Read More »<\/a><\/span><\/p>\n","protected":false},"author":13,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[1954],"tags":[1867],"class_list":["post-33827","post","type-post","status-publish","format-standard","hentry","category-canvas-apps","tag-canvas-app"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/posts\/33827","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/users\/13"}],"replies":[{"embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/comments?post=33827"}],"version-history":[{"count":0,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/posts\/33827\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/media?parent=33827"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/categories?post=33827"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/tags?post=33827"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}