Power Platform MS Forms Quiz with dynamic Leader Board created using Power Automate and HTTP Trigger

Published 04-29-2021 03:30 PM 660 Views
Frequent Visitor

Here is an example Power Automate solution where we query a real SharePoint List acting as a Quiz Leader Board on my dev tenant and bring the contents to this very blog post (at the bottom of the page).  Using the Power Automate and the HTTP trigger we can retrieve, embed and display content from our Office 365 environments.

 

The competition is rife at the top of this Leader Board.  The aim is to get 100% and it is ordered by last completed to give everyone a chance to be top, albeit I am sorry to say that there is no official badge for this one. 

 

Want to test your Power Automate knowledge?   Click Here

 

DamoBird365_0-1619726369840.png

 

For the first flow of two, using Microsoft Forms and Power Automate I have built a pretty standard process.  The user completes the quiz, the form gives them feedback on how well they have done and I capture the answers to a SharePoint List - seen below.

 

DamoBird365_0-1619730541847.png

 

 

I use the when a new [form] response is submitted trigger and during the next couple of actions I calculate their score again (based on their answers) as the score is not passed back to the Cloud Flow via the Response Body.

 

DamoBird365_1-1619726475005.png

 

What's the Score?

 

In order to calculate the score I have created an array via a compose action and used the equals expression.  If the response equals the answer, it will return true.  I then use a filter action on the item() of each output from the select and filter on true.  This will leave me with an array of true values.  During the create item score field and tweet action, I use the length() expression (i.e. length of array from 10 possible true answers) to return the number of answers equaling true and multiply by 10 to get the percentage correct.

 

DamoBird365_2-1619726584442.png

 

The final stage of this flow is a condition where I check to see if the user has supplied a twitter handle.  If it's not empty I tweet out their score.  The only disappointment here is that Twitter will not let you tag users due to spamming :cry: any attempt to include an @ result in it being stripped out.

 

The Leader Board

 

The interesting piece though, is the second flow, using the HTTP trigger action to present the leader board to the web and seen below (at least until my premium trial has not expired).  Using the trigger we can run an action to get items, prepare HTML table rows using a select action and send back a response to the website in a fraction of a second.  The end user loading the website almost doesn't know it's happening, albeit there is a slight delay for the flow to run, i'll admit.  Did you notice the delay in this page loading?

 

DamoBird365_3-1619727062254.png

 

The reponse to the embedded IFrame on my Blog and indeed this article which is simply calling the url provided by the HTTP Request trigger is an HTML table.  I create the table header and then using the select action body, I use the join() expression to join the elements of the array with '' into a string and complete the HTML table.

 

DamoBird365_4-1619727245209.png

 

I'm not a web developer and I am sure that there will be slicker ways to embed the results of the http response into your site and for that I would be grateful to hear from those with experience but what do you think of this idea?  Are you on the leader board yet?  

 

As things stand - here is the leader board.  Can you resist not talking part?  Click Here

 

 

Tweets with your result will be posted via my twitter handle DamoBird365

 

Meanwhile, if you are looking for a certificate for your efforts, fill out my form here

 

Happy quizzing :xd:

