This was a wonderful solution to add checkboxes to a grid w/o needing to double click to enter the editor.

https://www.telerik.com/forums/how-can-i-have-a-checkbox-column-in-a-grid-without-having-to-click-on-the-checkbox-twice-to-edit#1557957

Is there a way to add a filter to the checkbox columns as well?

Given the following form:

        <kendo-form orientation="vertical" layout="grid" name="formEntity" size="medium">
            <form-items>
                <form-item hidden-editor="true" field="Id"></form-item>
                <form-item hidden-editor="true" field="ParentId"></form-item>
                <form-item hidden-editor="true" field="ClientId"></form-item>
                <form-item field="EntityName" editor-handler="setRequiredTextboxEditor">
                    <item-label text="Name" optional="false"/>
                </form-item>
                <form-item field="EntityEmail" editor-handler="setRequiredTextboxEditor">
                    <item-label text="Email" optional="false"/>
                </form-item>
                <form-item field="EntityPhone" editor-handler="setRequiredTextboxEditor">
                    <item-label text="Phone" optional="false"/>
                </form-item>
            </form-items>
            <validatable validate-on-blur="true" error-template="<span class='k-form-error'>#:message#</span>" validation-summary="false"></validatable>
        </kendo-form>

I am trying to create a custom template to house the buttons displayed on the form. All I really wish to do is show/hide the Clear button under certain circumstances and I figured doing so in a template might be my best option.

However, I cannot get a custom template to appear for the form and there are no examples of how to do this in the documentation that I could find.

I assumed it would be something like this:

            <buttons-template>
                <kendo-template>
                    <div class="k-form-buttons">
                        <button id="btnSave" class="k-form-submit k-button k-button-md k-rounded-md k-button-solid k-button-solid-primary k-focus" data-role="button" type="submit" role="button" aria-disabled="false" tabindex="0"><span class="k-button-text">Submit</span></button>
                        <button id="btnClear" class="k-form-clear k-button k-button-md k-rounded-md k-button-solid k-button-solid-base" data-role="button" type="button" role="button" aria-disabled="false" tabindex="0"><span class="k-button-text">Clear</span></button>
                    </div>
                </kendo-template>
            </buttons-template>

But this just hides the buttons entirely. I know I am missing something, I just don't know what it is.

Thanks.

Hello, I hope you are well.

I hope you can help me with this problem I have.

I am using the Kendo UI for JQuery Upload.

What I require is to upload an entire folder of TXT files, but I have a routine that validates that the name and content meet certain rules.

I apply these rules within the foreach loop (var file in files), because what is required is that if the file is valid it shows a text that it is valid, otherwise it shows a text that is not valid and for both options to continue processing the next file.

But by marking that file as erroneous, the controller is exited and the view is returned, thus leaving the processing of the rest of the files incomplete.

I share the code of the view and the controller, hoping you can give me some light.

View Code:

<div class="centered">
    @using Kendo.Mvc.UI
    <div>
        <div class="demo-section">
            @(Html.Kendo().Upload()
                .Name("files")
                .Async(a => a
                    .Save("ChunkSave", "Upload")
                    .Remove("Chunk_Upload_Remove", "Upload")
                    .AutoUpload(true)
                    .ChunkSize(11000)

                )
                .Multiple(true) // Enable multiple file selection
                    .Directory(true)
                    .DirectoryDrop(true)
                .Validation(validation =>
                {
                    //validation.MaxFileSize(20000000);
                })
                .Events(events =>
                {
                    events.Upload("onUpload");
                    events.Success("onUploadSuccess");
                    events.Error("onUploadError");
                    events.Select("onSelect");
                })
                .Messages(messages =>
                {
                    messages
                        .Select("Seleccionar archivos")
                        .DropFilesHere("Suelta archivos aquí para cargarlos")
                        .Remove("Eliminar")
                        .Retry("Reintentar")
                        .StatusFailed("Error")
                        .StatusUploaded("Terminado")
                        .StatusUploading("Cargando")
                        .UploadSelectedFiles("Cargar archivos")
                        .UploadFail("Error al procesar el archivo.")
                        .HeaderStatusUploaded("Terminado");
                })

            )
        </div>
    </div>
</div>

Controller Code:

