I have review this form discussions but cannot get this working.

How to add a delete button to editor template Grid Popup? in Kendo UI for jQuery | Telerik Forums

How can I add an additional update button inside of my grid popup editor template? I have the exact same requirements as discussed in 

Add extra button to Grid popup editor template in UI for ASP.NET MVC | Telerik Forums

@(Html.Kendo().Grid//....
  //....
 .Events(ev=>ev.Edit("onEdit"))  
 .Editable
  (
      editable => editable.Mode(GridEditMode.PopUp)
      .TemplateName("RecordEdit")
      .Window(e => e.Width(1400).Height(1200))
  )
)
 
function onEdit() {
    $('<a class="k-button k-button-icontext k-grid-delete" href="\\#"><span class="k-icon k-delete"></span>Delete</a>').insertAfter(".k-grid-cancel");
}

I am working with a Kendo grid on my MVC webapp.  The grid is bound by data passed to the View.  An event currently exists to load another grid when a row is selected/clicked on.  I have been tasked with adding a column that contains a checkbox based on a boolean value from the record in the dataset.  Until this point, everything is working.

My question is, how can I add an event to whenever the checkbox is checked and unchecked while keeping the event fro when a row is selected?  That is, if the user clicks on the row, I still want it to load the other grid based on the selected row, but if the user clicks on the checkbox in the row, I want it call a function to toggle the value and update the database (essentially call function changeFlag).  As a test, I put an alert() call in the function which runs when a row is selected, but the function never fires if I check/uncheck the checkbox.

I have some exposure to MVC, but Telerick/Kendo are completely new for me.  Any ideas, tips, or guidance would be greatly appreciated.

My company has three very large apps that are dependent on Kendo. I've been trying for several days to update the Kendo version in our largest app from version 2022.3.913. I was able to update with no problems to version 2023.1.117. But when I try to go beyond that, it's completely hosed. Worst of all is the use of icons. I can't make them work no matter what I do. We've been using .SpriteCssClass() to attach icons to buttons and menu items as well as using the k-icon k-i-xxx classes in grid item templates. None of that works anymore. None of the suggested fixes for this work with version 2023.2.829 either. I've tried telling the app to use font icons via KendMvc.Setup() in my Startup.cs and BaseController.cs files, neither of which worked. I installed both the FontIcons and SvgIcons NuGet packages, which at least allowed me to build the app. I was able to use the .Icon() method on a Button widget to use one if the SVG icons that I saw in an example, but nowhere on your site can I find a list of standard SVG icons like the list of font icons, so I wasn't able to find the icons I had been using. In addition to the complete inability to make icons work, the way you've changed font sizing for widgets has made the app look very different than before the update and has made various customizations we've made in our site.css file look very bad. Ditto for some random styling changes you've made for menu items and anchor tags in grid templates.

In short, you have really screwed us over and I don't know if we're going to be able to update past 2023.1.117. I see lots of others have had these same issues and I don't see you responding with any real solutions.

Hi,

I have a kendo grid, user wants to enter html data in one of the column.

user clicks edit button on the grid row then an edit form opens as popup. This edit form is a model.cshtml with all the fields of the model on it. This edit cshtml does not have any button on it. "Update" button is created on fly.

User enters html data (tags etc) and clicks Update button then it return 401 error. Which I think is because its taking the tags as an injection attack. If user enters normal text then it works fine.

what can do to make the edit form allow submit html tags data? can you please help me?

Thanks

CNS

i am getting the error when i use @html.kendo()

it showing are you missing any directives

>please suggest any solution

Hello,

My web application has a grid and in each line there is an edit button that opens a popup with a registration form as shown in the image.

1. I would like to configure the prev and next buttons to cycle through the database records

I saw an example exactly how I wanted it to be but I couldn't implement it

https://dojo.telerik.com/EBepu

Grid:

@(Html.Kendo().Grid<SgmWebEsocial.Models.FuncionarioViewModel>()
            .Name("Funcionarios")
            .Columns(columns =>
            {
                columns.Bound(p => p.PessoaFisica_FotoPessoa)..Width(70).Filterable(false).Sortable(false);
                columns.Bound(p => p.Pessoa_Nome).Width(200).Title("Nome");
                columns.Bound(p => p.MatriculaFuncionario).Width(80).Title("Matrícula");
                columns.ForeignKey(c => c.IdNivelCargo, (System.Collections.IEnumerable)ViewData["nomeCargo"], "IdNivelCargo", "NomeCargo").Title("Cargo").Width(120);
                columns.ForeignKey(c => c.TipoSituacaoFuncionario, (System.Collections.IEnumerable)ViewData["tipoSituacaoFuncionario"], "IdTipoSituacaoFuncionario", "NomeTipoSituacaoFuncionario").Title("Situação").Width(90);
                columns.ForeignKey(p => p.IndicativoTipoEnvioEsocial, (System.Collections.IEnumerable)ViewData["envioEsocial"], "IdTipoEnvioEsocial", "NomeTipoEnvioEsocial").Title("Esocial").Width(80);
                columns.Command(command => { command.Edit(); command.Destroy(); }).Width(150);
                columns.Bound(p => p.IdFuncionario).Title("Ação").ClientTemplate("<a onclick=\"showProgress()\" href='" + @Url.Action("ExportEsocial", "Funcionario", new { idFuncionario = "#=IdFuncionario#" }) + "' class='k-button'>&nbspEnviar eSocial</a>").Width(70);
            })
                //.Events(e => e.Edit("onEdit"))
                .ToolBar(toolbar => toolbar.Create())
                .Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("CadFuncionario").Window(w => w.Title("Cadastro de Funcionários").Width(1100)))
                .Pageable()
                .Sortable()
                .Filterable()
                .Scrollable(scr => scr.Height(450))
                .DataSource(dataSource => dataSource
                    .Ajax()
                    .PageSize(6)
                    .Events(events => events.Error("error_handler"))
                    .Model(model =>
                    {
                        model.Id(p => p.IdFuncionario);
                    })
                    .Create(update => update.Action("AdicionaFuncionario", "Funcionario").Data("sendAntiForgery"))
                    .Read(read => read.Action("ListaFuncionario", "Funcionario"))
                    .Update(update => update.Action("EditaFuncionario", "Funcionario").Data("sendAntiForgery"))
                    .Destroy(update => update.Action("RemoveFuncionario", "Funcionario").Data("sendAntiForgery"))
                            .Sort(sort =>
                            {
                                sort.Add(p => p.Pessoa_Nome);
                            })
                )

            )

Controller:

//Fill in the form
[KendoGrid]
        public virtual JsonResult ListaFuncionario([DataSourceRequest] DataSourceRequest request)
        {
            var context = new DbSgmContext();
            var pessoaFisica = context.PessoasFisicas;

            var result = funcionario.ToDataSourceResult(request, u => new FuncionarioViewModel
            {
                //Data Table Pessoa
                Pessoa_Nome = u.Pessoa.Nome,
                Pessoa_DDD = u.Pessoa.DDD_Telefone,
                Pessoa_DDD_Celular = u.Pessoa.DDD_Celular,
                Pessoa_Celular = u.Pessoa.Celular,
                Pessoa_Telefone = u.Pessoa.Telefone,
                Pessoa_Email = u.Pessoa.Email,
                Endereco_Numero = u.Pessoa.NumeroEndereco,
                Endereco_Complemento = u.Pessoa.Complemento,
  //Data Table PessoaFisica
                PessoaFisica_FotoPessoa = pessoaFisica.Single(pf => pf.IdPessoa == u.IdPessoa).FotoPessoa,
                PessoaFisica_CPF = pessoaFisica.Single(pf => pf.IdPessoa == u.IdPessoa).CPF,
                PessoaFisica_DataNascimento = pessoaFisica.Single(pf => pf.IdPessoa == u.IdPessoa).DataNascimento,
                PessoaFisica_NomeSocial = pessoaFisica.Single(pf => pf.IdPessoa == u.IdPessoa).NomeSocial,
                PessoaFisica_TipoSexo = pessoaFisica.Single(pf => pf.IdPessoa == u.IdPessoa).TipoSexo,
                PessoaFisica_NomePai = pessoaFisica.Single(pf => pf.IdPessoa == u.IdPessoa).NomePai,
                PessoaFisica_NomeMae = pessoaFisica.Single(pf => pf.IdPessoa == u.IdPessoa).NomeMae,
                PessoaFisica_EstadoCivil = pessoaFisica.Single(pf => pf.IdPessoa == u.IdPessoa).IdTipoEstadoCivil,
                PessoaFisica_RacaCor = pessoaFisica.Single(pf => pf.IdPessoa == u.IdPessoa).IdTipoRacaCor,
            });

            returnthis.Json(result);
 } 

