I have a grid in my web application(ASP.NET MVC). When I was testing it with NVDA Screen reader, NVDA reads its header and data(Content) section separately, like they are two different tables. May be this issue is due to two different table tags are used for header and grid content, that's why NVDA is reading it separately. How to solve this issue to make sure that NVDA recognize grid header and content as a single table only.

I added Kendo.Mvc.dll (2018.3.1017.545) to my mvc project in vs2019.

I write this code in my index.cshtml file.
@(Html.Kendo().Editor() .Name("Test") .HtmlAttributes(new { style = "width: 100%; height:840px" }) .Tools(tools => tools .Clear() .Bold().Italic().Underline() .JustifyLeft().JustifyCenter().JustifyRight() .InsertUnorderedList().InsertOrderedList() .Outdent().Indent() .CreateLink().Unlink() .InsertImage() .TableEditing() .FontName() .FontSize() .BackColor() .FontColor() ) .ImageBrowser(imageBrowser => imageBrowser .Image("~/shared/UserFiles/Images/{0}") .Read("Read", "ImageBrowser") .Create("Create", "ImageBrowser") .Destroy("Destroy", "ImageBrowser") .Upload("Upload", "ImageBrowser") ) .Value(@<text> </text>) )

and I added this using at top of my file:

@using Kendo.Mvc.UI

and I added these Scripts to _layout:

<script src="~/Scripts/kendo/kendo.all.min.js"></script>

<script src="~/Scripts/kendo/kendo.aspnetmvc.min.js">

</script><script src="~/Scripts/kendo/kendo.editor.min.js"></script>

even once I added all .js and .css file of kendo, but not worked.

but in chrome I see an empty TextArea.

what else should I do to fix it?

thanks

Hi,

I have a grid with a subgrid. A column in the parentgrid is calculated based on the sum of columns in the subgrid. When editing a column the value is saved properly. I have to do a refresh/read of the grids to show the new value. This is working properly. But after the refresh it is not visible for the user which row he just edited because everything is collapsed. How can I expand the row after the save to show the subgrid?

Kind regards,

Roel Alblas

Hi,

I like to render a column in the MVC grid with a dynamically rendered field with a color hex. This is in a subgrid wich is generated like below:

.ClientDetailTemplateId("templateSubTasks")

I know that when using a hashtag in a template grid you have to proceed it with two \ I also know that when using a hashtag for example a color hex, you have to proceed it with 4 \. But what when the color hex is loaded with a value from the data property like  #= data.TaskLabel?data.TaskLabel.Color:'' #

Her you can see the column I create in the parent grid. This has to be adjusted for use in a subgrid as a template.

columns.Bound(c => c.TaskLabel).Title(Order.clmLabel).ClientTemplate("<div style='border-radius: 3px; display:inline; width: 8px; height: 18px; background-color: #= data.TaskLabel?data.TaskLabel.Color:'' #'>&nbsp; </div><span style='margin-left:10px'> #= data.TaskLabel?data.TaskLabel.Name:'' #</span>").Width(100).Encoded(false).EditorTemplateName("GridDropdownEditorLabel");

I didn't succeed with adding \\\\ to the property data.TaskLabel.Color.

Do you have any idea?

Kind regards,

Roel Alblas

Hello,

Does anyone have an idea how to keep check box check status when changed page? 

I added check box as a ( ClientTemplate) column, user can check or uncheck them. but check box's value was removed after page moving. How to keep those status?  Thanks in advance.

Hello,

in C# I've got 2 ViewModels:

```

public class TestListViewModel

{

    public string Param { get; set; }

    public IEnumerable<TestViewModel> Counts { get; set; }

}

```

```

public class TestViewModel

{

    public string Name { get; set; }

    public int Count { get; set; }

}

```

now I will pass IEnumerable<TestListViewModel> as model to grid. How can I get the result like this: https://demos.telerik.com/aspnet-mvc/grid/aggregates?

I don't need to aggregate any data because it's already done. I just need to fill this grid somehow.

It's my local data, so the Grid will starts with:

```

@(Html.Kendo().Grid(Model)

    .Name("grid")

    .Columns(columns => (?))

    (...)

)

```

Another 'Invalid Template' error ... there are tons out there, and I thought I'd find my answer, but no.

The hierarchy (nested) grid below works great until I uncomment line 58 or 67.  Then I get the invalid template error.

