Using the following configuration does not produce the expected result:
<GridSettings>
<GridPopupEditFormSettings ButtonsLayout="FormButtonsLayout.Center"/>
</GridSettings>
The button layout is always left no matter what you choose.
===
ADMIN EDIT
===
Possible workarounds for the time being are to position the buttons with CSS or use a Popup Buttons Template.
Like https://docs.telerik.com/blazor-ui/components/combobox/custom-value and https://www.telerik.com/kendo-angular-ui/components/dropdowns/multiselect/custom-values/ so the user can input tags on their own without them being in the app data source.
---
ADMIN EDIT
The following sample may be useful in implementing this in the meantime: https://github.com/telerik/blazor-ui/tree/master/multiselect/add-new-item
---
Currently, if the ReadOnly parameter value is set to 'true,' the user can modify the value of the DateInput by using the arrow keys.
Reproduction: https://blazorrepl.telerik.com/mxaiabvd178zy7p948
I want horizontal and vertical lines in the chart to act as markers (limits, thresholds). It would be awesome if there was a way to simply draw a horizontal and vertical lines, bound to a collection of y and x data respectively.
Something like the below would be nice
<TelerikChart>
<ChartSeriesItems>
<ChartSeries Type="@ChartSeriesType.Line" Name="@P_Name1" Color="blue"
Data="@P_Data1"
Field="@P_Field1"
CategoryField="@P_CategoryField1">
<ChartSeriesLabels Visible="true" Template="#=dataItem.P_Description#" />
<ChartSeriesMarkers Size="4" />
</ChartSeries>
<ChartHorizontalLines Data="@YLinesData"/>
<ChartVerticalLines Data="@XLinesData"/>
</ChartSeriesItems>
</TelerikChart>
@code{
List<double> YLinesData, XLinesData;
}
---
ADMIN EDIT
You can find some more details and ideas for workarounds here to consider in the meantime.
---
If you are zooming a page containing a DateTimePicker with "AdaptiveMode" set to "AdaptiveMode.Auto", the application crashes occasionally with the error:
Microsoft.JSInterop.JSException: Cannot read properties of null (reading 'addEventListener') TypeError: Cannot read properties of null (reading 'addEventListener')
The more adaptive DateTimePicker instances the page contains, the more likely the error is to occur.
The TelerikEditor demos all show bind-Value being used to marshal HTML in and out of the editor:
<TelerikEditor @bind-Value="@TheEditorValue" Width="650px" Height="400px"></TelerikEditor>
However, this causes problems - the underlying ProseMirror component emits it's own HTML (e.g. for image drag handles), which is visible in the bound Value property.
We need to be able to export "clean" HTML from the viewer, otherwise we end up saving this superflous HTML as part of our document.
This REPL shows the issue:
https://blazorrepl.telerik.com/mHODmObJ36vZ7ivR09
@page "/editor/tools"
@using Telerik.Blazor.Components.Editor
<TelerikEditor Tools="@EditorToolSets.All"
Height="300px"
@bind-Value="@Value"
EditMode="EditorEditMode.Div"
></TelerikEditor>
<pre style="white-space: pre-wrap;">@Value</pre>
@code {
public string Value { get; set; } =
"<img src=\"img/toolbar-assets/repl-logo.svg\" />";
}
1. Open the REPL and click "Run" - observe that the bound HTML is simply
<img src="img/toolbar-assets/repl-logo.svg" />
2. Click on the Telerik logo image inside the editor - observe that the bound HTML is now
<p><img src="img/toolbar-assets/repl-logo.svg" contenteditable="false" draggable="true" class="ProseMirror-selectednode"><div class="k-editor-resize-handles-wrapper ProseMirror-widget" style="width: 857px; height: 78px; top: 8px; left: 8px;" contenteditable="false"><div class="k-editor-resize-handle southeast" data-dir-image-resize="southeast"></div><div class="k-editor-resize-handle east" data-dir-image-resize="east"></div><div class="k-editor-resize-handle south" data-dir-image-resize="south"></div><div class="k-editor-resize-handle north" data-dir-image-resize="north"></div><div class="k-editor-resize-handle west" data-dir-image-resize="west"></div><div class="k-editor-resize-handle southwest" data-dir-image-resize="southwest"></div><div class="k-editor-resize-handle northwest" data-dir-image-resize="northwest"></div><div class="k-editor-resize-handle northeast" data-dir-image-resize="northeast"></div></div><br class="ProseMirror-trailingBreak"></p>
3. Deselect the image - observe that the bound HTML no longer contains the image handles etc, but is still more verbose than when we started
<p><img src="img/toolbar-assets/repl-logo.svg" contenteditable="false" draggable="true" class=""><br class="ProseMirror-trailingBreak"></p>
4. At any point during the above steps, click the "View HTML" button in the Editor toolbar - observe that it is able to present a "clean" structure which contains no ProseMirror markup etc.
How do we access this HTML via the TelerikEditor Blazor APIs?
Steps To Reproduce
Expected result:
The Create New Project wizard (or any other used Telerik wizard) is shown and usable as expected.
Actual result:
The Create New Project wizard is hidden or inaccessible and the project creation is blocked.
I have a ComboBox/DropDownList that gets data from a remote service, using virtualization. When the PageSize property is big enough (in my case 20), I have issues scrolling up the selection box dropdown list. I'm trying to scroll but then resets to the currently selected item making it almost impossible to scroll up. You can use your own demo examples to replicate this issue.
To reproduce the issue, try the ComboBox - Virtualization, in Telerik REPL (Demo), change the PageSize from 10 to 20. Open the dropdown and select an item. Then, open again the dropdown and scroll slowly up.
I would like to use the new structs that are part of .NET6 - the DateOnly and TimeOnly.
Their support should extend to all respective date and time pickers and more complex components like the Grid, Gantt, Scheduler, and other applicable components.
The Splitter separator has role="separator" attribute. When such a role is set and the separator is focusable, it is required that aria-valuenow attribute is also set. Currently, the Splitter separator does not have such an attribute.
From our point of view, the expected result is - NVDA / Narrator should announce separator value with respect to the position value for the separator (or no separator value at all).
Since upgrading from 3.8 to 4.4 (including all new css) created dialogs from DialogFactory are sometimes behind an already opened modal window.
The reason for this seems to be an incorrectly, automatically calculated z-index of 10003 when the open dialog has 10006.
This does not always happen, there are scenarios where the first created dialog works fine, and the next called in the same method suddenly is behind the dialog, thus the error seems to be in telerik and not our side.
We could not yet find a proper workaround apart from creating custom dialogs.
Hallo,
i want to Render PDF Files with the PDF Viewer Component.
The Data of the PDF is already fetched from the API when the PDF-Viewer starts Rendering the Loading animation appears and freezes.
After a few Seconds the PDF will be Rendered.
The size of the PDF File is about 5MB.
An example of this would be:
var orderParams = new DialogParameters();
orderParams.Add("SelectedOrderHeader", Item);
orderParams.Add("EditMode", "Add");
orderParams.Add("SelectedOrderDetail", new OMSOrderDetail());
DialogService.Show<OrdersDetailForm>("Click on orders grid to continue", orderParams);
<OrderDetailsForm> is a custom Blazor component.
Does the Telerik Blazor dev team have any plans for implementing something like this?
Current behavior:
When I click on an empty slot in the Scheduler the Start and End DateTimePickers are set to the default value of a DateTime object - 1/1/0001.
Expected/Desired behavior:
When I click on an empty slot in the Scheduler, the Start and End DateTimePickers should be set to the start and end date and time of the clicked slot.
Hello,
I'm trying to add image previewing to our .Net 6.0.8 Blazor Wasm app using the Telerik Blazor UI FileSelect component. I'd like to be able to create a local url for previewing and also hold onto the file's contents for saving later. There currently doesn't seem to be any great examples/references for doing this using the Telerik FileSelect locally. So, I started looking at the official MS Blazor documentation around images, file uploads and downloads - the most relevant content seemed to be around giving a file's stream to a DotNetStreamReference, then handing it off to JS interop to create a URL from a Blob.
It was already quite slow when testing with a 4KB~ image, but became absolutely unusable once testing things with a larger 4MB~ image. To rule out the Telerik FileSelect's involvement I started testing with the native Blazor FileInput component. I noticed that the sending the DotNetStreamReference to JS interop took a long time itself and learned that .Net 6 added the ability to pass a byte[] almost instantly to JS interop. I was then able to see image previews quickly using the native FileInput component while hosting a file from a byte[]. With this new knowledge in hand I attempted to migrate this new workflow over to the Blazor FileSelect component, but unfortunately there doesn't seem to be a faster way to get a byte[] from the FileSelectFileInfo's Stream.
I'm seeing similar performance issues between the native FileInput using a stream and the Telerik FileSelect using a stream or byte[]. These are both taking around 4-5 minutes to host a file with a locally generated url and preview the image. In contrast I'm seeing wait times around 3-12 seconds using the native FileInput/IBrowserFile, this
byte[] iBrowserFileBytes = new byte[iBrowserFile.Size];
await iBrowserFile.OpenReadStream(maxFileSize).ReadAsync(iBrowserFileBytes);
Please see the attached Blazor Wasm code to recreate the issue. I've included 6 file inputs to test out the difference in performance between each scenario, but the most important file input is the "Blazor InputFile - HostFromByteArray" which shows the most promise. Attached is also the larger file that I was testing against. This might be a bug or maybe I'm just not reading from the FileSelectFileInfo's Stream in the most efficient way.
The only relevant code not attached is likely just this one from Program.cs:
// ...
builder.Services.AddSingleton<IJSInProcessRuntime>(services => (IJSInProcessRuntime)services.GetRequiredService<IJSRuntime>());
// ...