vilmarci
vilmarci

Reputation: 535

Display number in adaptive card

I have the following simple card:

    {
        "type": "AdaptiveCard",
        "version": "1.0",
        "body": [
            {
                "type": "TextBlock",
                "text": "{data}"
            }
        ],
        "$schema": "http://adaptivecards.io/schemas/adaptive-card.json"
    }

When I apply the following data to the card (value is number), the text box is empty:

{
"data":11111
}

With text, the I can see the data in the card:

{
"data":"11111"
}

This is not a code issue, this is how it looks in the designer. Am I missing something, is there a type for a text box that lets display numbers or is this by design and I have to change all numeric fields to text?

Upvotes: 1

Views: 3267

Answers (3)

BJury
BJury

Reputation: 2604

You can now use the function formatNumber(value, decimalplaces)

Eg:

{
  "type": "TextBlock",
  "text": "${formatNumber(somenumber), 2}"
}

You can read mode here: https://learn.microsoft.com/en-us/azure/bot-service/adaptive-expressions/adaptive-expressions-prebuilt-functions?view=azure-bot-service-4.0#formatNumber

Upvotes: 0

Matt Hidinger
Matt Hidinger

Reputation: 1753

This is a limitation of the preview (known as Type Coercion) that we hope to address before release. As another workaround you can include a space after the binding expression which will force it into a string. See the below example, notice the space after {data}


   {
        "type": "AdaptiveCard",
        "version": "1.0",
        "body": [
            {
                "type": "TextBlock",
                "text": "{data} "
            }
        ],
        "$schema": "http://adaptivecards.io/schemas/adaptive-card.json"
    }

Upvotes: 2

Hilton Giesenow
Hilton Giesenow

Reputation: 10844

I'm guessing you're using Adaptive Cards Templating for this. Remember, this is (a) in preview only and (b) just one option for constructing an Adaptive Card. Basically, at the end of the day, the Card is just a string of JSON text so you can create it in 3 main ways:

  1. Using Templates, as you're doing now
  2. Doing string replacement of your own (e.g. var card = '..."text": "##Number##"...' and then card = card.Replace("##Number##", formattedNumberValue)
  3. Using strongly-typed options like the AdaptiveCards Nuget package for C#, for instance

So, I'd suggest, if this is not possible using Templating, to look more at options 2 or 3 above. I described this a bit more here, with some links to C# and Node examples.

Hope that helps

Upvotes: 0

Related Questions