Telerik Forums
UI for ASP.NET MVC Forum
1 answer
10 views

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

Perhaps little different as I am using a custom popup editor template called RecordEdit.cshtml as outlined in  ASP.NET MVC Data Grid Component Use Custom Popup Editors - Telerik UI for ASP.NET MVC
@(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");
}
Any assistance would be most helpful.
Ivan Danchev
Telerik team
 answered on 26 Apr 2024
1 answer
97 views

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

Anton Mironov
Telerik team
 answered on 12 Jul 2023
1 answer
209 views

Hello,

I am struggling with why my Save button on my Kendo Grid is not calling my update action (inline edit mode).  The edit column uses a dropdown list editor template.  The dropdown list editor fills fine with my values and I can select one.  But when I click the Save button (from toolbar) it does not call my add function in the controller.  I see no errors in F12 utility.  Any help is appreciated as I've been struggling with this all day.

Here is my relevant code:

Edit Grid:

<style>
    .k-grid-content td {
        position: relative;
    }

    .k-grid .k-grid-header .k-header .k-link {
        height: auto;
    }

    .k-grid .k-grid-header .k-header .k-column-title .k-header {
        white-space: normal;
    }
</style>
@{
    ViewData["Title"] = "Administration";
}

<div style="margin-left:10px; margin-top:10px">
<div>Manage Assignees</div>
<div class="row" style="margin-top:10px">
    <div class="col-auto">
            @(
                    Html.Kendo().Grid<Assignees>()
                    .Name("grid")
                    .Width("250px")
                    .Columns(columns =>
                    {
                        columns.Bound(p => p.SortName).Width(130).Title("Assignee").EditorTemplateName("AssigneesAdd");
                    })
                    .Sortable(true)
                    .Navigatable()
                    .Scrollable(scr => scr.Height(200))
                    .Editable(editable => editable.Mode(GridEditMode.InLine))
                    .Selectable()
                    .AutoBind(true)
                    .ColumnMenu(false)
                    .ToolBar(tb =>
                    {
                        tb.Create().Text("New");
                        tb.Save().Text("Save").CancelText("Cancel");
                    })
                    .DataSource(dataSource => dataSource
                    .Ajax()
                    .Read(read => read.Action("GetAssigneesForAddGridDisplay", "Home").Type(HttpVerbs.Post))
                    .Update(update => update.Action("AddAssigneeRecord", "Home").Type(HttpVerbs.Post))
                    .Destroy(destroy => destroy.Action("DeleteAssigneeRecord", "Home").Type(HttpVerbs.Post))
                    .Events(e => e.Error("onError"))
                    .Batch(false)
                    .Model(model =>
                    {
                        model.Id(p => p.SortName);
                        model.Field(p => p.SortName);
            })
            )
            .Deferred()
            )
    </div>
</div>
</div>
@section Scripts{
    @Html.Kendo().DeferredScripts()

    <script>
        $(document).ready(function () {
        });

        function onError() {
        @*window.location='@Url.Action("Index", "Error")';*@
                }

    </script>

}

===============================================

Controller Add Function called by .Update event in grid

  [HttpPost]
        public async Task<ActionResult> AddAssigneeRecordAsync([DataSourceRequest] DataSourceRequest request, SelectListItem assigneeRecord)
        {

            try
            {
                await _dataService.AddAssigneeRecordAsync(assigneeRecord);

                return Json(await new[] { assigneeRecord }.ToDataSourceResultAsync(request, ModelState));
            }
            catch (Exception ex)
            {
                await _dataService.LogExceptionAsync("HomeController", "AddAssigneeRecordAsync", _username, ex);
                return BadRequest();
            }
        }

===============================================

DropDownList editor template("AssigneesAdd"):

@using Estimating_State_Licensing_Certification.Controllers
@using Kendo.Mvc.UI
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@addTagHelper *, Kendo.Mvc
@model string;