%3CLINGO-SUB%20id%3D%22lingo-sub-2308467%22%20slang%3D%22en-US%22%3EPower%20Platform%20MS%20Forms%20Quiz%20with%20dynamic%20Leader%20Board%20created%20using%20Power%20Automate%20and%20HTTP%20Trigger%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-2308467%22%20slang%3D%22en-US%22%3E%3CP%3EHere%20is%20an%20example%20Power%20Automate%20solution%20where%20we%20query%20a%20real%20SharePoint%20List%20acting%20as%20a%20Quiz%20Leader%20Board%20on%20my%20dev%20tenant%20and%20bring%20the%20contents%20to%20this%20very%20blog%20post%20(at%20the%20bottom%20of%20the%20page).%26nbsp%3B%20Using%20the%20Power%20Automate%20and%20the%20HTTP%20trigger%20we%20can%20retrieve%2C%20embed%20and%20display%20content%20from%20our%20Office%20365%20environments.%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3EThe%20competition%20is%20rife%20at%20the%20top%20of%20this%20Leader%20Board.%26nbsp%3B%20The%20aim%20is%20to%20get%20100%25%20and%20it%20is%20ordered%20by%20last%20completed%20to%20give%20everyone%20a%20chance%20to%20be%20top%2C%20albeit%20I%20am%20sorry%20to%20say%20that%20there%20is%20no%20official%20badge%20for%20this%20one.%26nbsp%3B%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3E%3CSTRONG%3EWant%20to%20test%20your%20Power%20Automate%20knowledge%3F%26nbsp%3B%20%26nbsp%3B%3CA%20href%3D%22https%3A%2F%2Fforms.office.com%2Fpages%2Fresponsepage.aspx%3Fid%3D0QHJFmOXsUmWHGzXAfXQ92JiZGxvT_tLiMeGs9ElLKxUQ1RRWFpGSEtVTjFDQ0QwNU1FUlkzSDlKMC4u%22%20target%3D%22_self%22%20rel%3D%22noopener%20noreferrer%22%3EClick%20Here%3C%2FA%3E%3C%2FSTRONG%3E%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3E%3CSPAN%20class%3D%22lia-inline-image-display-wrapper%20lia-image-align-center%22%20image-alt%3D%22DamoBird365_0-1619726369840.png%22%20style%3D%22width%3A%20400px%3B%22%3E%3CIMG%20src%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F276915i5B7F6B6D08A4F094%2Fimage-size%2Fmedium%3Fv%3Dv2%26amp%3Bpx%3D400%22%20role%3D%22button%22%20title%3D%22DamoBird365_0-1619726369840.png%22%20alt%3D%22DamoBird365_0-1619726369840.png%22%20%2F%3E%3C%2FSPAN%3E%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3EFor%20the%26nbsp%3B%3CSTRONG%3Efirst%20flow%3C%2FSTRONG%3E%20of%20%3CSTRONG%3Etwo%3C%2FSTRONG%3E%2C%20using%20Microsoft%20Forms%20and%20Power%20Automate%20I%20have%20built%20a%20pretty%20standard%20process.%26nbsp%3B%20The%20user%20completes%20the%20quiz%2C%20the%20form%20gives%20them%20feedback%20on%20how%20well%20they%20have%20done%20and%20I%20capture%20the%20answers%20to%20a%20SharePoint%20List%20-%20seen%20below.%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3E%3CSPAN%20class%3D%22lia-inline-image-display-wrapper%20lia-image-align-center%22%20image-alt%3D%22DamoBird365_0-1619730541847.png%22%20style%3D%22width%3A%20400px%3B%22%3E%3CIMG%20src%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F276941i97B4991EF528EA24%2Fimage-size%2Fmedium%3Fv%3Dv2%26amp%3Bpx%3D400%22%20role%3D%22button%22%20title%3D%22DamoBird365_0-1619730541847.png%22%20alt%3D%22DamoBird365_0-1619730541847.png%22%20%2F%3E%3C%2FSPAN%3E%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3EI%20use%20the%20%3CSTRONG%3Ewhen%20a%20new%20%5Bform%5D%20response%20is%20submitted%3C%2FSTRONG%3E%20trigger%20and%20during%20the%20next%20couple%20of%20actions%20I%20calculate%20their%20score%20again%20(based%20on%20their%20answers)%20as%20the%20score%20is%20not%20passed%20back%20to%20the%20Cloud%20Flow%20via%20the%20Response%20Body.%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3E%3CSPAN%20class%3D%22lia-inline-image-display-wrapper%20lia-image-align-center%22%20image-alt%3D%22DamoBird365_1-1619726475005.png%22%20style%3D%22width%3A%20400px%3B%22%3E%3CIMG%20src%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F276916iBC7CE36CF0E38547%2Fimage-size%2Fmedium%3Fv%3Dv2%26amp%3Bpx%3D400%22%20role%3D%22button%22%20title%3D%22DamoBird365_1-1619726475005.png%22%20alt%3D%22DamoBird365_1-1619726475005.png%22%20%2F%3E%3C%2FSPAN%3E%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%20class%3D%22lia-align-center%22%3E%3CSTRONG%3EWhat's%20the%20Score%3F%3C%2FSTRONG%3E%3C%2FP%3E%0A%3CP%20class%3D%22lia-align-center%22%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%20class%3D%22lia-align-justify%22%3EIn%20order%20to%20calculate%20the%20score%20I%20have%20created%20an%20array%20via%20a%20%3CSTRONG%3Ecompose%3C%2FSTRONG%3E%20action%20and%20used%20the%20equals%20expression.%26nbsp%3B%20If%20the%20response%20equals%20the%20answer%2C%20it%20will%20return%20true.%26nbsp%3B%20I%20then%20use%20a%20%3CSTRONG%3Efilter%3C%2FSTRONG%3E%20action%20on%20the%20%3CSTRONG%3Eitem()%3C%2FSTRONG%3E%20of%20each%20output%20from%20the%20select%20and%20filter%20on%20true.%26nbsp%3B%20This%20will%20leave%20me%20with%20an%20array%20of%20true%20values.%26nbsp%3B%20During%20the%20create%20item%20score%20field%20and%20tweet%20action%2C%20I%20use%20the%26nbsp%3B%3CSTRONG%3Elength()%3C%2FSTRONG%3E%20expression%20(i.e.%20length%20of%20array%20from%2010%20possible%20true%20answers)%20to%20return%20the%20number%20of%20answers%20equaling%20true%20and%20multiply%20by%2010%20to%20get%20the%20percentage%20correct.%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3E%3CSPAN%20class%3D%22lia-inline-image-display-wrapper%20lia-image-align-center%22%20image-alt%3D%22DamoBird365_2-1619726584442.png%22%20style%3D%22width%3A%20400px%3B%22%3E%3CIMG%20src%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F276917iF1ACAB6C873F0BD3%2Fimage-size%2Fmedium%3Fv%3Dv2%26amp%3Bpx%3D400%22%20role%3D%22button%22%20title%3D%22DamoBird365_2-1619726584442.png%22%20alt%3D%22DamoBird365_2-1619726584442.png%22%20%2F%3E%3C%2FSPAN%3E%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3EThe%20final%20stage%20of%20this%20flow%20is%20a%20%3CSTRONG%3Econdition%26nbsp%3B%3C%2FSTRONG%3Ewhere%20I%20check%20to%20see%20if%20the%20user%20has%20supplied%20a%20twitter%20handle.%26nbsp%3B%20If%20it's%20not%20empty%20I%20tweet%20out%20their%20score.%26nbsp%3B%20The%20only%20disappointment%20here%20is%20that%20Twitter%20will%20not%20let%20you%20tag%20users%20due%20to%20spamming%26nbsp%3B%3CIMG%20class%3D%22lia-deferred-image%20lia-image-emoji%22%20src%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Fhtml%2F%402F5B53C90739358292524B2CDF7F85DA%2Fimages%2Femoticons%2Fcry_40x40.gif%22%20alt%3D%22%3Acry%3A%22%20title%3D%22%3Acry%3A%22%20%2F%3E%20any%20attempt%20to%20include%20an%26nbsp%3B%40%20result%20in%20it%20being%20stripped%20out.%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%20class%3D%22lia-align-center%22%3E%3CSTRONG%3EThe%20Leader%20Board%3C%2FSTRONG%3E%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3EThe%20interesting%20piece%20though%2C%20is%20the%20%3CSTRONG%3Esecond%20flow%3C%2FSTRONG%3E%2C%20using%20the%20HTTP%20trigger%20action%20to%20present%20the%20leader%20board%20to%20the%20web%20and%20seen%20below%20(at%20least%20until%20my%20%3CEM%3Epremium%20trial%3C%2FEM%3E%20has%20not%20expired).%26nbsp%3B%20Using%20the%20trigger%20we%20can%20run%20an%20action%20to%20get%20items%2C%20prepare%20HTML%20table%20rows%20using%20a%20select%20action%20and%20send%20back%20a%20response%20to%20the%20website%20in%20a%20fraction%20of%20a%20second.%26nbsp%3B%20The%20end%20user%20loading%20the%20website%20almost%20doesn't%20know%20it's%20happening%2C%20albeit%20there%20is%20a%20slight%20delay%20for%20the%20flow%20to%20run%2C%20i'll%20admit.%26nbsp%3B%20%3CEM%3EDid%20you%20notice%20the%20delay%20in%20this%20page%20loading%3F%3C%2FEM%3E%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3E%3CSPAN%20class%3D%22lia-inline-image-display-wrapper%20lia-image-align-center%22%20image-alt%3D%22DamoBird365_3-1619727062254.png%22%20style%3D%22width%3A%20400px%3B%22%3E%3CIMG%20src%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F276919iB9B5B9694F8AC801%2Fimage-size%2Fmedium%3Fv%3Dv2%26amp%3Bpx%3D400%22%20role%3D%22button%22%20title%3D%22DamoBird365_3-1619727062254.png%22%20alt%3D%22DamoBird365_3-1619727062254.png%22%20%2F%3E%3C%2FSPAN%3E%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3EThe%20reponse%20to%20the%20embedded%20IFrame%20on%20my%20Blog%20and%20indeed%20this%20article%20which%20is%20simply%20calling%20the%20url%20provided%20by%20the%20HTTP%20Request%20trigger%20is%20an%20HTML%20table.%26nbsp%3B%20I%20create%20the%20table%20header%20and%20then%20using%20the%20select%20action%20body%2C%20I%20use%20the%20%3CSTRONG%3Ejoin()%3C%2FSTRONG%3E%26nbsp%3Bexpression%20to%20join%20the%20elements%20of%20the%20array%20with%20''%20into%20a%20string%20and%20complete%20the%20HTML%20table.%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3E%3CSPAN%20class%3D%22lia-inline-image-display-wrapper%20lia-image-align-center%22%20image-alt%3D%22DamoBird365_4-1619727245209.png%22%20style%3D%22width%3A%20400px%3B%22%3E%3CIMG%20src%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F276921i533EA55E25D87A80%2Fimage-size%2Fmedium%3Fv%3Dv2%26amp%3Bpx%3D400%22%20role%3D%22button%22%20title%3D%22DamoBird365_4-1619727245209.png%22%20alt%3D%22DamoBird365_4-1619727245209.png%22%20%2F%3E%3C%2FSPAN%3E%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3EI'm%20not%20a%20web%20developer%20and%20I%20am%20sure%20that%20there%20will%20be%20slicker%20ways%20to%20embed%20the%20results%20of%20the%20http%20response%20into%20your%20site%20and%20for%20that%20I%20would%20be%20grateful%20to%20hear%20from%20those%20with%20experience%20but%20what%20do%20you%20think%20of%20this%20idea%3F%26nbsp%3B%20%3CEM%3EAre%20you%20on%20the%20leader%20board%20yet%3F%3C%2FEM%3E%26nbsp%3B%26nbsp%3B%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3EAs%20things%20stand%20-%20here%20is%20the%20leader%20board.%26nbsp%3B%20Can%20you%20resist%20not%20talking%20part%3F%26nbsp%3B%26nbsp%3B%3CSTRONG%3E%3CA%20href%3D%22https%3A%2F%2Fforms.office.com%2Fpages%2Fresponsepage.aspx%3Fid%3D0QHJFmOXsUmWHGzXAfXQ92JiZGxvT_tLiMeGs9ElLKxUQ1RRWFpGSEtVTjFDQ0QwNU1FUlkzSDlKMC4u%22%20target%3D%22_self%22%20rel%3D%22noopener%20noreferrer%22%3EClick%20Here%3C%2FA%3E%3C%2FSTRONG%3E%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CDIV%20class%3D%22container%22%20align%3D%22center%22%3E%3CIFRAME%20src%3D%22https%3A%2F%2Fprod-16.uksouth.logic.azure.com%3A443%2Fworkflows%2Ff33207075aaa4425b9fd184f17637d14%2Ftriggers%2Fmanual%2Fpaths%2Finvoke%3Fapi-version%3D2016-06-01%26amp%3Bsp%3D%252Ftriggers%252Fmanual%252Frun%26amp%3Bsv%3D1.0%26amp%3Bsig%3DGdAfhGoIC-wPuREBb-AtvMXDg7p4ayRZd2rMfZiHs-4%22%20width%3D%2280%25%22%20height%3D%22500%22%20class%3D%22responsive-iframe%22%3E%3C%2FIFRAME%3E%3C%2FDIV%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3ETweets%20with%20your%20result%20will%20be%20posted%20via%20my%20twitter%20handle%20%3CA%20href%3D%22https%3A%2F%2Ftwitter.com%2FDamoBird365%22%20target%3D%22_self%22%20rel%3D%22nofollow%20noopener%20noreferrer%22%3EDamoBird365%3C%2FA%3E%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3EMeanwhile%2C%20if%20you%20are%20looking%20for%20a%20certificate%20for%20your%20efforts%2C%20fill%20out%20my%20%3CA%20href%3D%22https%3A%2F%2Fforms.office.com%2FPages%2FResponsePage.aspx%3Fid%3D0QHJFmOXsUmWHGzXAfXQ92JiZGxvT_tLiMeGs9ElLKxURVQ0WkgwUkdPRVRWOUVDNkJUTE5CRUYzTy4u%22%20target%3D%22_self%22%20rel%3D%22noopener%20noreferrer%22%3Eform%20here%3C%2FA%3E%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%20class%3D%22lia-align-center%22%3E%3CSTRONG%3EHappy%20quizzing%26nbsp%3B%3CIMG%20class%3D%22lia-deferred-image%20lia-image-emoji%22%20src%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Fhtml%2F%407EBDB192371E60F0C05B7773EFC0C76E%2Fimages%2Femoticons%2Fxd_40x40.gif%22%20alt%3D%22%3Axd%3A%22%20title%3D%22%3Axd%3A%22%20%2F%3E%3C%2FSTRONG%3E%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-TEASER%20id%3D%22lingo-teaser-2308467%22%20slang%3D%22en-US%22%3E%3CP%3EA%20quiz%3F%26nbsp%3B%20A%20leader%20board%3F%26nbsp%3B%20It's%20only%2010%20questions%20but%20did%20you%20know%20that%20the%20HTTP%20Trigger%20of%20Power%20Automate%20could%20help%20you%20display%20O365%20content%20on%20your%20website%3F%3C%2FP%3E%3C%2FLINGO-TEASER%3E%3CLINGO-LABS%20id%3D%22lingo-labs-2308467%22%20slang%3D%22en-US%22%3E%3CLINGO-LABEL%3EMicrosoft%20Forms%3C%2FLINGO-LABEL%3E%3CLINGO-LABEL%3EPower%20Automate%3C%2FLINGO-LABEL%3E%3C%2FLINGO-LABS%3E
Co-Authors
Version history
Last update:
‎Apr 29 2021 02:16 PM
Updated by: