Questions on UI for Blazor Forum

1 answer

114 views

Will a Visual Studio created project using the Telerik extensions still require javascript to run in the browser. I'm trying this out with the server-hosted Blazor project and it does not seem to carry out the button action when Javascript is turned off. The following code is what is running on the Index.razor page in the generated app.

--------------------------------------------------------------------------------------------------------------------------------------------------------

<TelerikButton OnClick="@SayHelloHandler" Primary="true">Say Hello</TelerikButton>

<br />

@helloString

@code {
MarkupString helloString;

void SayHelloHandler()
{
string msg = string.Format("Hello from <strong>Telerik Blazor</strong> at {0}.<br /> Now you can use C# to write front-end!", DateTime.Now);
helloString = new MarkupString(msg);
}

General Discussions

answered on 20 Mar 2020

9 answers

1.4K+ views

[Solved] Grid Filtering

Hi,

in the demo https://demos.telerik.com/blazor-ui/grid/filtering an extra filter row is always shown and the possible filter operators (==, !=, >, < , ...) are missing. How can I filter age > 40?

I need a filter similar to the Kendo UI grid: Filter button in column header and extra filter popup window with all operators, similar https://dojo.telerik.com/oQIyaHuD . Is that possible?

Best regards,

Peter

General Discussions

answered on 19 Mar 2020

1 answer

168 views

Limit # of items displayed

Is it possible to show a different result in the UI once a certain number of items has been selected?

MultiSelect

answered on 19 Mar 2020

1 answer

745 views

Limit # of items that can be selected

Is there a way to limit the number of items that can be selected in a MultiSelect component?

MultiSelect

answered on 19 Mar 2020

1 answer

630 views

Paging ComboBox items

Hi,

is it possible to combine combobox with paging ?

ComboBox

answered on 19 Mar 2020

6 answers

538 views

[Solved] Get selected node?

Seems like this should be simple, but it's eluding me. Basically, I have a treeview and button. If teh user has selected a node and then clicks on my button,

how do I tell which node is active?

Thanks … Ed

TreeView

answered on 19 Mar 2020

3 answers

1.6K+ views

[Solved] Customized TabStripTab Title

I am using TabStrip to display steps of a process. When any of the steps is completed, I would like to mark that tab. Ideally, I would like to put a checkbox in the tab title. Alternatively, placing an icon into the title would suffice. As a last option, if any of the previous ones are not possible, I would like to control the style of individual tabs with CSS. Is any of this possible?

TabStrip

answered on 19 Mar 2020

1 answer

114 views

[Solved] C# 8 features

Looking at your components for the first time and downloaded the 30 day trial today. I note in Visual Studio 2019 that you set <LangVersion> to 7.3 for each of the samples and the VS templates I've installed.

Is this a requirement to stay compatible with your package?

The big pull for us with C# 8 is nullable reference types. I suppose I can just turn it on and wait for Telerik components to be incompatible.

General Discussions

answered on 19 Mar 2020

1 answer

170 views

Templates for Appointments

It would be nice to have templating abilities for an appointment on the calendar. I would like to add more than just title and description. For instance, to have aircraft identifier, arrival and departure airport codes and depart times.

Scheduler

answered on 16 Mar 2020

5 answers

464 views

[Solved] Bind Style based on Selected Node

For this TreeView definition, I want the button background to be black with white font when the TreeItem.Selected property is true. Then, I want the node to go back to a clear background with black font when when that property is false. How do I do this?

@using System.Collections.ObjectModel

@using Palmer.Doc.Models

@page "/tree"

<TelerikButton Primary="true" OnClick="CreateItem">Create item</TelerikButton>

<TelerikButton Primary="true" OnClick="DeleteItem">Delete item</TelerikButton>

<TelerikTreeView Data="@TreeData">

<TreeViewBindings>

<TreeViewBinding IdField="Id"

TextField="Text">

<ItemTemplate>

@{

<TelerikButton OnClick="@(() => OnClickHandler(context as TreeItem))">@((context as TreeItem).Text)</TelerikButton>

}

</ItemTemplate>

</TreeViewBinding>

</TreeViewBindings>

</TelerikTreeView>

@code{

public class TreeItem

{

public string Id { get; set; } = $"{Guid.NewGuid()}";

public string Text { get; set; }

public string ContextId { get; set; }

public ObservableCollection<TreeItem> Items { get; set; } = new ObservableCollection<TreeItem>();

public bool Expanded { get; set; }

public bool HasChildren { get; set; }

public bool Selected { get; set; }

}

#region Properties

public TreeItem SelectedItem { get; set; }

public ObservableCollection<TreeItem> TreeData { get; set; }

#endregion

#region Event Handlers

protected override void OnInitialized()

{

LoadHierarchical();

}

private void OnClickHandler(TreeItem context)

{

SelectedItem = context;

}

#endregion

#region Methods

private void CreateItem()

{

if (SelectedItem != null)

{

AddNode(SelectedItem, "New Item");

}

private void DeleteItem()

{

if (SelectedItem != null)

{

TreeItem parent = GetById(SelectedItem.ContextId);

if (parent != null)

{

parent.Items.Remove(SelectedItem);

SelectedItem = parent;

SelectedItem.HasChildren = SelectedItem.Items.Count > 0;

SelectedItem.Expanded = SelectedItem.HasChildren;

}

private void LoadHierarchical()

{

ObservableCollection<TreeItem> roots =

new ObservableCollection<TreeItem>()

{

new TreeItem { Text = "Item 1", Expanded = true },

new TreeItem { Text = "Item 2" }

};

AddNode(roots[0], "Item 1 first child");

AddNode(roots[0], "Item 1 second child");

AddNode(roots[1], "Item 2 first child");

AddNode(roots[1], "Item 2 second child");

TreeData = roots;

}

private void AddNode(TreeItem parent, string childText)

{

AddNode(parent, new TreeItem()

{

Text = childText

});

}

private void AddNode(TreeItem context, TreeItem child)

{

child.ContextId = context.Id;

context.Items.Add(child);

context.HasChildren = true;

context.Expanded = true;

SelectedItem = child;

}

public TreeItem GetById(string id)

{

TreeItem result = null;

// perform a recursive search starting with the root nodes

foreach (var treeItem in TreeData)

{

result = getById(id, treeItem);

if (result != null) break;

}

return result;

}

/// <summary>

/// Perform a recursive search using the given node

/// </summary>

/// <param name="id"></param>

/// <param name="parent"></param>

/// <returns></returns>

private TreeItem getById(string id, TreeItem node)

{

TreeItem result = null;

if (node.Id == id)

{

result = node;

}

else

{

foreach (TreeItem child in node.Items)

{

result = getById(id, child);

if (result != null) break;

}

return result;

}

#endregion

}

TreeView

answered on 16 Mar 2020