Hello All, I followed this example https://demos.telerik.com/aspnet-mvc/grid/server-grouppaging-virtualization to implement in my project, however i am getting error while doing grouping with mutiple columns, i tried searching in the forms for a solution but no luck. 

This is my Code below

My Controller class ListController.cs

When i run the application virtualisation,sorting,filtering,paging works perfectly without grouping, when i try to group with first colum drag and drop all the events work perfectly, but when i try to drag second column to grouping i get the following error (errorDebug.png) and in the browser console window i have this error

Uncaught TypeError: Cannot read property 'length' of undefined
    at Function.map (jquery-1.10.2.js:789)
    at init.groups (kendo.aspnetmvc.js:212)
    at proxy (jquery-1.10.2.js:841)
    at init.groups (kendo.all.js:6508)
    at init._readData (kendo.all.js:7371)
    at init.success (kendo.all.js:7575)
    at success (kendo.all.js:7527)
    at Object.n.success (kendo.all.js:6404)
    at fire (jquery-1.10.2.js:3062)
    at Object.fireWith [as resolveWith] (jquery-1.10.2.js:3174)

Could you please help me to resolve this issue?

Hello All,

I have a Kendo grid where all of its columns do not fit into the grid width. 

If there is a least one row of data to display the grid shows a horizontal scrolling bar.

However if there is no data, there is no horizontal scrolling bar. Even though it is a cosmetic issue and it happens when there is nothing to display, some of my users complain and want to have horizontal scrolling bar displayed.

Is there any way to get this done?

Thank you!

The FileManager breadcrumb links for previous folders don't seem to work like I would expect. Instead of opening the folder that was clicked on, it appears that the breadcrumb link leads to "#". Clicking on the root folder icon seems to work correctly (opens the root folder) but folder links don't seem to work out of the box.

Is there some kind of configuration that I'm missing?

Hello there.

So what I'm trying to do is to disable/enable grid editing from Javascript. Here's the code done with MVC:

        @(Html.Kendo().Grid<DocumentGoodsReceiptFuel>()
                  .Name("fuelGrid")
                  .Columns(columns =>
                  {
                      columns.Bound(c => c.MaterialString).Title("Material").Width(150);
                      columns.Bound(c => c.QuantityOrdered).Title("Quantity dispatched").Width(150);
                      columns.Bound(c => c.QuantityUnloaded).Title("Quantity unloaded").Width(150);

                  })
                  .Scrollable(a => a.Height("auto"))
                  .Filterable(filterable => filterable.Enabled(true))
                  .Pageable(pager => pager.Refresh(false))
                  .Sortable(sortable => sortable.Enabled(true)).AutoBind(false)
                  .Selectable(selectable => selectable.Mode(GridSelectionMode.Multiple))
                  .AllowCopy(true)
                  .Editable(editable => editable.Mode(GridEditMode.InCell))
                  .DataSource(dataSource => dataSource.Ajax().ServerOperation(false).Batch(false).PageSize(100)
                  .Model(model =>
                  {
                      model.Id(gridMainAlias => gridMainAlias.ID);
                      model.Field(gridMainAlias => gridMainAlias.MaterialString).Editable(false);
                      model.Field(gridMainAlias => gridMainAlias.QuantityOrdered).Editable(true);
                      model.Field(gridMainAlias => gridMainAlias.QuantityUnloaded).Editable(true);
                  }))
                    .Resizable(resize => resize.Columns(true))
                    .Mobile(MobileMode.Auto)
        )

I'd like to disable and enable the last two columns (or entire grid, both goes) from Javascript dynamically/on demand. 
I've tried this: $('#fuelGrid').data('kendoGrid').dataSource.options.schema.model.fields["QuantityUnloaded"].editable =false
but it doesn't work, it just sets the editable false for that column but it doesn't refresh the settings or something, so the change is not applied on the grid. What do you recommend in this scenario? Thanks in advance!

Hi,

I want to display the existing files based on the value of the HttpPostedFileBase properties in my view model. How can I achieve this without using asynchronous uploading?

I tried what is written in this blog but whenever I save the form, the value of the files are lost.

Form:
@(Html.Kendo().Upload()
                                        .Name("LogoImage")
                                        .Multiple(false)
                                        .Messages(m => m.Select("Upload"))
                                        .Validation(validation => validation
                                            .AllowedExtensions(new string[] { ".gif", ".jpg", ".png" })
                                            .MaxFileSize(2097152)
                                        )
                    )

View model:
public HttpPostedFileBase LogoImage { get; set; }

Hey everyone,

I'm trying to create a small grid for "articles" which is grouped by "articleGroup".
Now the plan is to change the ClientGroupHeaderTemplate, to add a checkbox to check all sub elements, for the group without showing it as a column in the grid.

