Questions on UI for Blazor Forum

0 answers

189 views

Sass ThemeBuilder

I had to search for a while and found nothing about this. For those who need to use ThemeBuilder for the import:
The json file must be adjusted before:
from

"base": "@progress/kendo-theme-default",
  "product": "kendo",
  "components": [],
  "themeBuilder": [
    {

to

 "base": "@progress/kendo-theme-default",
  "product": "kendo",
  "components": [],
  "groups": [
    {

Best regards Matthias

General Discussions

asked on 28 Oct 2021

0 answers

215 views

Displaying a DropDownList of Page Sizes for a Paged Grid

I see that there is a way to set and show a list of PageSizes in a dropdown list on the Pager control. Is there a way to do that for a paged Grid control?

Grid

Pager

asked on 27 Oct 2021

1 answer

175 views

Edit the text of a Treeview item node

I have a requirement where the user needs to be able to add a node to the treeview, which I have working. The requirement however is to NOT use a popup to prompt for the text for the node, but rather add the node - and have it editable straight away. The users can then enter the text, and either hit enter, or press/click somewhere else on the screen to commit the text change - and in turn - call the relevant API endpoint to persist the text.

Any ideas? Was hoping for an <EditItemTemplate> of sorts, but only <ItemTemplate> seems to be available.

Any assist appreciated :)

Editor

TreeView

answered on 27 Oct 2021

1 answer

521 views

Centering GridCheckBoxColumn

I am coming up to speed on using Blazor with little other web experience, so the answer probably a gap in my knowledge that is right in front of me and I can't see it... that being said:

I have a fairly standard DataGrid (included below), and it has been requested that the GridCheckBoxColumn have the checkbox centered.

For other items requiring some kind of formatting, I would just template the column with a <div> and handle things. However, I could not find anything on how to manipulate the GridCheckBoxColumn other than the OnCellRender event. I have been able to verify I am receiving the event by changing the background color, but I have not found anything that will center the checkbox

Thanks!

Bob

<TelerikGrid Data=@lstGridData SelectionMode="GridSelectionMode.Single" Pageable="true" SelectedItemsChanged="@((IEnumerable<CEnterprise> enterprises) => OnSelect(enterprises))" Width="100%" PageSize="12">
<GridToolBar> <TelerikButton OnClick="@( () => EnterpriseEdit(null) )" Icon="add">Add new Enterprise</TelerikButton> </GridToolBar>
<GridColumns>
<GridCheckboxColumn SelectAll="false" Title="Select" OnCellRender="@( (e) => MakeItCentered(e) )" />
<GridColumn Field="EnterpriseName" Title="Name" />
<GridColumn Field="DisplayLocation" Title="Location" />
<GridColumn Field="ContactName1" Title="Contact" />
<GridColumn Field="ContactName2" Title="Contact 2" />
<GridCommandColumn Title="Edit" Width="8%" Context="ctxAuthorizeViewRender">
<GridCommandButton OnClick="@((args) => EnterpriseEdit(args.Item as CEnterprise))" Icon="edit">Edit</GridCommandButton>
</GridCommandColumn>
</GridColumns>
</TelerikGrid>

@Code

{

void MakeItCentered(GridCellRenderEventArgs args)
{
args.Class = "tiddleywinks";

}

}

Grid

answered on 27 Oct 2021

1 answer

450 views

Responsive Grid for RowHeight and PageSize

The blazor-ui samples blazor-ui/ResponsiveGrid.razor at master · telerik/blazor-ui · GitHub show using a windows hook to make a responsive GRID. I've had pushback on this saying that BootStrap using CSS can do this instead. Is there another approach using CSS that can make the GRID responsive to window resizing and changes in media sizes?

Grid

answered on 26 Oct 2021

0 answers

774 views

Telerik Blazor Grid ForEach

I have the following grid. I the student has many different schools. How do I list the different schools in one column.

<TelerikGrid Data="@openTipGridData" ...>
<GridToolBar>

</GridToolBar>
<GridSettings>
<GridPagerSettings InputType="PagerInputType.Input" PageSizes="@gobalPageSizesOptions" ButtonCount="5" />
</GridSettings>
<GridColumns>
<GridColumn Field="Student.FirstName" Title="First Name"></GridColumn>
<GridColumn Field="Student.LastName" Title="Last Name"></GridColumn>
<GridColumn Title="Schools">
<Template Context="Schools">
@foreach (DataColumn col in openTipGridData.Student.Schools)
{

}
</Template>
</GridColumn>
<GridColumn Field="Encounter.AddDate" DisplayFormat="{0:dd MMM yy}" Title="Assigned To"></GridColumn>
</GridColumns>
</TelerikGrid>

Grid

asked on 25 Oct 2021

1 answer

214 views

In Scheduler, open default "CreateAppointment" with external button click and not with double click event

I would simulate the "DblClick" event that Telerik use to open the window with the "Create Appointment" default fields. I have a button in the page, outside the TelerikScheduler component, and I would like to create a new Appointment by there, using the default "CreateAppointment" Telerik window, obviously with tha "StartDate" and "EndDate" fields empty. A generic Appointment, in few words.
Is there any way to do this? Where I can find the method that open that window?

(I found this in the "kendo.all.min.js", but I am not sure if it is the right point where Telerik launch the method:

t.trigger("add", {
        eventInfo: f({
        start: i.startDate(),
        end: i.endDate()
      }, o);

if it is, how can I use it?)

Thanks,

Angelo Marzullo

Scheduler

answered on 25 Oct 2021

1 answer

561 views

[Solved] Prevent selection of content div

Out of the box the content div (with the k-tabstrip-content class) has a tabindex="0" attribute. Is there a way I can get the TelerikTabStrip to generate this with tabindex="-1" to prevent the div from being selected.

TabStrip

answered on 25 Oct 2021

1 answer

582 views

Controlling the width of a vertical tab strip?

With the upgrade to 2.27 My vertical tab strip has become narrower and my labels are wrapping. How would control the width of the vertical tab strip and/or control the size of the font in the labels?

TabStrip