Questions on UI for Blazor Forum

1 answer

205 views

The minimum size the pane when a pane is collapsed.

Hello,

How to collapse the pane using their collapse/expand buttons or double-clicking the split bars,
so that the minimum size the pane is taken into account.
Currently the whole panel is closed.

Thank you very much

Splitter

answered on 22 Mar 2023

0 answers

270 views

Nested table (Show and Hide)

I have two tables: Team Basic Info and Team Stats

Considering the yellow cells. Team Basic Info and Team Stats are two Buttons. Team Basic Info is the default View. How can I implement the Team Stats Button so it shows the team stats table and hides the Team Basic Info and vice-versa?

Thanks for any help

Grid

GridLayout

asked on 22 Mar 2023

1 answer

156 views

Transitions on Blazor Gauges drops to min then to new value

When transition is true the gauge operates in a visually unappealing way by default and I'm wondering if there is a setting or method to make it work better.

Basically if the gauge (linear or radial) has a value of 20 then jumps to 30, the needle drops to 0 then transitions to 30. When really it should transition from 20 to 30.

To reproduce use the Telerik demo page @ :

https://demos.telerik.com/blazor-ui/radialgauge/overview

Paste in 35 into the Change Pointer Value box and watch what happens.

Note : Don't type in 35 because it will jump to 0 then to 3 before you type the 5 so it makes it harder to see.

Is there a way to stop this and have the gauge go from the last value to the new value??

LinearGauge

RadialGauge

answered on 21 Mar 2023

1 answer

139 views

Telerik for Blazor Exact Time Rendring

Hello,

Is there any way in the Telerik Scheduler for Blazor to get the ExactTimeReadring feature enabled ?

Like it is here for example : https://demos.telerik.com/aspnet-ajax/scheduler/examples/exacttimerendering/defaultvb.aspx

Fabien

Scheduler

answered on 21 Mar 2023

1 answer

348 views

error CS0012: The type 'DataSourceRequest' is defined in an assembly that is not referenced.

This error occurred on 2023-03-15.

error CS0012: The type 'DataSourceRequest' is defined in an assembly that is not referenced. You must add a reference to assembly 'Telerik.DataSource, Version=2.1.3.0, Culture=neutral, PublicKeyToken=29ac1a93ec063d92'.

[RESOLVED] Error CS0012: The type 'DataSourceRequest' is defined in an assembly that is not referenced. You must add a reference to assembly Telerik.DataSource, Version=2.1.3.0 in UI for Blazor | Telerik Forums

I know it was discussed at this URL.
But when I build the Dockerfile, the error is still there.

When will this error be fixed?

Package : Telerik.UI.Blazor(4.1.0)

General Discussions

Grid

answered on 21 Mar 2023

1 answer

447 views

Preserve line feeds in grid cell

I'm displaying text in a grid cell that contains line feeds and like normal those line feeds get removed when rendered. The conventional wisdom to preserve line feeds is to apply CSS, something like "white-space: pre-wrap". However when I do that in a Telerik grid cell via

.k-grid td, .k-grid .k-table-td {

white-space: pre-wrap;
}

The rendered td element gets unnecessarily tall, wasting space. I saw this post:

https://www.telerik.com/forums/multi-line-text-in-grid-cell

And with that I was able to get the end result to look okay using this:

<Template>
@(new MarkupString((context as LocationDto).RMRAddress?.DisplayText.Replace(Environment.NewLine, "<br/>")))
</Template>

But I really don't like having to use a markup string like that. Is there a way to apply CSS to the grid cell to preserve the line feeds without creating the unnecessary height? See the attached screenshot. Yellow highlight shows the wasted space I'm referring to.

Thanks.

Grid

answered on 21 Mar 2023

1 answer

918 views

[Solved] [Error NU1101] Unable to find package Telerik.UI.for.Blazor when running docker-compose up

I'm running docker-compose up --force-recreate --build and obtaining the following error:

