Telerik Forums
UI for Blazor Forum
0 answers
216 views

I have a Blazor Server app using TelerikGrid.  The grid has lots of columns and I have FilterMode set to FilterRow and the default filtering works great.  However, since the grid is also set to ScrollMode Virtual, there is no immediate indication of how well the filter is defined.  To fix this I want to display the number of records that are actually "filtered in" in comparison to the total number of records possible so that the user can tell if they've (for example) selected nearly all the records.  

I've looked everywhere and I cannot find a way to ask the grid how many records are currently filtered in.

It seems like I could take the FilterDescriptors, convert them to SQL for a where clause, and run the query every time they change the filter, but that seems like such a waste to essentially run the filter twice every time it reloads.  Even though my dataset is currently small enough that I cache the whole thing on the server, I'm still doing twice the work to get to a number the grid must know.

Here is a snippet from my Razor file:

@code { privateint _filteredCount = 0; // How to set this? } <TelerikGrid Data="@_applications" Pageable="false" Sortable="true" Resizable="true" FilterMode="@GridFilterMode.FilterRow" Width="100%" ScrollMode="@GridScrollMode.Virtual" OnStateInit="(GridStateEventArgs<ApplicationListDTO> args) => StateInitHandler(args)" OnStateChanged="(GridStateEventArgs<ApplicationListDTO> args) => StateChangedHandler(args)" Height="540px" RowHeight="60"> <GridColumns> Column definitions left outfor brevity </GridColumns>

</TelerikGrid> <div class="applicationCount">@(_applications.Count()) applications found, @_filteredCount listed</div>

Suggestions?

Scott
Top achievements
Rank 1
 updated question on 22 Sep 2023
1 answer
300 views

I am trying to create a new project using Telerik C# Blazor Application template in Visual Studio 2022. I am able to go through the template steps however on finish no project is created. The message bar at the bottom of visual studio says it was successful. I have Telerik UI for Blazor Extension installed and enabled.

Misho
Telerik team
 answered on 21 Sep 2023
2 answers
286 views

Is there a way to have a dropdownlist item be a color based on some criteria?

 

 

Hristian Stefanov
Telerik team
 answered on 20 Sep 2023
0 answers
478 views

Hi @all,

I am currently trying to create a TreeDropDownComponent.

so far it works, but I have the problem that it doesn't make sense inside a grid.
I am currently trying to create a TreeDropDownComponent.

so far it works, but I have the problem that it doesn't make sense inside a grid.

Because this component inside the grid cell
and so the popupElement is not above the grid. Does anyone have an idea how I can fix this?

here is my css and code:


@using Telerik.Blazor
@using Telerik.Blazor.Components

<div id="treeSelectorComponent">
    <span class="telerik-blazor k-dropdownlist k-valid k-picker k-picker-solid k-picker-md k-rounded-md"
          onclick="@ToggleDropdown">
        <span class="k-input-inner @( DropDownShown ? "k-state-focused" : "" )">
            <span class="k-input-value-text">@GetSelectedItemsText()</span>
        </span>
        <button class="telerik-blazor k-button k-input-button k-button-solid k-button-md k-button-solid-base k-icon-button"
                type="button">
            <span class="telerik-blazor k-button-icon k-icon k-i-caret-alt-down"></span>
        </button>
    </span>
    <TelerikAnimationContainer @ref="dropdown" Class="k-popup treeView-scrollable-element" >
        <TelerikTreeView Data="TreeItems"
                         SelectionMode="TreeViewSelectionMode.Single"
                         OnItemClick="OnTreeItemClicked">
            <TreeViewBindings>
                <TreeViewBinding ParentIdField="ParentId"
                                 TextField="Text"
                                 IdField="Id">
                    <ItemTemplate>
                        @{
                            TreeItemSelector item = context as TreeItemSelector;
                            <span>@item!.Text</span>
                        }
                    </ItemTemplate>
                </TreeViewBinding>
            </TreeViewBindings>
        </TelerikTreeView>
    </TelerikAnimationContainer>
</div>

@code {
    private bool DropDownShown { get; set; }
    private TelerikAnimationContainer dropdown;

    [Parameter, EditorRequired]
    public List<TreeItemSelector> TreeItems { get; set; } = new List<TreeItemSelector>();
    [Parameter]
    public int TreeId { get; set; } = default!;
    [Parameter]
    public EventCallback<int> TreeIdChanged { get; set; }

    async Task ToggleDropdown()
    {
        DropDownShown = !DropDownShown;
        await dropdown.ToggleAsync();
    }
    string GetSelectedItemsText()
    {
        return TreeItems.FirstOrDefault(p => p.Id == TreeId)?.Text!;
    }

    private async Task OnTreeItemClicked(TreeViewItemClickEventArgs arg)
    {
        var item = arg.Item as TreeItemSelector;
        TreeId = item!.Id;
        if(TreeIdChanged.HasDelegate)
            await TreeIdChanged.InvokeAsync(TreeId);

        await ToggleDropdown();
    }

  public class TreeItemSelector 
  {
      public int Id { get; set; }
      public string Text { get; set; }
      public int? ParentId { get; set; }
      public bool HasChildren { get; set; }
  }
}


#treeSelectorComponent {
    .k-popup {
        &.treeView-scrollable-element{
            overflow-y: auto;
            max-height: 300px;
        }
    }
}

Tino
Top achievements
Rank 1
Iron
 asked on 20 Sep 2023