public async Task<ActionResult> ChunkSave(IEnumerable<IFormFile> files, string metaData, string cve)
{

    int status = 0;
    DataContractJsonSerializer serializer = new DataContractJsonSerializer(typeof(ChunkMetaData));


    MemoryStream ms = new MemoryStream(Encoding.UTF8.GetBytes(metaData));
    ChunkMetaData? somemetaData = serializer.ReadObject(ms) as ChunkMetaData;
    string path = String.Empty;

    if (files != null)
    {
        foreach (var file in files)
        {
            cap_dbt controller = new cap_dbt(_context);
            controller.ProcessFile(file, somemetaData.FileName, cve);
            status = controller.ProcessFile(file, somemetaData.FileName, cve);
            if (status == 1)
            {
                Upload(files, somemetaData.FileName);
            }
        }
    }


    if (somemetaData is null)
    {
        throw new Exception("No Metadata!");
    }

    Util.FileResult fileBlob = new Util.FileResult();
    fileBlob.uploaded = somemetaData.TotalChunks - 1 <= somemetaData.ChunkIndex;
    fileBlob.fileUid = somemetaData.UploadUid;
    fileBlob.warnings = Mensajes.msgLoadCsvWarning;
    fileBlob.message = "[" + somemetaData.FileName + "]\t";

    try
    {
        if (!fileBlob.uploaded)
        {
            fileBlob.message += "[ERROR]" + Mensajes.msgLoadCsvError;

            return StatusCode(500, fileBlob);
        }
        else if (status == -1)
        {
            fileBlob.uploaded = false;
            fileBlob.message += "[ERROR] " + Mensajes.msgLoadCsvError;
            throw new Exception(fileBlob.message); // <------- If I remove this line, it continues processing, but it no longer changes the file, it stays with the same name or empty.

        }

        if (fileBlob.warnings.Equals(""))
        {
            fileBlob.message += Mensajes.msgLoadCsvOk;
        }
    }

    catch (Exception ex)
    {
        Console.WriteLine(ex.ToString());
        return StatusCode(500, fileBlob);
    }
    finally
    {
        Mensajes.resetMsg();
    }

    return Json(fileBlob);
}

I've implemented a column editor for a ComboBox in a Grid.  The dropdown functionality is working but the filtering functionality is not.  So if I type in the first 3 characters of a value in the data, it's displaying all entries instead of filtering the entries. The filterLocations function never gets called so I'm assuming I don't have the snytax correct but I can't find an example of this anywhere.  Plenty of examples of a column editor for a DropDown but none with a ComboBox.  Appreciate any help in correcting my syntax or pointing me towards a working demo.

        <column field="LocationId" title="Location" template="#=locationTemplate(data)#" editor="locationEditor">
            <filterable extra="false" enabled="false">
                <cell show-operators="false"></cell>
            </filterable>
        </column>

JavaScript

function locationEditor(container, options) {
    $('<input required validationMessage="Please select a location." name="' + options.field + '"/>')
        .appendTo(container)
        .kendoComboBox({
            autoBind: true,
            dataTextField: "Text",
            dataValueField: "Value",
            placeholder: "- Select or Enter -",
            filter: "contains",
            minLength: 3,
            dataSource: {
                serverFiltering: true,
                transport: {
                    read: "/ComboBox/LocationsRead",
                    data: "filterLocations"
                }
            }
        });
}

function filterLocations() {
    return {
        locationFilter: $("#Input_LocationId").data("kendoComboBox").input.val()
    };
}

I'm encountering a difficult to troubleshoot issue with a Kendo Grid apparently crashing when I attempt to export its contents to an excel file.  I've successfully set up Kendo Grids to export to excel before, and my code here is very closely based on other solutions I've had in similar projects.  Below is the widget code:

@(
    Html.Kendo().Grid(Model.Groups)
    .Name("Grid")
    .Columns(columns =>
    {
        columns.Bound(c => c.SamAccountName).Title("SamAccount").Width(250).HeaderHtmlAttributes(new { style = "font-weight: bold" });
        columns.Bound(c => c.DistinguishedName).Title("Full Name").Width(400).HeaderHtmlAttributes(new { style = "font-weight: bold" });
        columns.Bound(c => c.IsSecurityGroup)
            .Width(75)
            .Title("Security Group?")
            .ClientTemplate("#= IsSecurityGroup ? 'Yes' : 'No' #")
            .HeaderHtmlAttributes(new { style = "font-weight: bold" });
    })
    .Sortable()
    .Selectable(selectable => selectable
        .Mode(GridSelectionMode.Multiple)
        .Type(GridSelectionType.Cell))
    .Navigatable()
    .AllowCopy(true)
    .ToolBar(tools =>
    {
        tools.Custom().Text("Copy to Clipboard").HtmlAttributes(new { id = "copyButton" });
        tools.Excel();
        tools.Search();
    }).Excel(excel =>
    {
        excel.FileName(Model.SearchString + "GroupsExport_" + DateTime.Now.Date.ToShortDateString() + ".xlsx");
        excel.AllPages(true);
        excel.ForceProxy(true);
        excel.ProxyURL(Url.Action("ExcelExportSave", "Home"));
    })
)