@(Html.Kendo().DropDownListFor(m => m)
        .DataValueField("Text")
        .DataTextField("Text")
        .Filter("startswith")
        .OptionLabel("Select an Employee")
        .DataSource(source =>
        {
            source.Read(read =>
            {
                //this is the edit template used for the Admin assignee grid for adding NEW assignees
                read.Action("GetAssigneesForAdminAdd", "Home").Type(HttpVerbs.Post);
            });
        })
)

==============================================

"Assignees" class/entity used by the grid

   public class Assignees
    {
        public string? SortName { get; set; } = string.Empty;
    }

 

Thanks!

Acadia

Aleksandar
Telerik team
 answered on 25 Apr 2023
5 answers
352 views

Hello everyone,

I have a little problem with editing my grid and I hope you can help me.

I am currently developing a grid (Telerik UI for ASP.NET MVC Grid) in which you can open another grid using a button at the end of the row. In this second grid it is possible to select one or more employees (Inline Editing with a DropDown) for the previous entry. In addition to the actual employee, there is another column where you can set a checkbox to "true" or "false". You can create a new entry with the button on the top left and you can edit or delete it with the two buttons on the right in the line.

Now to my question: My plan is that the name of the employee can only be changed when creating the entry. If you click on Edit, the name should no longer be editable, only the checkbox should be.

How exactly do I do this?

I had the idea to set the field "UserId" to .Editable(false) under .Model. But if I do that, I can neither change the value when creating nor when editing. When creating the entry, the drop-down menu for selecting an employee should be available, but not when editing.

In the attachments I have pictures showing the grid exactly.

Thanks in advance
Lars

 

@(Html.Kendo().Grid(Model)
    .Name("AssignmentsGrid")
    .Columns(c =>
    {
        c.ForeignKey(m => m.UserId, (IEnumerable) ViewData["users"], "Id", "Name").EditorTemplateName("ProjectUserDropdown");
        c.Bound(m => m.Resigned).ClientTemplate("<input type='checkbox' #= Resigned ? checked='checked' :'' # disabled='disabled' />");
        c.Command(command =>
        {
            command.Edit();
            command.Destroy();
        });
    })
    .ToolBar(t => t.Create())
    .Events(events =>
    {
        events.Edit(@<text>function(e) { if(e.model.isNew()) { e.model.set('ProductionOrderId', @ViewData["productionOrderId"]); } else { $('[name="ProjectManagerId"]').attr("readonly", true); }} </text>);
    })
    .DataSource(s => s
        .Ajax()
        .Create(c => c.Action("UserAssignmentAdd", "ProductionOrder", new {area = "Sktcrm"}))
        .Read(r => r.Action("UserAssignmentRead", "ProductionOrder", new {area = "Sktcrm"}).Data(@<text>function(e) { return { productionOrderId: @ViewData["productionOrderId"] }; }</text>))
        .Update(u => u.Action("UserAssignmentUpdate", "ProductionOrder", new {area = "Sktcrm"}))
        .Destroy(d => d.Action("UserAssignmentDelete", "ProductionOrder", new {area = "Sktcrm"}))
        .Model(m =>
        {
            m.Id(model => model.UserId);
            //m.Field(t => t.UserId).Editable(false);
        })
        .ServerOperation(false))
    .Scrollable()
    .Sortable()
    .Filterable())


Eyup
Telerik team
 answered on 27 Jan 2023
1 answer
79 views
Hello - we are currently using Telerik.UI.For.AspNet.Core 2020.3.915  is the CheckBoxGroup component available in this version or would we need to upgrade to a newer version of Kendo?  It doesn't not come up as an option for me.
Alexander
Telerik team
 answered on 09 Nov 2022
0 answers
66 views

https://stackoverflow.com/questions/73719432/how-to-conditionally-click-a-checkbox-in-telerik-grid-based-on-another-column-in