1 answer
579 views

Hello, good afternoon.

I'm following this page's documentation to build a hierarchy grid. I just copied and pasted the code from the "Expand Rows From Code" example into my project just to see how it works (we are migrating Razor projects to Blazor).

I can see the grid is displayed with the "+" button to expand child grids on each row and even the button to expand all the rows at the top as it is shown in the image below:

Both do nothing, and DetailTemplate doesn't show up.

Some technical stuff:

  • .NET 5
  • The project is an MVC project with Blazor components in it
  • Telerik UI For Blazor 4.5.0 NuGet package
  • Visual Studio 2019
  • I cannot provide a code sample of how my project is structured. Is the company's property.

I hope this helps. I tried following the documentation without success.

Nahuel
Top achievements
Rank 1
Iron
 answered on 19 Sep 2023
0 answers
116 views

I have a TelerikGrid and the TelerikLoader is showing when data is OnRead.

My rows have detail template, that when you expland the row, I want another Loader window displayed while the detail data is retrieved.

I have tried the samples from Telerik but cannot get it to work. Either the Loader does not show at all, OR, I can get it to show and never hide

pls halp

G

George
Top achievements
Rank 1
Iron
Iron
 asked on 19 Sep 2023
1 answer
138 views
The gauge gets smaller if you try to put a label tag before the Gauge
Dimo
Telerik team
 answered on 19 Sep 2023
1 answer
241 views
In .NET 8, Microsoft will be introducing support for IAsyncEnumerable JSON deserialization (Streaming deserialization APIs). This feature allows for items in a long list to be deserialized as they are streamed to the client from a server, rather than waiting for the entire request to be completed. So it will result in a perceived performance increase. Is there any chance for Progress to look into bringing support for this feature to Telerik Data Source Responses? I can anticipate the data field in the response class makes this a challenging ask. Also, the server-side needs to be able to return yield for async items. I am interested in seeing this feature implemented so the grids in my applications that have many items will begin to be usable sooner.
1 answer
222 views
How can show the category and percentage on the chart's legend?
Dimo
Telerik team
 answered on 19 Sep 2023
0 answers
209 views

Hello, 

I want to create a grid like this with Telerik Blazor Grid:

Is it possible to do this using Multi Column Header function ? 

here's my code :

@{
	strMonth = string.Empty;
	iWeek = 0;
	<GridColumn Field="@dtGrid.Columns[0].ColumnName" FieldType="@dtGrid.Columns[0].DefaultValue.GetType()" Width="150px"></GridColumn> //Member
	<GridColumn Field="@dtGrid.Columns[1].ColumnName" FieldType="@dtGrid.Columns[1].DefaultValue.GetType()" Width="150px"></GridColumn> //Project

	for (int colMonth = 2; colMonth <= dtGrid.Columns.Count - 1; colMonth++)
	{
		if (DateTime.TryParse(dtGrid.Columns[colMonth].ColumnName, out dt))
		{
			if (strMonth != dt.ToString("MMMM"))
			{
				strMonth = dt.ToString("MMMM");

				<GridColumn Title="@strMonth" FieldType="@dtGrid.Columns[0].DefaultValue.GetType()">
					<Columns>
						@{
							iWeek = Helper.Common.GetWeekOfYear(dt);

							for (int colWeek = colMonth; colWeek <= dtGrid.Columns.Count - 1; colWeek++)
							{
								if (DateTime.TryParse(dtGrid.Columns[colWeek].ColumnName, out dt))
								{
									if (strMonth != dt.ToString("MMMM"))
									{
										colMonth = colWeek;
										break;
									}
									if (iWeek != Helper.Common.GetWeekOfYear(dt))
									{
										colMonth = colWeek;
										break;
									}
									<GridColumn Title="@string.Format("Week {0}", iWeek)" FieldType="@dtGrid.Columns[0].DefaultValue.GetType()">
										<Columns>
											@for (int iDay = colWeek; iDay <= dtGrid.Columns.Count - 1; iDay++)
											{
												if (DateTime.TryParse(dtGrid.Columns[iDay].ColumnName, out dt))
												{
													if (iWeek != RR.BusinessLogicLayer.Helper.Common.GetWeekOfYear(dt))
													{
														colWeek = iDay;
														break;
													}
													<GridColumn Field="@dt.Day.ToString()" FieldType="@dtGrid.Columns[colWeek].DefaultValue.GetType()" Width="150px"></GridColumn>
												}
											}
										</Columns>
									</GridColumn>
								}
							}
						}
					</Columns>
				</GridColumn>
			}
		}
	}
}

Above code only can get me until Month Column, when i debug it iWeek only fires after all column rendered ? so , it can't create the Child Column of Months Column.

How can i fix it so it can show Multi Header of Months, Week and Day

 

Mozart
Top achievements
Rank 1
Iron
Veteran
 updated question on 19 Sep 2023
Narrow your results
Selected tags
Tags
+? more
Top users last month
Bohdan
Top achievements
Rank 3
Iron
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Elliot
Top achievements
Rank 1
Iron
Iron
Iron
Sunil
Top achievements
Rank 1
Cynthia
Top achievements
Rank 1
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Bohdan
Top achievements
Rank 3
Iron
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Elliot
Top achievements
Rank 1
Iron
Iron
Iron
Sunil
Top achievements
Rank 1
Cynthia
Top achievements
Rank 1
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?