And below is the corresponding action in my HomeController:

        [HttpPost]
        public ActionResult ExcelExportSave(string contentType, string base64, string fileName)
        {
            var fileContents = Convert.FromBase64String(base64);
            return File(fileContents, contentType, fileName);
        }


Behavior

The Grid will correctly load, and allow the user to search, sort, scroll, etc. However upon clicking the Export to Excel button the widget will enter a loading animation and then spin forever.  The rightmost IsSecurityGroup column will also appear to be duplicated, but I think this is a visual glitch as I'm not actually seeing an additional column be created in the page elements, this visual glitch goes away if I add "Scrollable".

My breakpoint in the ExcelExportSave() controller action is not being hit, and if I check the network tab it does not appear that a network request is even being made. 

There are no errors or warnings printed to the browser console.  

Troubleshooting steps I've tried:

• Changing the controller for the ExcelExportSave action and also making the action [Anonymous]
• Simplifying the Grid by removing the client-templates, dynamic filename, and custom button.
• Removed other JS functions from the page (there aren't many, this is a pretty simple page and shouldn't have much conflicting logic)
• Verified that the ViewModel values are not null and as expected on pageload
• I have generally tried adjusting some of the Excel configuration options, but none of these seem to alter the behavior.

Kendo otherwise appears to be correctly imported into the project and I am not experiencing other issues.

My Environment and Project

This is an ASP.NET Core 8 MVC project being run in Visual Studio 2022 on a Windows laptop.  The project does use Microsoft Identity authentication and I am developing by running it on Localhost.  

Any help that anyone can provide would be greatly appreciated.  

Please delete. Not a bug. 

Here's my grid:

@(Html.Kendo().Grid<SalaryIncrease>()
    .Name("SalaryIncreaseGrid")
    .Columns(columns =>
    {
        columns.Command(command =>
                        {
                            command.Custom("Edit").Click("meVM.editSalaryIncrease");
                            command.Custom("Delete").Click("meVM.deleteSalaryIncrease");
                        }).Width(100);
        columns.Bound(p => p.FiscalYear).Title("Fiscal Year").Width(250);
        columns.Bound(p => p.SalaryIncreaseCategory.Name).Title("Salary Increase Category").Width(400);
        columns.Bound(p => p.CurrencyId).Title("Currency").Width(250);
        columns.Bound(p => p.IncreaseAmount).Title("Increase Amount").Width(500).Format("{0:###,##0.00}");
        columns.Bound(p => p.EffectiveDate).Title("Effective Date").Width(500).Format("{0:yyyy-MM-dd}");
    })
    .Pageable(pageable => pageable
    .Refresh(false)
    .PageSizes(new[] { 5, 10, 25, 50, 100 })
    .ButtonCount(6)
    )
    .Sortable()
    .Selectable(selectable => selectable.Mode(GridSelectionMode.Single))
    .Resizable(resize => resize.Columns(true))
    .Scrollable()
    .ColumnMenu(menu => { menu.ComponentType("modern"); })
    .Events(e => e.DataBound("meVM.onSalaryIncreaseGridDataBound"))
    .DataSource(dataSource => dataSource
    .Ajax()
    .Batch(true)
    .PageSize(10)
    .Model(model => model.Id(p => p.Id))
    .ServerOperation(false)
    .Read(read => read.Url("/Employee/ManageEmployee?handler=SalaryIncrease_Read").Type(HttpVerbs.Get))))

Hello,

i want to bind data to an autocomplete async.
The index.cshtml looks like this:

@(Html.Kendo().AutoCompleteFor(m => m.customerName)
        .DataTextField("customerName")
        .BindTo((System.Collections.IEnumerable)ViewData["customers"])
    )

The controller like this:

 public async Task<IActionResult> Index()
 {
     InitializeApiClient();

     ViewData["customers"] =  await GetCustomers();

     return View();
 }

 private async Task<IEnumerable<CustomerShort>> GetCustomers()
 {
     Customers = new List<CustomerShort>();

     List<Models.Customer> customer = await JupiterClient.Api.V1.Customer.GetAsync(x => x.QueryParameters = null);
     foreach (var item in customer)
     {
         Customers.Add(new CustomerShort()
         {
             customerId = item.Id.ToString(),
             customerName = item.Name + @" (" + item.Id.ToString() + @")"
         });

         if (Customers.Count > 999)
         {
             break;
         }


     }

     return Customers.AsEnumerable();
 }

When i start the web-app i get no error. But the client-data is empty:
What have i made wrong?

Kind regards
Jens