Questions on UI for Blazor Forum

2 answers

119 views

[Solved] DropDownList with build in MRU list

My form has a DropDownList with products.

I would like to have the last 10 used products on top. I will store the 10 last used products in localstorage and then sort the list, so the MRU items are on top.

Has anyone implemented something similar?

Can I rearrange the items in the DDL without triggering any events. Also can I add a divider between the MRU items and the rest of the products?

DropDownList

updated answer on 31 Jan 2023

1 answer

605 views

[Solved] How to change model bind to EditContext and FluentValidator validator

I have a dropdownlist on my form, to select products from.

When I load a new product I get the following error:

Cannot validate instances of type 'ManualCertificateTrade'. This validator can only validate instances of type 'ManualTradeModel'

ManualCertificateTrade is my razor view and ManualTradeModel is the model I load from my API.

This is my code behind class.

publicpartialclassManualCertificateTrade
{
    [Inject] public IManualCertificateTradeService TradeService { get; set; }

    private EditContext EditContext { get; set; }
    private ManualTradeModel ManualTradeModel { get; set; } = new();
    private ManualTradeValidator TradeValidator { get; set; } = new();
    private List<Product> Products { get; set; } = new();
    privateint SelectedProductId { get; set; }

    protected override async Task OnInitializedAsync()
    {
        EditContext = new EditContext(ManualTradeModel);
        Products = await TradeService.GetProducts();
    }

    private async Task ProductChangedEvent(object id)
    {
        if (id isint productId)
        {
            TradeValidator = null;
            SelectedProductId = productId;
            ManualTradeModel = await TradeService.GetNewManualTrade(productId);
            EditContext = new EditContext(ManualTradeModel);
            TradeValidator = new();
        }
    }
}

Form

answered on 31 Jan 2023

1 answer

286 views

TreeView - load Data

Hi, could you advice me please, how can I load data from XML or JSON to TreeView.

Thanks

Peter

TreeView

answered on 28 Jan 2023

1 answer

227 views

CSS Styling of GridSearchBox

I'm looking to change the selected styling of the grid search box.

When currently selected it is set as blue (using the theme I'm using).

I have set up a css class and referenced it from the search box itself. What I don't understand is how to change the selected border styling colour of the search box. This is what I have thus far:

.gridsearchbox {
    height: 24px;
    margin-right: 4px !important;
    font-size: 12px !important;
}

I just want to set the selected border colour to for example red.

Many thanks,

Rob

Grid

answered on 27 Jan 2023

1 answer

467 views

Show hint in a form template

How can I show a hint when using a formtemplate? I am using code code like this validation messages for templated Form items But are missing the Hint for a consistent layout.

Also why not add change events to the FormItem

Form

answered on 27 Jan 2023

1 answer

205 views

SplitButton Causes Errors

We've used the SplitButton on a variety of windows, and after upgrading to v4.0 we've noticed that the pages containing a SplitButton do not load, they simply die off into never-never land. Somewhere we've seen OutofMemory but we are not positive it's happening on this call. We have a few different use cases for our SplitButtons - Save, Save & Close, and Delete. The other is to choose your printing or email type.

Do we have this formatting incorrectly? They work in v3.7 just fine.

And, I noticed the documentation is for v3.7, not v4.0 -- https://demos.telerik.com/blazor-ui/splitbutton/overview

<TelerikSplitButton Icon="@SvgIcon.Save" OnClick="@(() => HandleValidSubmit(false))">
                                        <SplitButtonContent>Save</SplitButtonContent>
                                        <SplitButtonItems>
                                            <SplitButtonItem Class="mr-2 save" OnClick="@( () => HandleValidSubmit(false))" Icon="@SvgIcon.Save">Save</SplitButtonItem>
                                            <SplitButtonItem Class="mr-2 save" OnClick="@( () => HandleValidSubmit(true))" Icon="@SvgIcon.Save">Save & Close</SplitButtonItem>
                                            <SplitButtonItem Class="mr-2 delete" OnClick="@ButtonDeleteOnClick" Icon="@SvgIcon.Trash" Enabled="@IsDeletionAllowed">Delete</SplitButtonItem>
                                        </SplitButtonItems>
                                    </TelerikSplitButton>

                                <TelerikSplitButton Class="print-button" OnClick="@OnPreviewClickHandler" Icon="@SvgIcon.FilePresentation">
                                    <SplitButtonContent>Print To</SplitButtonContent>
                                        <SplitButtonItems>
                                            <SplitButtonItem Class="print-button"
                                                        OnClick="@OnPreviewClickHandler" Icon="@SvgIcon.FilePresentation">Preview</SplitButtonItem>
                                            <SplitButtonItem Class="print-button"
                                                        OnClick="@OnPdfClickHandler" Icon="@SvgIcon.FilePdf">PDF</SplitButtonItem>
                                            <SplitButtonItem Class="print-button"
                                                        OnClick="@OnExcelClickHandler" Icon="@SvgIcon.FileExcel">Excel</SplitButtonItem>
                                            <SplitButtonItem Class="print-button"
                                                        OnClick="@OnWordClickHandler" Icon="@SvgIcon.FileWord">Word</SplitButtonItem>                                            
                                            <SplitButtonItem Class="print-button"
                                                        OnClick="@OnClick_BtnEmail" Icon="@SvgIcon.EnvelopLink">Send Email</SplitButtonItem>
                                            <SplitButtonItem Class="print-button"
                                                        OnClick="@OnClick_BtnText" Icon="@SvgIcon.Rss">Send Text</SplitButtonItem>
                                        </SplitButtonItems>
                                </TelerikSplitButton>

SplitButton

answered on 26 Jan 2023

1 answer

233 views

[Solved] A timeline with just the week numbers of the year

I am trying to create a timeline component that is just using week numbers of the current year. I am looking at the Gantt chart but not sure how to customise the view to use just week numbers. There is a similar thing for telerik wpf called RadTimeline which is kind of what I want but for Blazor.

Here is an example.

Charts

Gantt

answered on 26 Jan 2023

1 answer

229 views

[Solved] Is there a way to keep a pane content (Collapse/Expand)?

If the splitter pane is collapsed, its content is disposed and re-initialized again when the user expands the pane.

Is there a way to keep a pane content?

Splitter

answered on 25 Jan 2023

1 answer

535 views

[Solved] Why are the Label for a disabled FormItem dimmed?

I want some properties to be read-only. I am okay with the disable style on the textbox, that's standard.
But why dimme the label?

Whats the best way to make the label normal again?

Form