[+] Building 20.8s (17/17) FINISHED
 => [internal] load build definition from Dockerfile                                                               0.0s
 => => transferring dockerfile: 32B                                                                                0.0s
 => [internal] load .dockerignore                                                                                  0.0s
 => => transferring context: 2B                                                                                    0.0s
 => [internal] load metadata for mcr.microsoft.com/dotnet/sdk:7.0                                                  0.2s
 => [ 1/13] FROM mcr.microsoft.com/dotnet/sdk:7.0@sha256:e049e6a153619337ceb4edd040fb60a220d420414d41d6eb39708d6c  0.0s
 => [internal] load build context                                                                                  0.1s
 => => transferring context: 9.98MB                                                                                0.1s
 => CACHED [ 2/13] WORKDIR /app                                                                                    0.0s
 => CACHED [ 3/13] RUN apt install -y curl                                                                         0.0s
 => CACHED [ 4/13] RUN curl -sL https://deb.nodesource.com/setup_14.x | bash -                                     0.0s
 => CACHED [ 5/13] RUN apt-get install -y nodejs                                                                   0.0s
 => CACHED [ 6/13] RUN curl -L https://www.npmjs.com/install.sh | sh                                               0.0s
 => CACHED [ 7/13] RUN apt install -y sshpass                                                                      0.0s
 => CACHED [ 8/13] WORKDIR /app                                                                                    0.0s
 => [ 9/13] COPY . .                                                                                               0.3s
 => [10/13] WORKDIR /app/wwwroot                                                                                   0.1s
 => [11/13] RUN npm install                                                                                        9.9s
 => [12/13] WORKDIR /app                                                                                           0.0s
 => ERROR [13/13] RUN dotnet publish -r ubuntu.18.04-x64 -c Release -o ./deploy/release                           10.1s
------
 > [13/13] RUN dotnet publish -r ubuntu.18.04-x64 -c Release -o ./deploy/release:
#0 0.574 MSBuild version 17.5.0+6f08c67f3 for .NET
#0 1.134   Determining projects to restore...
#0 1.137   Skipping project "/monitorix-server/monitorix-server.csproj" because it was not found.
#0 1.139   Skipping project "/monitorix-server/monitorix-server.csproj" because it was not found.
#0 9.653 /app/monitorix-ui.csproj : error NU1101: Unable to find package Telerik.UI.for.Blazor. No packages exist with this id in source(s): nuget.org
#0 9.722   Failed to restore /app/monitorix-ui.csproj (in 8.35 sec).
------
failed to solve: executor failed running [/bin/sh -c dotnet publish -r ubuntu.18.04-x64 -c Release -o ./deploy/release]: exit code: 1

I've included the necessary credentials in NuGet.config at %appdata%/roaming/nuget and the corresponding package sources with the following feed url https://nuget.telerik.com/v3/index.json:

<?xml version="1.0" encoding="utf-8"?>
<configuration>
  <packageSources>
    <add key="Microsoft Visual Studio Offline Packages" value="C:\Program Files (x86)\Microsoft SDKs\NuGetPackages\" />
    <add key="nuget.org" value="https://api.nuget.org/v3/index.json" />
    <add key="Telerik" value="https://nuget.telerik.com/nuget" />
  </packageSources>
    <packageSourceCredentials>
    <Telerik>
        <add key="Username" value="******@******.pt" />
        <add key="ClearTextPassword" value="**********" />
    </Telerik>
  </packageSourceCredentials>
  <packageRestore>
    <add key="enabled" value="True" />
    <add key="automatic" value="True" />
  </packageRestore>
  <bindingRedirects>
    <add key="skip" value="False" />
  </bindingRedirects>
  <packageManagement>
    <add key="format" value="0" />
    <add key="disabled" value="False" />
  </packageManagement>
  <disabledPackageSources>
    <add key="pbanuget" value="true" />
  </disabledPackageSources>
</configuration>

The following is the .csproj file.

