Quantcast
Channel: Active questions tagged blazor - Stack Overflow
Viewing all articles
Browse latest Browse all 4839

What causes Blazor Bootstrap Tooltip not to include newline?

$
0
0

I was facing a bizarre behavior with the Blazor Bootstrap Tooltip. If I tried it using Console.WriteLine(string? value);, the newline is applied properly, but when I specify them in the Tooltip's Title, they aren't.


In my Razor page, I initialize the Title value by this way:

<Tooltip Class="ps-1"    Title="@imageNotes.ToString()"    Placement="TooltipPlacement.Right"><Icon Name="IconName.InfoCircle" Color="IconColor.Info" /></Tooltip>@code {    private FormattableString imageNotes = $"1. Maximum 8 images can be uploaded\n2. Image size between 330x330 and 5000x5000 px. Max file size: 3MB\n3. Obsceme image is strictly prohibited.";    protected override void OnInitialized()    {        Console.WriteLine(imageNotes.ToString());    }}

I'll provide a screenshot for you to see how it actually behaves.

Console.WriteLine(string? value) output:

console log

The same with the output using dotnetfiddle.

Tooltip output:

tooltip


Other attempts are as follows:

By using string

<Tooltip Class="ps-1"    Title="@imageNotes"    Placement="TooltipPlacement.Right"><Icon Name="IconName.InfoCircle" Color="IconColor.Info" /></Tooltip>@code {    private string imageNotes = "1. Maximum 8 images can be uploaded\n2. Image size between 330x330 and 5000x5000 px. Max file size: 3MB\n3. Obsceme image is strictly prohibited.";    protected override void OnInitialized()    {        Console.WriteLine(imageNotes);    }}

By using this solution

<Tooltip Class="ps-1"    Title="@($"{imageNotes.Replace("@", System.Environment.NewLine)}")"    Placement="TooltipPlacement.Right"><Icon Name="IconName.InfoCircle" Color="IconColor.Info" /></Tooltip>@code {    private string imageNotes = "1. Maximum 8 images can be uploaded@2. Image size between 330x330 and 5000x5000 px. Max file size: 3MB@3. Obsceme image is strictly prohibited.";    protected override void OnInitialized()    {        Console.WriteLine(imageNotes.Replace("@", System.Environment.NewLine));    }}

By using \n directly in Tooltips's Title

<Tooltip Class="ps-1"    Title="@($"1. Maximum 8 images can be uploaded\n2. Image size between 330x330 and 5000x5000 px. Max file size: 3MB\n3. Obsceme image is strictly prohibited.")"    Placement="TooltipPlacement.Right"><Icon Name="IconName.InfoCircle" Color="IconColor.Info" /></Tooltip>

By using this solution directly in Tooltips's Title

<Tooltip Class="ps-1"    Title="@($"1. Maximum 8 images can be uploaded{System.Environment.NewLine}2. Image size between 330x330 and 5000x5000 px. Max file size: 3MB{System.Environment.NewLine}3. Obsceme image is strictly prohibited.")"    Placement="TooltipPlacement.Right"><Icon Name="IconName.InfoCircle" Color="IconColor.Info" /></Tooltip>

They all produce the same outputs. My simple question is: Why can't I format the string with a newline using \n or System.Environment.NewLine in the Tooltip's Title?


Viewing all articles
Browse latest Browse all 4839

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>