Questions on UI for ASP.NET Core Forum

9 answers

607 views

Special autoFit Column for only a fews rows?

Hello,

I know that it is possible to use "autoFitColumn" to size the columns in a scrollable grid but it is slow for many rows - disable Scrolling is not an Option.

Is there a possibility (Javascript) to resize the columns only for the content of the first few (10) rows, so that it is faster?
(loop through the first rows and resize all coumns...)

function gridDataBound(e) {

var grid = $("#gridEQ").data("kendoGrid");

for (var i = 0; i < grid.columns.length; i++) {

grid.autoFitColumn(i);

}

Grid

answered on 19 Jun 2017

1 answer

256 views

ASP.NET Core Grid - Foreign Key Relationship Example

I'm needing an example for creating an inline-editable grid that consists of a transaction (parent) and items in that transaction (children). Upon accessing the grid, it should be empty as this is a new transaction. Because it is new, the transaction will need to be created and then the items will be added and displayed on the grid. Once the user has added all necessary items, they click save to submit the new transaction and it's items.

I was able to create the grid, but could never link child with parent. I spent some time with this example here (http://demos.telerik.com/aspnet-core/grid/foreignkeycolumn), but it assumes that the parent (Categories) listing already exists, whereas I need to create the parent and children together.

Grid

answered on 16 Jun 2017

1 answer

176 views

DropDownList in Toolbar ButtonDropDown?

Hello,

I want to have a DropDownList in Toolbar ButtonDropDown )(see attached Picture) - is this possible?

robert

Toolbar

answered on 16 Jun 2017

1 answer

269 views

Visual Studio Intellisense Client Side

I am using the asp.net core trial. Can you please provide instructions on how I can get intellisense to work with javascript in Visual Studio 2017?

General Discussions

answered on 15 Jun 2017

4 answers

494 views

Remove Row with Javascript and Aggregates/Groups not refresh

Hello,

If I use the following code to remove a row in the grid and the grid has Aggregates/Groups this Aggregates and groups are not refreshed...
(without Aggregates/Groups it works) see attached picture...

Grid

answered on 15 Jun 2017

3 answers

727 views

No Error Event with Async Read Action

Hello,

I have the following Grid:

@(Html.Kendo().Grid<dynamic>()

.Name("gridEQ")

.Columns(columns =>

{

columns.AutoGenerate(true);

})

.Pageable()

.Sortable()

.Scrollable()

.Selectable(s => s.Mode(GridSelectionMode.Multiple))

.NoRecords()

.Filterable(f => f.Enabled(false))

.AutoBind(false)

.DataSource(dataSource => dataSource

.Ajax()

.PageSize(100)

.Read(read => read.Action("ReadAsync", "Home"))

)

If I use the Read Action (synchron) like this and an error on the Server exists the error Event of the grid datasource is raised:

public IActionResult Read(bool execute, string queryJson, string optionsJson, [DataSourceRequest] DataSourceRequest request)

{

try

{

var query = eqService.GetQueryByJsonDict(queryJson.ToJsonDict());

var sql = eqService.BuildQuery(query, optionsJson.ToJsonDict());

if (execute)

{

SqlConnection c = new SqlConnection(this.cache.Get("ExecuteConnectString").ToString());

result = c.Query<dynamic>(sql, commandType: System.Data.CommandType.Text);

return Json(result.ToDataSourceResult(request));

}

catch (Exception ex)

{

return Json(ex);

}

If I use the AsyncRead Action like this and an error on the Server exists the error Event of the grid datasource is not fired:

public async System.Threading.Tasks.Task<ActionResult> ReadAsync(bool execute, string queryJson, string optionsJson, [DataSourceRequest] DataSourceRequest request, CancellationToken cancellationToken)

{

try

{

var query = eqService.GetQueryByJsonDict(queryJson.ToJsonDict());

var sql = eqService.BuildQuery(query, optionsJson.ToJsonDict());

if (execute)

{

SqlConnection c = new SqlConnection(this.cache.Get("ExecuteConnectString").ToString());

result = await c.QueryAsync<dynamic>(sql, commandType: System.Data.CommandType.Text, cancellationToken: cancellationToken);

return Json(result.ToDataSourceResultAsync(request));

}

catch (Exception ex)

{

return Json(ex);

}

Why this?

What I'm missing?

robert

Grid

answered on 15 Jun 2017

1 answer

342 views

Row based multiple selection and batch edit

I'm trying to setup a grid with Multiple, Row based selection in combination with InCell editing. The issue is that a click of an editable cell causes selection of that row (and messes up existing selections). I thought I could wire up my own click event and determine if a clicked cell was editable, then disable the selection, however I can't find a way to remove the select event that is connected to the containing table of the grid.

In trying to unbind the event, it appears since it was not bound via jQuery, jQuery can't unbind it. Any other suggestions for how to accomplish this combination of functionality with the grid control?

Thanks in advance - Greg

Grid

answered on 15 Jun 2017

1 answer

243 views

Implementing Multiselect inside a grid

I have been reading this: http://www.telerik.com/support/code-library/using-multiselect-in-grid as I want to implement a multiselect in a InCell, batch(true), ajax grid.

Does this still apply in Core or is there a new way to implement this?

Please if you could guide me to a full CRUD example which also shows ViewModel binding as well. Thank you.

MultiSelect

answered on 14 Jun 2017

4 answers

110 views

Accessibility: Navigate

Hello,

if you navigate through the listview items, the parents aria-activedescendant is never updated. Just the elements get an updated ID attribute. This is a wrong behaviour. Every item needs an ID and the aria-activedescendant needs to be updated.

„When the composite widget contains focus and the user presses a navigation key that moves focus within the widget, such as an arrow key: Change the value of aria-activedescendant on the container to refer to the element that should be reported to assistive technologies as active“ (http://www.w3.org/TR/wai-aria-practices-1.1/#kbd_focus_activedescendant).

I would also prefer to get an updated aria-selected on navigate and not on "mark" an item. You should test the widgets with a screenreader like JAWS. When I navigate through the listview, the screenreader is not triggered, so it is impossible for a person who relies on a screenreader to control this widget.

ListView

answered on 14 Jun 2017

1 answer

143 views

Accessibility: Toolbar

Hello,

the buttons of the dialog are defined as "role=toolbar". In this case the buttons need to be controlled by the arrow keys and to disable the tab function.

"For a horizontal toolbar (the default):
Left Arrow: Moves focus to the previous control. Optionally, focus movement may wrap from the first element to the last element.
Right Arrow: Moves focus to the next control. Optionally, focus movement may wrap from the last element to the first element."

Also the "role=toolbar" should just be set, if the item count is three or more.

"Use toolbar as a grouping element only if the group contains 3 or more controls."

Source: https://www.w3.org/TR/2014/REC-wai-aria-20140320/roles#toolbar

You should remove the "role=toolbar" or just set it with three items or more and add the arrow control.

Dialog