PowerAppsPuzzle: @ vs # == Cryptic Error

Hey folks!  We are back with another PowerAppsPuzzle this week. This time we are trying to track down the source of a very cryptic error message. I am working on a solution for a PowerApp that integrates with SharePoint Online and for this particular solution I cannot rely on the built in form functionality that we get when using the wizard — “App from data”. So this time I had to manually create the form by adding controls to a screen and then using the Patch() formula.

As of the time of this blog post, some of the functionality is still evolving and in order to Patch() a SharePoint list that contains certain fields — like Choice, Lookup, Person — you need to supply some extra context in the form of records. Here is one example:

Patch(Cars,Defaults(Cars),{Title:TextInput1.Text,
Color:{'@odata.type':"@Microsoft.Azure.Connectors.SharePoint.SPListExpandedReference",Value:Dropdown2.Selected.Value,Id:LookUp(testCollection1,Title = Dropdown2.Selected.Value).ID},
Manufacturer:{'@odata.type':"@Microsoft.Azure.Connectors.SharePoint.SPListExpandedReference",Value:Dropdown1.Selected.Value}
})

So in the sample code above, I’m attempting to patch a SharePoint list that contains Title (single line of text), Color (lookup), and Manufacturer (choice). A simple field like Title is easy enough, you simply pass the data you want to update in that field. For the other two fields we need to define more information. So for Color, we pass the @odata.type in addition to the Value and ID.

There are plenty of blogs and samples of how to do this, but whenever I executed Patch() I was greeted with the following error:

The requested operation is invalid. Server Response: A value must be provided for item

Well… this wasn’t very helpful in and of itself so I started scouring the net and stumbled on the following discussion thread: https://community.powerapps.com/t5/PowerApps-Forum/Not-able-to-Update-Dropdown-value-to-a-sharepoint-List/td-p/13550

Towards the end of the thread is where I found my solution. I’m curious who has seen it in my sample code above? The corrected code is:

Patch(Cars, Defaults(Cars), {Title:TextInput1.Text,
Color:{'@odata.type':"#Microsoft.Azure.Connectors.SharePoint.SPListExpandedReference",Value:Dropdown2.Selected.Value,Id:LookUp(testCollection1,Title = Dropdown2.Selected.Value).ID},
Manufacturer:{'@odata.type':"#Microsoft.Azure.Connectors.SharePoint.SPListExpandedReference",Value:Dropdown1.Selected.Value}
})

In case you still miss it (as I did for quite a while). The key is in the @odata.type. The actual value should be prefaced with ‘#’ instead of ‘@’. One of the reasons this was such a challenge is that it wasn’t flagged as a syntax error.

Hope this helps someone else along the way!

Happy PowerApping!

Advertisements

PowerAppsPuzzle: Sorting SelectedItems

Let’s take the scenario where you have a ListBox in a PowerApp that contains sorted information – either alphabetically or numerically, doesn’t matter – similar to the following:
The user selects 1, then 2, then 4, and all is good, however you may notice that sometimes the values are not sorted. You may receive the values out of order like: 4,2,1 or 2,4,1. The reason for this is that the values are in order that they are selected and not necessarily in the order that they exist in the list. For example, if the user selects 1, then 2, then 4, and then deselects 2 and selects 3, the value list will result in 1,4,3.

You can easily demonstrate this using a Label and the Concat() formula to see the results of selecting different items:

PA_ListBox_Numeric_2

 

In order to preserve the sequential or sorted order of the values selected, one can use the SortByColumns() formula as the first parameter to the Concat() formula as shown below:

 

Hope this helps!

Implementing Managed Tabbed Navigation with SharePoint – Part 1

Recently, I changed roles and have more opportunity to work in areas that have more of a development slant to them. One of my customers recently wanted to convert their Intranet portal into a more friendly navigation experience on SharePoint 2013. They also want it to be responsive, but we’ll tackle that later.

I’m going to break this post up into a series of posts due to the length and number of topics:

Part 1 – Basic overview of implementing Tabbed Navigation with SharePoint

Part 2 – Investigation into the necessary CSS classes and HTML structure for Tabbed Navigation

Part 3 – Explanation of the JavaScript to render the HTML from part 2

So in my discussions with the customer we arrived at a decision that they would be using Managed Navigation and they wanted it to be in a tabbed format similar to this:

image

I won’t get into Managed Navigation here, but suffice it to say that it’s a feature that was added to SharePoint 2013 that uses the Managed Metadata Service and terms that you define to provide navigation items. It’s highly dynamic and easy to change, if needed. SharePoint creates a control and adds it to the default master pages so you don’t really have to do much, but they aren’t very attractive out of the box.

image

There are a ton of ways to do any one thing with software development – some more efficient or better practice than others, but still a wide variety…this is simply the way I picked. Smile  I began by looking at Bootstrap as not only does it have easy to use classes right out of the gate for navigation (including tabs), it also makes responsive (the next thing we’d have to look at it) much easier as well. After searching around a bit for Bootstrap and SharePoint I happened to stumble upon some code from a fella named Tom Daly. He had already tackled a good bit of what needed to be done and code-reuse is a popular topic today, right?

Installing the code as downloaded from GitHub, we get a look like this:

image

Obviously this is not the result that any of us wants to see so using Tom’s code as a base, I had to tweak a little bit of the Javascript and some custom CSS to get the display that I wanted. The first thing that I wanted to do was to remove the out of the box Navigation using some custom CSS:

.ms-core-navigation, #DeltaPlaceHolderPageTitleInTitleArea, #DeltaTopNavigation {
visibility:hidden;
}

That, at least, allows us to only see one set of navigation elements (and the ones we want, I might add). Next was to begin changing the type of navigation from Tom’s code from dropdown classes to using tabs. There are actually a lot of steps to this and that is why I’ll dive further into those steps in the next two parts to this series. I *highly* encourage you to review the code in Tom’s solution to understand the steps and ask questions in the comments. One of the important parts to understand is that using Tom’s code we make a call to the REST endpoint “/_api/navigation/menustate?mapprovidername=’GlobalNavigationSwitchableProvider’” and this returns an object containing the Navigation Nodes (all levels).

So stay tuned and watch for Part 2 of this series when I start discussing the CSS classes needed to get the layout that I wanted. (Including the somewhat embarrassing fact that my teenage son had to help me with part of it.)

image

CSS and Javascript