function onSave(e) 
    {

        //console.log(e.container.find("input[name=eTmfCompletenessComment]").val());

        //if (e.values.eTmfCompletenessComment.length > 3) 
        //{
        //    e.values.eTmfCompletenessActive == true;
        //}
        
        //if (e.container.find("input[name=eTmfCompletenessComment]").val().length > 3) 
        //{
        //    console.log(e.container.uid);
        //    //checkbox cell is in editmode
        //    e.container.find("input[name=eTmfCompletenessActive]").checked == true;
        //    //e.container.item.find("input[name=eTmfCompletenessActive]").checked == true;
            
        //}
       
        $(document).on("keyup", "#eTmfCompletenessComment", function () {
            function dirtyField(data, fieldName) {
                if (data.dirty && data.dirtyFields[fieldName]) {
                    return "<span class='k-dirty'></span>"
                }
                else {
                    return "";
                }
            }

             var commentcheck = $(this).val()
             console.log('$(this).val() =', $(this).val())

                var grid = $('#Grid').data("kendoGrid");
                var items = grid.items();
                if (commentcheck.length > 3) {
                    //var gc = $(this).parents(".k-")
                    $(this).parents(".k-master-row").find('input[type="checkbox"]').prop("checked", true);
                   //items.each(function () {
                        var dataItem = $(this).parents(".k-grid-cell").find('input[type="hidden"]');
                       set.dataItem.dirty = true;
                       dataItem.set(true);
                       dataItem.dirtyField.set(true, eTmfCompletenessActive)

                    //})
                 
                }
            })

        console.log("onSave");
    }

adam
Top achievements
Rank 1
 asked on 14 Sep 2022
0 answers
136 views
0 answers
78 views

 

In Main View

==========

columns.Bound(p => p.HuomName).Width(50).ClientTemplate("#=HuomName#").Title("H.UOM").Filterable(false).EditorTemplateName("HuomTemplate");

 

In Editor Template View

=====================

@(Html.Kendo().ComboBoxFor(m => m)
                      .Placeholder("Select H.UOM")
                      .DataValueField("uomID")
                      .DataTextField("HuomName")
                       .HtmlAttributes(new { @class = "form-control", @tabindex = "6" })
                      .DataSource(source => {
                          source.Read(read =>
                          {
                              read.Action("getGridH_UOM", "Order").Data("hUomFilter");
                          }).ServerFiltering(true);
                      })
                      .Events(e =>
                      {
                          e.Change("on_H_uom_grid_Change");
                      })
                )
Ecosoft
Top achievements
Rank 1
 asked on 03 Aug 2022
0 answers
70 views

I'm using EditorTemple to populate dropdown while in edit mode. I have my editor template in the Views/Shared/EditorTemplates folder.

But when I press the Edit button it does nothing and shows a simple text box instead of a dropdown.

I'm using dynamic properties for binding instead of the view model, all the references I've looked at are based on the view model.

Is there any way to accomplish the same with dynamic property binding?

Here's my code of Grid:


@(Html.Kendo().Grid<object>()
                                        .Name("Grid")
                                        .AutoBind(true)
                                        //.Events(ev => ev.Filter("setGridFilters").DataBound("setAutoFitColumn"))
                                        .Columns(columns =>
                                        {
                                            columns.AutoGenerate(true);
                                            columns.Bound("status").Title("Lead Status").Width(100).EditorTemplateName("LeadStatusList")
                                            .Filterable(a=>a.Multi(true).Search(true).BindTo(new[] {
                                            new{
                                                status="None"
                                            },
                                            new{
                                                status="Initial Call Scheduled"
                                            },
                                            new{
                                                status="Working"
                                            },
                                            new{
                                                status="Nurturing"
                                            },
                                            new{
                                                status="Unqualified"
                                            },
                                            new{
                                                status="Qualified"
                                            }
                                            }));
                                            columns.Bound("ownerId").Title("Owner").Width(100).Filterable(a => a.Multi(true).Search(true).DataSource(ds => ds.Custom()

                                            .Type("aspnetmvc-ajax")
                                            .Transport(transport =>
                                            transport.Read(read => read.Action("", "", new { field = "ownerId" }))
                                            )
                                            .Schema(schema => schema
                                            .Data("names")
                                            )));
                                            columns.Bound("eventBookedC").ClientTemplate("<div   title='#= title #'>#:getEventStatus(eventBookedC) #</div>").Title("Event Booked").Width(70)
                                            .Filterable(a => a.Multi(true).Search(true).BindTo(new[] {
                                            new{
                                                eventBookedC="Null"
                                            },
                                            new{
                                                eventBookedC="True"
                                            },
                                            new{
                                                eventBookedC="False"
                                            }
                                            }));
                                            columns.Command(command => { command.Edit();}).Width(150);
                                        })
                                        .Editable(editable => editable.Mode(GridEditMode.InLine))
                                    .Sortable()
                                    .Filterable()
                                    .Scrollable(sc => sc.Endless(true))
                                    .Groupable()
                                    .Resizable(resize => resize.Columns(true))
                                    .Reorderable(reorder => reorder.Columns(true))

                                    .ToolBar(e =>
                                    {
                                        e.Search();
                                        e.Custom().Text("Create New").HtmlAttributes(new { id = "btnCreateNew", @class = "btn btn-primary" });
                                    })
                                    .Pageable(p => p.Numeric(false).PreviousNext(false).Refresh(true))
                                    .Events(events => events
                                    .Sort("onSorting")
                                    .Filter("onFiltering")
                                    .Group("onGrouping")
                                    .Page("onPaging")
                                    .GroupCollapse("onGroupCollapse")
                                    .GroupExpand("onGroupExpand")
                                    .DataBound("onDataBound")
                                    .ColumnReorder("onColumnReordering")
                                    .Edit("edit")
                                     )


                                     .DataSource(dataSource => dataSource
                                        .Custom()
                                         .Type("aspnetmvc-ajax")
                                         .PageSize(500)
                                         .ServerPaging(true)
                                         .ServerFiltering(true)
                                         .ServerSorting(true)
                                         .ServerGrouping(true)
                                         .Transport(transport =>
                                         {
                                             transport.Read(read => read.Action("", ""));
                                             transport.Update(update => update.Action("", ""));
                                         }
                                         )
                                         .Schema(schema => schema
                                         .Data("data")
                                         .Total("total")
                                         .Model(m=>m.Id("id"))
                                         )
                                         )

                                 )

Here's my editor template -> LeadStatusList.cshtml:


@using Kendo.Mvc.UI
@(Html.Kendo().DropDownList()
                               .Name("Status")
                              .DataTextField("Text")
                              .DataValueField("Value")
                              .BindTo(new List<SelectListItem>() {
                                  new SelectListItem() {
                                      Text = "None",
                                      Value = "None"
                                  },
                                  new SelectListItem() {
                                      Text = "Initial Call Scheduled",
                                      Value = "Initial Call Scheduled"
                                  },
                                  new SelectListItem() {
                                      Text = "Working",
                                      Value = "Working"
                                  },
                                   new SelectListItem() {
                                      Text = "Nurturing",
                                      Value = "Nurturing"
                                  },
                                    new SelectListItem() {
                                      Text = "Unqualified",
                                      Value = "Unqualified"
                                  },
                                    new SelectListItem() {
                                      Text = "Qualified",
                                      Value = "Qualified"
                                  }
                              })
                              .Value("1")
                              .HtmlAttributes(new { style = "width: 100%" })
                        )

Zack
Top achievements
Rank 1
 asked on 10 Jul 2022
0 answers
142 views
I have a grid inside my grid editor template (subgrid). And both grids have popup editing. Right now the subgrids popup window shows as a part of the main grid editor template (right below the subgrid) and it doesn't show the title. How can I show it as a new window?
Valeria
Top achievements
Rank 1
 asked on 17 Jan 2022
Narrow your results
Selected tags
Tags
+? more
Top users last month
Mark
Top achievements
Rank 1
Yurii
Top achievements
Rank 1
Leland
Top achievements
Rank 2
Iron
Iron
Iron
Hon
Top achievements
Rank 1
Iron
Deltaohm
Top achievements
Rank 3
Bronze
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Mark
Top achievements
Rank 1
Yurii
Top achievements
Rank 1
Leland
Top achievements
Rank 2
Iron
Iron
Iron
Hon
Top achievements
Rank 1
Iron
Deltaohm
Top achievements
Rank 3
Bronze
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?