I can set the grouping in the dataSource, but I struggle to add the checkbox to the group header without adding it as a column.

Best regards

Nils

I have a master / detail grid with a custom add new button in the child inline record that popups up a partial view.  I'm trying to understand why the add new child record doesn't appear on the UI.

Any help would be greatly appreciated.

-----

@{
    ViewData["Title"] = "Vendor";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<div class="mt-3">
    <h3>Vendor</h3>

    @(Html.Kendo().Grid<I2MS.Models.VendorViewModel>()
        .Name("gridVendor")
        .Columns(columns =>
        {
            columns.Bound(e => e.VendorID).Hidden(true);
            columns.Bound(e => e.VendorCode).Filterable(false).Width(40);
            columns.Bound(e => e.Name).Width(70).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
            columns.Bound(e => e.Address).Filterable(false).Width(40);
            columns.Bound(e => e.Address2).Filterable(false).Width(40);
            columns.Bound(e => e.City).Filterable(false).Width(40);
            columns.Bound(e => e.State).Filterable(false).Width(40);
            columns.Bound(e => e.PostalCode).Filterable(false).Width(40);

            columns.Template("<a title=\"Edit\" onclick=AddEditVendor(event);><img src='images/edit.png' alt='edit' /></a> &nbsp; <a role='button' title='Delete' onclick='onDeleteVendor(event)'><img src='images/delete.png' alt='delete' /></a>").Width(50);
        })
        .Filterable(ftb => ftb.Mode(GridFilterMode.Row))
        .Sortable()
        .Pageable()
        .Scrollable()
        .ClientDetailTemplateId("template")
        .HtmlAttributes(new { style = "height:600px;" })
        .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(6)
        .Read(read => read.Action("HierarchyBinding_Vendor", "Vendor"))
        .Model(model => { model.Id(i => i.VendorID); })
        )
        .Events(events => events.DataBound("dataBound"))
        .ToolBar(toolbar =>
        {
            toolbar.Custom().Name("<span class='k-icon k-i-add'></span>Add New Vendor").HtmlAttributes(new { style = "float:right", id = "btnAddNewVendor", onclick = "AddEditVendor()" });
        })
)
    @(Html.Kendo().Window().Name("dlgAddEditVendor").Visible(false).Modal(true).Draggable(true))
    @(Html.Kendo().Window().Name("dlgAddEditVendorContact").Visible(false).Modal(true).Draggable(true))

    <script id="template" type="text/kendo-tmpl">
        @(Html.Kendo().Grid<I2MS.Models.VendorContactViewModel>()
            .Name("grid_#=VendorID#")
            .Columns(columns =>
            {
                columns.Bound(o => o.VendorContactID).Hidden();
                columns.Bound(o => o.FirstName).Width(40);
                columns.Bound(o => o.LastName).Width(40);
                columns.Bound(o => o.Phone).Width(40);
                columns.Bound(o => o.Email).Width(40);
                columns.Bound(o => o.Address).Width(40);
                //columns.Bound(o => o.Address2).Width(200);
                columns.Bound(e => e.City).Width(40);
                columns.Bound(e => e.State).Width(40);
                columns.Bound(e => e.PostalCode).Width(40);

                columns.Template("<a title=\"Edit\" onclick=AddEditVendorContact(event,#=VendorID#);><img src='images/edit.png' alt='edit' /></a> &nbsp; <a role='button' title='Delete' onclick='onDeleteVendorContact(event,#=VendorID#)'><img src='images/delete.png' alt='delete' /></a>").Width(40);
            })
            .DataSource(dataSource => dataSource
                .Ajax()
                .PageSize(10)
                .Read(read => read.Action("HierarchyBinding_VendorContacts", "VendorContact", new { vendorID = "#=VendorID#" }))
                .Model(model => { model.Id(i => i.VendorContactID); })
            )
            
            .ToolBar(toolbar =>
            {
                toolbar.Custom().Name("<span class='k-icon k-i-add'></span>Add New Vendor Contact").HtmlAttributes(new { style = "float:right", id = "btnAddNewVendorContact", onclick = "AddEditVendorContact(null,#=VendorID#)" });
            })
            .Pageable()
            .Sortable()
            .ToClientTemplate()

    )
    </script>
</div>