I have a grid that contains a child detail spreadsheet.  I am trying to duplicate some code I used from another Kendo Spreadsheet, but each spreadsheet and Export button needs to have a unique id.  In the form I am using to export the Excel for the spreadsheet, I am using a Kendo Button to allow addition of the unique id (TplNum) from the parent grid.  For some reason, the template is not valid when I add the Kendo Button.  Any ideas?

I was going to use the Click event to determine the TplNum based on location of the button or the button id field in the Javascript callback, but thought that was giving me problems.  Currently, I gave the buttons a class, "export_excel" and I'm trying to create a jQuery onClick function in my document.load, which is invoked based on class, rather than id.

        }

   }

Hi there! In the code below when i reach $("#bans-grid").kendoGrid() function i get the type of error i've mentioned in the title. I don't understand why. Any help will be appreciated!

 $("#saveButton").kendoButton({
              click: function() {

                  var channelsData = $("#bans-grid").data().kendoGrid.dataSource.view();
                  var channelsDataJson = JSON.stringify(channelsData);

                      $("#bans-grid").kendoGrid({
                          dataSource: {
                                 transport: {
                                     update: {
                                         data: channelsDataJson,
                                         url: "/bg/NotosPrime/Bans/BanChannels",
                                         type: "PUT"
                                       }
                                     },
                                     schema: {
                                         model: {
                                             id: "Id"
                                         }
                                     }
                                }
                             });
                             $("#bans-grid").dataSource.sync();
                }
            });

I have API hosted on asp net core, through Swagger and Postman it works just fine, but when I try to access it through Jquery Grid of Kendo it only reads data but doesn't add nor delete.

Can you tell me what am I doing wrong here?

My  .NET Controllers:

 [HttpDelete]
        public async Task<ActionResult> Delete(Guid id)
        {
            await _mediator.Send(new DeleteProductCommand.Command { Id = id });
            return NoContent();
        }

 [HttpPost]
        [ProducesResponseType(StatusCodes.Status200OK)]
        public async Task<ActionResult<ProductResponse>> Create([FromBody] CreateProductCommand command) => await _mediator.Send(command);

My Jquery Grid

<script>
                $(document).ready(function () {
                    var crudServiceBaseUrl = "https://localhost:44393/api",
                        dataSource = new kendo.data.DataSource({
                            transport: {
                                read: {
                                    url: crudServiceBaseUrl + "/Product",
                                    dataType: "json"
                                },
                                create: {
                                    url: crudServiceBaseUrl + "/Product/Create",
                                    contentType: "application/json; charset=utf-8",
                                    dataType: "json",
                                    type: "POST"
                                },
                                destroy: {
                                    url: crudServiceBaseUrl + "/Product/Delete",
                                    type: "DELETE",
                                    contentType: 'application/json; charset=utf-8',
                                    dataType: 'json'
                                },
                                parameterMap: function (options, operation) {
                                    if (operation !== "read" && options) {
                                        return kendo.stringify(options);
                                    }
                                }

                            },

                            batch: true,
                            pageSize: 20,
                            schema: {
                                model: {
                                    id: "id",
                                    fields: {
                                        id: { editable: false, nullable: false },
                                        productName: { type: "string", editable: true },
                                        productSKU: { type: "string", editable: true },
                                        productType: { type: "string", editable: true },
                                    }
                                }
                            }
                        });



                    $("#grid").kendoGrid({
                        dataSource: dataSource,
                        columnMenu: {
                            filterable: false
                        },

                        height: 680,
                        editable: "inline",
                        pageable: true,
                        sortable: true,
                        navigatable: true,
                        resizable: true,
                        reorderable: true,
                        groupable: true,
                        filterable: true,
                        dataBound: onDataBound,
                        toolbar: ["excel", "pdf", "create", "search", "save", "delete"],
                        columns: [{
                            selectable: true,
                            width: 75,
                            attributes: {
                                "class": "checkbox-align",
                            },
                            headerAttributes: {
                                "class": "checkbox-align",
                            }
                        }, {
                            field: "productName",
                            title: "Product Name",
                            template: "productName",
                            width: 300
                        }, {
                            field: "productSKU",
                            title: "productSKU",
                            width: 105
                        }, {
                            field: "productType",
                            title: "productType",
                            width: 130,
                        }, {
                            field: "id",
                            title: "id",
                            width: 105
                        },
                            { command: "destroy", title: "Action", width: 120 }],
                    });
                });          


                function onDataBound(e) {


                } ;

</script>