<Project Sdk="Microsoft.NET.Sdk.Web">

  <PropertyGroup>
    <TargetFramework>net7.0</TargetFramework>
    <Nullable>enable</Nullable>
    <ImplicitUsings>enable</ImplicitUsings>
    <RootNamespace>monitorix-ui</RootNamespace>
    <UserSecretsId>532751be-63e3-425b-807f-72d212ce24ca</UserSecretsId>
  </PropertyGroup>

  <ItemGroup>
    <PackageReference Include="BlazorMonaco" Version="3.0.0" />
    <PackageReference Include="Telerik.UI.for.Blazor" Version="4.0.1" />
  </ItemGroup>

</Project>

And finally my dockerfile:

FROM mcr.microsoft.com/dotnet/sdk:7.0
# Needed to install the web-ui dependencies
WORKDIR /app
RUN apt install -y curl
RUN curl -sL https://deb.nodesource.com/setup_14.x | bash -
RUN apt-get install -y nodejs
RUN curl -L https://www.npmjs.com/install.sh | sh

# SSH tools
RUN apt install -y sshpass

# Copy app
WORKDIR /app
COPY . . 

# Install web-ui dependencies
WORKDIR /app/wwwroot
RUN npm install


# dotnet core app restore/build and launch
WORKDIR /app
RUN dotnet publish -r ubuntu.18.04-x64 -c Release -o ./deploy/release

EXPOSE 80
ENTRYPOINT ["./app/deploy/monitorix-ui"]

What seems to be the problem here? Thank you

General Discussions

answered on 21 Mar 2023

1 answer

252 views

Selecting multiple filtered items from filterable MultiSelect

Hello,

it seems that selecting multiple items from a filterable MultiSelect can be quite a pain if you want to select items that are filtered. I have adapted the snippet from your documentation to show the problem I'm currently facing with a user request: https://blazorrepl.telerik.com/cRaRPKvP25KEN0xs54 by making the dropdown not close automatically and be Contains filterable.

If the user wants to select all items containing the number 3 from the list it might go something like this: User types 3 into the input box. Multiselect shows items containing 3. User selects an item from the filtered options. Multiselect adds the chosen item to the list of selected items and clears the filter. User now has to type 3 again to filter the multiselect again etc.

So the "clear the filter after user selects item" is the problem here. Is there any way to avoid this, or select multiple items in "one go" from the list of filtered items?

MultiSelect

answered on 21 Mar 2023

0 answers

249 views

Column Select outside of ColumnMenu

Hi,

We have a problem at the moment with showing/hiding columns in a grid. With the Column Menu it is possible to show/hide columns.

If a grid has ten columns then it is ten times the identical menu to select columns, which actually makes no sense.

It would make more sense if there was a way to add a single dropdown menu in the GridToolBar that you can use to hide and show columns. Unfortunately, I have not found an option for this.

You can, of course, assign a bool value to each column and build your own menu, but in an app with dozens of grids and dozens of columns, this is extremely tedious.

We wanted to design our own DropDown element and generate the column selection automatically with a loop over all columns. This is also very cumbersome because the grid doesn't keep the columns as a public property at any point. We currently determine the columns via reflection. Again, it would be nice if there was an easier way.

Grid

asked on 21 Mar 2023

1 answer

595 views

Upload PDF Forms

I would like my Blazor application to be able to upload PDF Forms (editable PDF documents) for storage that the application will later use by prefilling customer data into them.

The PDFViewer shows an empty PDF when I read in the bytes and display them

I then tried to copy the document using the PdfFormatProvider, on the import it fails.

Code lines:

PdfFormatProvider provider = new PdfFormatProvider();
RadFixedDocument document = new RadFixedDocument();
document = provider.Import(file.OpenReadStream());

Error: Cannot obtain value of the local variable or argument because it is not available at this instruction pointer, possibly because it has been optimized away.

Not sure why the provider does not like these PDF files, also not sure if it is an issue or meant to work.

PDFViewer

answered on 20 Mar 2023