<script>
    var gridName = "";
    function AddEditVendorContact(event, VendorID)
    {
        gridName = "grid_" + VendorID;
        var window = $('#dlgAddEditVendorContact').data('kendoWindow');
        if (event != null )
        {
            window.setOptions({ title: "Edit Vendor Contact" });
            var dataItem = $("#" + gridName).data('kendoGrid').dataItem($(event.currentTarget).closest("tr"));
            var url = "@Url.Action("AddEditVendorContact", "VendorContact")" + "?VendorContactID=" + dataItem.VendorContactID + "&VendorID=" + VendorID;
            MvcCommon.Kendo.ShowPartialViewInPopupWindow({
                windowName: "dlgAddEditVendorContact",
                windowWidth: 660,
                windowHeight: 450,
                url:url
            });
        }
        else
        {
            window.setOptions({ title: "Add New Vendor Contact" });
            var url = "@Url.Action("AddEditVendorContact", "VendorContact")" + "?VendorContactID=" + "&VendorID=" + VendorID;
            MvcCommon.Kendo.ShowPartialViewInPopupWindow({
                windowName: "dlgAddEditVendorContact",
                windowWidth: 660,
                windowHeight: 450,
                url: url
            });
        }
    }

    function onDeleteVendorContact(event, VendorID)
    {
        if (confirm('Are you sure you want to delete this Record?'))
        {
            var gridName = "grid_" + VendorID;
            var dataItem = JSON.stringify($("#" + gridName).data('kendoGrid').dataItem($(event.currentTarget).closest("tr")));
            if (dataItem && dataItem != null)
            {
                $.ajax({
                    cache: false,
                    type: 'POST',
                    dataType: 'JSON',
                    contentType: 'application/json; charset=utf-8',
                    data:  dataItem,
                    url: '@Url.Action("DeleteVendorContact", "VendorContact")',
                    success: function (result) {
                        if (result && result.success == true) {
                            $('#' + gridName).data('kendoGrid').dataSource.read();
                        }
                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {},
                    complete: function (xhr, status) {}
                });
            }
        }
    }

    function dataBound() {
        this.expandRow(this.tbody.find("tr.k-master-row").first());
    }


    function AddEditVendor(e)
    {
        var window = $('#dlgAddEditVendor').data('kendoWindow');
        if (e != null)
        {
            window.setOptions({ title: "Edit Vendor" });
            var dataItem = $("#gridVendor").data('kendoGrid').dataItem($(e.currentTarget).closest("tr"));
            var url = "@Url.Action("AddEditVendor", "Vendor", new { VendorID = "value" })".replace("value", dataItem.VendorID);
            MvcCommon.Kendo.ShowPartialViewInPopupWindow({
                windowName: "dlgAddEditVendor",
                windowWidth: 660,
                windowHeight: 365,
                url:url
            });
        }
        else
        {
            window.setOptions({ title: "Add New Vendor" });
            var url = "@Url.Action("AddEditVendor", "Vendor", new { VendorID = "value" })".replace("value", "");
            MvcCommon.Kendo.ShowPartialViewInPopupWindow({
                windowName: "dlgAddEditVendor",
                windowWidth: 660,
                windowHeight: 365,
                url:url
            });
        }
    }

    function onDeleteVendor(event)
    {
        if (confirm('Are you sure you want to this Record?'))
        {
            var dataItem = JSON.stringify($("#gridVendor").data('kendoGrid').dataItem($(event.currentTarget).closest("tr")));
            if (dataItem && dataItem != null)
            {
                $.ajax({
                    cache: false,
                    type: 'POST',
                    dataType: 'JSON',
                    contentType: 'application/json; charset=utf-8',
                    data:  dataItem,
                    url: '@Url.Action("DeleteVendor", "Vendor")',
                    success: function (result) {
                        if (result && result.success == true) {
                            $('#gridVendor').data('kendoGrid').dataSource.read();
                        }
                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {},
                    complete: function (xhr, status) {}
                });
            }
        }
    }
</script>

Hi,

I have a project and the upgrade wizard for going to a newer version of Telerik takes forever to complete (>18 hours).

Is there a logfile to check why it takes so long?

Is it possible to upgrade a project by hand?

Maurice

Hi,

I currently have a grid with InCell editing and batch updates enabled using MVC calls.

On this grid I have 2 columns which have drop down lists as a client template which displays data depending on what values are on the row.

Due to this, I am using AJAX binding for the drop down lists and value mappers.

Everything is working fine with one smallish bug when editing the cells.

I currently have an issue where if you sometimes double click or quickly click on the drop down list cells, the selection shows up as "undefined".

The control loads if you click it, and you can select items, but as soon as you click out, the text returns to "undefined".

When you try to save the changes, the property is passed through as null.

Because I need to have dynamic data on the drop down lists, I can't return hard coded values using the ViewBags as shown on the demoes.

What I've tried doing is to see if I can create an artificial delay on the grid events (BeforeEdit, Edit, CellClosed) but this has been no use as the cell loses focus as soon as you click somewhere else.

Is there some error that's occurring in the Kendo Javascript files which can be tweaked or to add some sort of delay to allow the drop down to load?

Or is there any way to prevent the "undefined" error from binding a null object until you cancel?

If the controls can just correctly bind after you get the "undefined" error would be good as well.

Thanks