Hi,

I have implemented the filter multi check as described here:

http://demos.telerik.com/aspnet-mvc/grid/filter-multi-checkboxes

and I have persisted the grid using the methods described here:

http://demos.telerik.com/aspnet-mvc/grid/persist-state

For the checkboxes, I have a method server side which returns the filter checkboxes as Json.

Code Snippet:

@(Html.Kendo().Grid<DefectNotificationReportItemDto>()
                      .Name("grid")
                      .Columns(columns =>
                      {
                          columns.Bound(p => p.MaterialCode).Width(140).Filterable(f => f.Multi(true).ItemTemplate("itemTemplate").Search(true).DataSource(source => source.Read(r => r.Action("GetMaterialCodes", "DefectNotificationReport", new {  selectedSnapshotDate = Model.ToString("dd MMM yyyy") }))));
                          columns.Bound(p => p.MaterialDescription).Width(300).Filterable(f => f.Multi(true).ItemTemplate("itemTemplate").Search(true).DataSource(source => source.Read(r => r.Action("GetMaterialDescriptions", "DefectNotificationReport", new {  selectedSnapshotDate = Model.ToString("dd MMM yyyy") }))));
                          columns.Bound(p => p.BatchNumber).Width(140).Filterable(f => f.Multi(true).ItemTemplate("itemTemplate").Search(true).DataSource(source => source.Read(r => r.Action("GetBatchNumbers", "DefectNotificationReport", new {  selectedSnapshotDate = Model.ToString("dd MMM yyyy") }))));

}

function itemTemplate(e) {
    if (e.field === "all") {
        //handle the check-all checkbox template
        return "<div><label><strong><input type='checkbox' />#= all#</strong></label></div>";
    } else {
        //handle the other checkboxes
        return "<div class='kendo-custom-filter'><span><label><input type='checkbox' name='" + e.field + "' value='#=Value#'/><span>#= Text #</span></label></span></div>";
    }
}

Everything works fine, until the state of the grid is reloaded. If I then click on a filter I get a JavaScript error:

VM12456:3 Uncaught ReferenceError: BatchNumber is not defined

    at eval (eval at compile (kendo.all.js:194), <anonymous>:3:209)
    at Object.render (kendo.all.js:175)
    at Object.proxy [as render] (jquery-3.1.1.js:502)
    at init.createCheckBoxes (kendo.all.js:37796)
    at init.refresh (kendo.all.js:37762)
    at init.options.forceUnique.checkChangeHandler (kendo.all.js:37614)
    at init.trigger (kendo.all.js:124)
    at init._process (kendo.all.js:6965)
    at init.success (kendo.all.js:6710)
    at success (kendo.all.js:6637)

I find all of your features are great in isolation but when combined this sort of things happens. Please can you tell me why this happens and how I can fix the issue?

Thanks

Hi there,

First let me state what we're trying to achieve.

We need to inject some values into a pre-defined spreadsheet with data already on it (basically a copy from a previous version).  I thought I could name specific cells using the "defineName" method on the spreadsheet to create named ranges (each one cell in size) and then later find those ranges to set the values.

However, I might be incorrect in what the named ranges are for, but I cannot find a way to find a named range and then set it's value.  Is there a way to do this, or some other way to give cells that can be anywhere some kind of "metadata" that I can use later to inject data?

Say for example we have data relating to countries, I'd want to generate the spreadsheet, give each country's cell a number and give the cell a range name of the country. I wouldn't necessarily know the exact cell number, because users could insert new rows/columns etc, but the range name would stay. Then later I'd be able to find the ranges by country name somehow and put different numbers in there.

Thanks.

Hey guys,

We have a big problem compiling Kendo templates which contain other Kendo widgets, e.g. a Grid.
We have the following template (simplified):

The original template contains other dynamic data-bound values, e.g. "#=Id#"... thus we need a template approach! Now we want to compile this template, because we need to show it as content of a window:

This should work fine, but Kendo gives us invalid JavaScript when compiling:

Any ideas/solutions for this? I think we're not the first discovering this problem... is there any straight forward solution?

Thanks, Dimitrij

Hi,

I have a licensed version of Kendo. That is showing error for first time user. If someone clicks error and add it to the trusted site it resolved but user is not expert to do that. How can I solve it?

Thanks,

T

I currently have a editor set up with an image browser. Looking at this demo, it appears that a user should be able to select an image that has been inserted into the editor, and resize it by grabbing the corners.

In my editor, however, inserted images are not showing up as selectable or resizeable. I can't seem to find any settings that can enable this functionality. Am I missing something? What can I do to enable image resizing? 

I have the following Kendo UI Grid.  I am using .Net Core 2.1 and Kendo 2019.1.220.  I have this grid on the page in a partial view.  I also have a checkbox on the parent page.  How can I get the column header below with the title "Design Integration" to lock when the checkbox is checked and unlocked when the checkbox is unchecked using the change event on the checkbox? 

 @(Html.Kendo().Grid<DIStatus.Models.DistatusForGrid>()
        .Name(componentName: "DIStatusGrid")
        .DataSource(dataSource => dataSource
        .Ajax()
        .Model(model => model.Id(p => p.Id))
        .Read(read => read.Action(actionName: "DIStatusGrid_Read", controllerName: "Home"))
        .Update(update => update.Action("DIStatusGrid_Update", "Home"))
        .PageSize(pageSize: 50)
        )
        .Columns(columns =>
        {
            columns.Command(command =>
            {
                command.Custom("Edit").Text("Edit Page").Click(handler: "btnEdit");
                command.Custom("Delete").Text("Delete").Click(handler: "btnDelete");
                command.Edit().Text("Inline Edit").HtmlAttributes(new { id="btnInlineEdit"});
            }).Width(85).Locked(true).Lockable(true).HtmlAttributes(new { @style = "text-align:center;background-color:mistyrose;" }).HeaderHtmlAttributes(new { style= "background-color:mistyrose;" });
            columns.Bound(p => p.Id).Title(text: "Id").Width(pixelWidth: 70).Filterable(value: false).Visible(false);
            columns.Group(group => group
            .Title("Design Integration").HtmlAttributes(new { id="headerDI", name= "headerDI" }).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign", style = "font-weight:900;" }).Locked(true).Lockable(true)
                .Columns(di =>
                {
                    di.Bound(p => p.ShipId).Title(text: "Ship Id").Width(pixelWidth: 60).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
                    di.Bound(p => p.UnitId).Title(text: "Unit Id").Width(pixelWidth: 60).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
                    di.Bound(p => p.AuthorityTypeId).Title(text: "Authority Type").Width(pixelWidth: 100).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
                    di.Bound(p => p.Milestone).Title(text: "Milestone").Width(pixelWidth: 80).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
                    di.Bound(p => p.TrackingNumber).Title(text: "Tracking # (IFC, A/I, etc.)").Width(pixelWidth: 150).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
                    di.Bound(p => p.ReferenceNumber).Title(text: "Related / Ref # / Drawing #").Width(pixelWidth: 125).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
                    di.Bound(p => p.Description).Title(text: "Description").Width(pixelWidth: 300).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
                    di.Group(g => g.Title("Model Impacter").HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign", style = "font-weight:900;" })
            .Columns(mi =>
            {
                mi.Bound(p => p.RespDrawings).Title(text: "Resp Drawings").Width(pixelWidth: 100).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
                mi.Bound(p => p.AffectedDrawings).Title(text: "Affected Drawings").Width(pixelWidth: 100).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
            })
            );
                    di.Bound(p => p.Compartment).Title(text: "Compartment").Width(pixelWidth: 100).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
                    di.Bound(p => p.Originator).Title(text: "Originator or D.I. Checker").Width(pixelWidth: 100).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
                    di.Bound(p => p.DateEntered).Title(text: "Date Entered").Width(pixelWidth: 85).Editable("IsDIEditable").Format(value: "{0:MM/dd/yyyy}").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
                    di.Bound(p => p.DisciplineId).Title(text: "Discipline").Width(pixelWidth: 100).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
                    di.Bound(p => p.AssignedTo).Title(text: "Assigned to Person").Width(pixelWidth: 100).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
                    di.Bound(p => p.NeedDate).Title(text: "Need Date").Width(pixelWidth: 100).Editable("IsDIEditable").Format(value: "{0:MM/dd/yyyy}").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
                    di.Bound(p => p.ViolationId).Title(text: "YES=1 Clr Violation, Other or Hard Hit").Width(pixelWidth: 100).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
                    di.Bound(p => p.PresidentsGoal).Title(text: "Pres Goal").Width(pixelWidth: 70).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
                })
                );
            columns.Group(g2 => g2
            .Title("Transfer Info").HeaderHtmlAttributes(new { @class = "DIStatusGridOrangeHeader CenterAlign", style = "font-weight:900;" }).Locked(false).Lockable(true)
            .Columns(ti =>
            {
                ti.Group(g => g.Title("Email Required").HeaderHtmlAttributes(new { @class = "DIStatusGridOrangeHeader CenterAlign FontColRed", style = "font-weight:900;" })
            .Columns(er =>
            {
                er.Bound(p => p.TransferDisciplineId).Title(text: "Disc IFC Is being transfered to").Width(pixelWidth: 100).Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridOrangeHeader CenterAlign" });
                er.Bound(p => p.TransferDesigner).Title(text: "Designer Name").Width(pixelWidth: 85).Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridOrangeHeader CenterAlign" });
                er.Bound(p => p.TransferDate).Title(text: "Designer Date Accepted").Width(pixelWidth: 85).Format(value: "{0:MM/dd/yyyy}").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridOrangeHeader CenterAlign" });
            })
            );
            })
            );
            columns.Group(g3 => g3
            .Title("Discipline Currently Assigned To").HeaderHtmlAttributes(new { @class = "DIStatusGridYellowHeader CenterAlign", style = "font-weight:900;" }).Locked(false).Lockable(true)
            .Columns(dcat =>
            {
                dcat.Bound(p => p.ClearedBy).Title(text: "Cleared by / Assigned to (Name)").Width(pixelWidth: 100).Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridYellowHeader CenterAlign" });
                dcat.Bound(p => p.ActionTaken).Title(text: "Action Taken / Clearance Comments").Width(pixelWidth: 400).Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridYellowHeader CenterAlign" });
                dcat.Bound(p => p.Status).Title(text: "Status").Width(pixelWidth: 85).Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridYellowHeader CenterAlign" });
                dcat.Bound(p => p.PentRelatedItem).Title(text: "Pent Related Item").Width(pixelWidth: 85).Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridYellowHeader CenterAlign" });
                dcat.Group(g2 => g2.Title("Manager Approval").HeaderHtmlAttributes(new { @class = "DIStatusGridYellowHeader CenterAlign", style = "font-weight:900;" })
            .Columns(ma =>
            {
                ma.Bound(p => p.SatAsIs).Title(text: "Sat As Is").Width(pixelWidth: 80).Editable("IsManagerEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridRoseHeader CenterAlign" });
                ma.Bound(p => p.ManagerApproval).Title(text: "Sat as is (Email reqd)").Editable("IsManagerEditable").Width(pixelWidth: 85).Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridRoseHeader CenterAlign" });
                ma.Bound(p => p.ManagerApprovalDate).Title(text: "Manager Approval Date").Editable("IsManagerEditable").Width(pixelWidth: 85).Format(value: "{0:MM/dd/yyyy}").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridRoseHeader CenterAlign" });
                ma.Bound(p => p.ManagerApprovalExplanation).Title(text: "Manager Approval Explanation").Editable("IsManagerEditable").Width(pixelWidth: 250).Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridRoseHeader CenterAlign" });
            })
            );
                dcat.Bound(p => p.ClearanceCompleteDate).Title(text: "Clearance Complete Date").Width(pixelWidth: 85).Format(value: "{0:MM/dd/yyyy}").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridYellowHeader CenterAlign" });
                dcat.Bound(p => p.Reserved).Title(text: "Reserved").Width(pixelWidth: 85).Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridYellowHeader CenterAlign" });
            })
            );
            columns.Group(g4 => g4
            .Title("Des Int").HeaderHtmlAttributes(new { @class = "DIStatusGridSeaGreenHeader CenterAlign", style = "font-weight:900;" }).Locked(false).Lockable(true)
            .Columns(compt =>
            {
                compt.Group(g2 => g2.Title("Compt").HeaderHtmlAttributes(new { @class = "DIStatusGridSeaGreenHeader CenterAlign", style = "font-weight:900;" })
            .Columns(cpt =>
            {
                cpt.Bound(p => p.IfcbackChecker).Title(text: "IFC Back Check Compl (Name)").Width(pixelWidth: 100).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridSeaGreenHeader CenterAlign" });
                cpt.Bound(p => p.IfcbackCheckerDate).Title(text: "IFC Back Check Compl (Date)").Width(pixelWidth: 100).Editable("IsDIEditable").Format(value: "{0:MM/dd/yyyy}").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridSeaGreenHeader CenterAlign" });
                cpt.Bound(p => p.DesignChangeToFix).Title(text: "Did Design Change to Fix IFC").Width(pixelWidth: 100).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridSeaGreenHeader CenterAlign" });
            })
            );
                compt.Group(g2a => g2a.Title("Reject").HeaderHtmlAttributes(new { @class = "DIStatusGridSeaGreenHeader CenterAlign FontColRed", style = "font-weight:900;" })
            .Columns(rej1 =>
            {
                rej1.Bound(p => p.RejectedBy).Title(text: "IFC Back Check Rejected (Name)").Width(pixelWidth: 125).Editable("IsDIEditable").Filterable(value: true).Visible(true).HtmlAttributes(new { @class = "FontColRed", Style = "text-align:left;" }).HeaderHtmlAttributes(new { @class = "DIStatusGridSeaGreenHeader CenterAlign RedHeaderFont" });
            })
            );
                compt.Group(g2b => g2b.Title("Reject").HeaderHtmlAttributes(new { @class = "DIStatusGridSeaGreenHeader CenterAlign FontColRed", style = "font-weight:900;" })
            .Columns(rej1 =>
            {
                rej1.Bound(p => p.RejectedDate).Title(text: "IFC Back Check Rejected (Date)").Width(pixelWidth: 85).Editable("IsDIEditable").Format(value: "{0:MM/dd/yyyy}").Filterable(value: true).Visible(true).HtmlAttributes(new { @class = "FontColRed", Style = "text-align:left;" }).HeaderHtmlAttributes(new { @class = "DIStatusGridSeaGreenHeader CenterAlign RedHeaderFont" });
            })
            );
            })
            );
            columns.Group(g5 => g5
            .Title("Disc").HeaderHtmlAttributes(new { @class = "DIStatusGridYellowHeader CenterAlign", style = "font-weight:900;" }).Locked(false).Lockable(true)
            .Columns(disc =>
            {
                disc.Bound(p => p.DiscBackFixName).Title(text: "Disc Back Fix Compl (Name)").Width(pixelWidth: 85).Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridYellowHeader CenterAlign" });
                disc.Bound(p => p.DiscBackFixDate).Title(text: "Disc Back Fix Compl (Date)").Width(pixelWidth: 85).Format(value: "{0:MM/dd/yyyy}").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridYellowHeader CenterAlign" });
            })
            );
            columns.Bound(p => p.Remarks).Title(text: "Remarks / RFS #").Width(pixelWidth: 200).Filterable(value: true).Locked(false).Lockable(true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridCyanHeader CenterAlign" });
            columns.Group(g6 => g6
            .Title("Des Int").HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign", style = "font-weight:900;" }).Locked(false).Lockable(true)
            .Columns(loc =>
            {
                loc.Bound(p => p.Location).Title(text: "Location").Width(pixelWidth: 75).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
                loc.Bound(p => p.OptSeq).Title(text: "Opt Seq").Width(pixelWidth: 75).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
            })
                                                        );
        })
        .Events(e => e.DataBound("dataBound"))
        .HtmlAttributes(new { style = "height:800px;border:solid;border-width:thin;overflow:auto;width:100%;" })
        .Pageable(pageable => pageable
        .Input(enabled: true)
        .Numeric(enabled: false)
        .Refresh(enabled: true)
        )
        .Sortable()
        .Resizable(resize => resize.Columns(true))
        .Reorderable(reorder => reorder.Columns(false))
        .Scrollable(scr => scr.Height(pixelHeight: 400))
        .Selectable()
        .Filterable()
        .ColumnMenu()
        .Editable(editable => editable.Mode(GridEditMode.InLine))
    )

Using Kendo.mvc 2019 R2 in a mvc5 app

On a listbox, I can scroll by clicking in the scroll background, or with the arrows at either end of the scrollbar, but if I try to click drag the scroll thumb, it doesn't scroll.

Am I missing something?