I've escaped my hash symbols on line 52 as I read in a ton of other posts.

Does anyone spot anything amiss???

TIA

I am experiencing an issue where, using Internet Explorer 11, the animation containers on certain components do not appear in alignment with the component they are originating from. For the most part, what this means is the animations appear off to the left, but sometimes, animations also open above where they would open below on Edge or Chrome. Affected components are dropdown list in a grid's popup editor and filter menus appearing after a filter icon on a grid column is pressed.

Identical issue: https://stackoverflow.com/questions/60257190/alignment-issue-with-kendo-ui-dropdown-list-in-ie11

It seems like resolution has some influence on this because in some cases, the issue goes away when the page is very zoomed out (though it isn't very comfortable for the user at this point).

Hello

I am trying to  implement kendo grid,

I see all the data in grid but when i move to next page all the data is deseapers.

This is my controller code

  public async Task<ActionResult> TodaysSalesList([DataSourceRequest] DataSourceRequest request, DateTime? fileDate, int? pageSize, int? pageNo, int? loanCustomerId)
        {
            PagedResults<VmpLoanSalesVM> resultloans;
            try
            {
                var startDate = fileDate.GetValueOrDefault().Date;

                var dic = new DualControlDictionary
                {
                    { "date", startDate.Date.ToString() },
                    { "loanCustomerId", loanCustomerId.ToString() }
                };
                resultloans = await _dualControlService.GetData(dic);   
                var jsonRes = Json(resultloans.Results.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
                jsonRes.MaxJsonLength = int.MaxValue;
                return jsonRes;
            }
            catch (Exception e)
            {
                Log.Error(e);
                return Json(new
                {
                    success = false
                }, JsonRequestBehavior.AllowGet);
            }
        }

I have also tried return the data like this 

 var jsonRes = Json( new {Data=resultloans.Results.ToDataSourceResult(request),Total=esultloans.ResultsCount()}, JsonRequestBehavior.AllowGet);
                jsonRes.MaxJsonLength = int.MaxValue;
                return jsonRes;

But it doesn't help

See attched file my grid cshtml

Hello , 

I'm trying to filter a grid column having DateTime value , for eg - 12/21/2020 12:01:47 PM . and below my implementation .

This works for the first time only and if we open the filter menu again, the filter operator shows as blank (It should have the operator as Equals) and upon selecting a new value from operator list ,it throws JS error at d.filters[0].operator as d.filters[0] is coming as undefined.

Grid filter settings-
.Events(x => x.FilterMenuInit("filterDateWithoutTimeTest"))

.Filterable(f => f.Operators(operators => operators.ForDate(dt => dt.Clear()
                                                        .IsEqualTo("Equals")
                                                        .IsLessThan("EarlierThan")
                                                        .IsGreaterThan("LaterThan")
                                                        )))

function filterDateWithoutTimeTest(e) {
        var grid = e.sender;
        if (e.sender.dataSource.options.schema.model.fields[e.field].type === "date") {
            e.preventDefault();
            var columnTobeFiltered = e.field;
            e.container.find('button[type="submit"]').click(function (e) {     
                var existingFilters = grid.dataSource.filter();
                var newFilter = [];               
                var filterType = $(this.form).find($("select[data-role=dropdownlist]")).eq(0).val();
                if (filterType == "eq") {
                   
                    //gets the datePicker input date
                    var selectedDate = $(this.form).find($("input[data-role=datepicker]")).eq(0).val();

                    //    //create a filter
                    grid.dataSource.filter({
                        field: columnTobeFiltered,
                        //create custom filter operator
                        operator: function (fieldDate) {
                            var fieldDate2 = new Date(fieldDate);
                            var parsedSelectedDate = kendo.parseDate(selectedDate);
                            //parse the field date in order to ignore the time
                            var parsedFieldDate = new Date(fieldDate2.getFullYear(), fieldDate2.getMonth(), fieldDate2.getDate());
                            var result = (parsedFieldDate.getTime() == parsedSelectedDate.getTime());

                            return result;

                        },
                        value: selectedDate
                    });

                    //close filter window
                    $(gridElement).find("th[data-field=" + columnTobeFiltered + "]").data("kendoFilterMenu").popup.close();
                }
            })
        }
    }

Any help around this is appreciated.

Thanks