Questions on UI for Blazor Forum

2 answers

1.0K+ views

[Solved] Grid Pageable System.ArgumentNullException: Value cannot be null

Hi replicate your demo in my project but adding pageable=true result in nullreferenceexception

<TelerikGrid Data="@MyData" Height="400px"
Pageable="true" PageSize="10" Page="1" Sortable="true" Groupable="true"
FilterMode="Telerik.Blazor.GridFilterMode.FilterRow"
Resizable="true" Reorderable="true">
<GridColumns>
<GridColumn Field="@(nameof(SampleData.Id))" Width="120px" />
<GridColumn Field="@(nameof(SampleData.Name))" Title="Employee Name" Groupable="false" />
<GridColumn Field="@(nameof(SampleData.Team))" Title="Team" />
<GridColumn Field="@(nameof(SampleData.HireDate))" Title="Hire Date" />
</GridColumns>
</TelerikGrid>

@code {
public IEnumerable<SampleData> MyData = Enumerable.Range(1, 30).Select(x => new SampleData
{
Id = x,
Name = "name " + x,
Team = "team " + x % 5,
HireDate = DateTime.Now.AddDays(-x).Date
});

public class SampleData
{
public int Id { get; set; }
public string Name { get; set; }
public string Team { get; set; }
public DateTime HireDate { get; set; }
}

}

System.ArgumentNullException: Value cannot be null. (Parameter 'format')
at System.String.FormatHelper(IFormatProvider provider, String format, ParamsArray args)
at System.String.Format(String format, Object arg0, Object arg1, Object arg2)
at Telerik.Blazor.Components.TelerikPager.<BuildRenderTree>b__104_0(RenderTreeBuilder __builder2)
at Microsoft.AspNetCore.Components.Rendering.RenderTreeBuilder.AddContent(Int32 sequence, RenderFragment fragment)
at Microsoft.AspNetCore.Components.CascadingValue`1.Render(RenderTreeBuilder builder)
at Microsoft.AspNetCore.Components.Rendering.ComponentState.RenderIntoBatch(RenderBatchBuilder batchBuilder, RenderFragment renderFragment)
at Microsoft.AspNetCore.Components.RenderTree.Renderer.RenderInExistingBatch(RenderQueueEntry renderQueueEntry)
at Microsoft.AspNetCore.Components.RenderTree.Renderer.ProcessRenderQueue()

Grid

answered on 07 Sep 2020

1 answer

143 views

[Solved] How do I format the <option> part of a dropdown?

See the attached image. The flag images are only 21px wide, but the PopupWidth is 69px.

So I seem to have 48px of margins and/or paddding.
Since the dropdown collapses when it no longer has the focus, i cannot see the styles in Chrome Devtools.

I am using <ItemTemplate> and <ValueTemplate> to format the <select> and <option> elements.

DropDownList

answered on 07 Sep 2020

1 answer

395 views

[Solved] Nested class TextField

This lightly modified ComboBox sample won't show the value of the nested class. Filtering does work, so I think this is a bug?

<TelerikComboBox @bind-Value=@SelectedValue

Data="@ComboBoxData"

Filterable="true"

ValueField="ProductId"

TextField="ProductName.Description">

<ItemTemplate>

<strong>@((context as Product).ProductName.Description) - @(String.Format("{0:C2}", (context as Product).UnitPrice))</strong>

</ItemTemplate>

</TelerikComboBox>

@code {

public IEnumerable<Product> ComboBoxData { get; set; }

public int SelectedValue { get; set; } = 2;

protected override void OnInitialized()

{

List<Product> products = new List<Product>();

for (int i = 1; i < 10; i++)

{

products.Add(new Product()

{

ProductId = i,

ProductName = new ProductName {Description = $"{i} Product {i}"},

UnitPrice = (decimal)(i * 3.14)

});

}

ComboBoxData = products;

base.OnInitialized();

}

public class Product

{

public int ProductId { get; set; }

public ProductName ProductName { get; set; }

public decimal UnitPrice { get; set; }

}

public class ProductName

{

public string Description { get; set; }

}

ComboBox

answered on 04 Sep 2020

9 answers

1.9K+ views

Showing/Hiding Grid Columns Issue

Hello,

I've replicated the show/hide grid columns feature as per the grid demo. The only issue i'm having is that "showing" the column results in the column being moved to the end of the grid instead of appearing in the order in which i have it placed in my list of GridColumns. Is this expected behavior and is there a way to force the columns to stay in the defined order even when they are being hidden and shown?

Thank You

Josh F.

Grid

answered on 03 Sep 2020

9 answers

316 views

[Solved] Individual independent Appointment colors

How do I influence the styling of appointments, and in particular the background color, without using a resource/groupby view or css?

I want to be able to decide runtime what the color should be.

Scheduler

answered on 01 Sep 2020

3 answers

158 views

[Solved] DateInput cannot handle the dd-MM-yy format

Every time you try to edit the year part, strange things happen.

"20" is not accepted as 2020, "60" not as 1960. Typing in a full year like 2020 is also not accepted.

Is this a bug, or am I doing something wrong?

DateInput

answered on 01 Sep 2020

1 answer

150 views

Flag specific schedule entries as uneditable?

Is there a way to specify that only certain entries are not editable, as opposed to the entire Scheduler component? I'm currently working around this by immediately returning from the CRUD handlers if they attempt to operate on one of the events. This is unexpected UX, since these entries look like they should respond to CRUD operations like "regular" entries.

Alternatively, how can I specify certain dates as outside of work hours? Specifically looking at things like federal holidays; Christmas, for instance, should never have an entry from a user.

Thanks,

Andrew

Scheduler

answered on 28 Aug 2020

2 answers

1.2K+ views

[Solved] Grid Icons

How do we change the icons used by the filter mode on the Blazor Grid?

For example the calendar and filter icon I have shown in my attachment are using Telerik Icons but we want to use Office UI Fabric Icons to match the rest of the site.

Grid