Add new row, send data to controller

[Baracskai]

Hello,

I try setup my Kendo grid in a Net.Core project with inline editing, but the "Create" controller action not firing after I try add new row. The Read method executes successfully, but the Create method never executing.

My controller code:

[HttpPost]
      public ActionResult Create([DataSourceRequest] DataSourceRequest request, DynamicMessageViewModel product)
      {

          return Json(new[] { product }.ToDataSourceResult(request, ModelState));
      }

      public ActionResult Read([DataSourceRequest]DataSourceRequest request)
      {
          IQueryable<DynamicMessageModel> dynamicmessagemodels = _context.DynamicMessage.DistinctBy(d => d.StringId).AsQueryable();

          DataSourceResult result = dynamicmessagemodels.ToDataSourceResult(request, dynamicMessageModel => new DynamicMessageViewModel {
              Id = dynamicMessageModel.Id,
              StringId = dynamicMessageModel.StringId,
              Culture = dynamicMessageModel.Culture,
              Message = dynamicMessageModel.Message
          });

          return Json(result);
      }

 

My view:

@(Html.Kendo().Grid<MyCoreSite.Models.DynamicMessage.DynamicMessageViewModel>()
           .Name("grid")
           .Columns(columns =>
           {
               columns.Bound(c => c.Id).Hidden();
               columns.Bound(c => c.StringId);
               columns.Bound(c => c.Culture).Hidden();
               columns.Bound(c => c.Message).Hidden();
               columns.Command(command => { command.Edit().Text(" ").CancelText(" ").UpdateText(" ").HtmlAttributes(new { title = Lang["Szerkesztés"].Value }); command.Destroy().Text(" ").HtmlAttributes(new { title = Lang["Törlés"].Value }); }).Width(102);
           })
           .ToolBar(toolbar =>
           {
               toolbar.Create();
               toolbar.Excel();
           })
           .Editable(editable => editable.Mode(GridEditMode.InLine))
           .Pageable()
           .Selectable(selectable =>
           {
               selectable.Mode(GridSelectionMode.Single);
               selectable.Type(GridSelectionType.Row);
           })
           .Sortable(sortable =>
           {
               sortable.SortMode(GridSortMode.SingleColumn);
           })
           .Filterable(filterable => filterable.Mode(GridFilterMode.Row))
           .Scrollable()
           .Events(events =>
           {
               events.Edit("onEdit");
               events.Change("onRowChange");
               events.SaveChanges("onSaveChanges");
           })
           .DataSource(dataSource => dataSource
               .Ajax()
               .Create(create => create.Action("Create", "DynamicMessage"))
               .Update(update => update.Action("Update", "DynamicMessage"))
               .Read(read => read.Action("Read", "DynamicMessage"))
           )
      )

 

My first question: why the Create action not firing after I try add new row? If I check the url of the Accept button, I see "#" in the href attribute...

My second question: after I click on the "Edit" button inside a row, the Cancel button appear. After I click on Cancel, the entire row will be removed from the grid. I dont understand why.

Thank you for help!

 

 

 

[Baracskai]

Hello, 

Does anyone have an idea to solve this? I have to go forward with the project.

Thank you!

[Viktor Tachev]

Hello Baracskai,

I examined the code and the Grid configuration seems correct to me. One thing you can try is specify explicitly the the Update action should send a Post request.

.Update(update => update.Action("Update", "DynamicMessage").Type(HttpVerbs.Post))

Regarding your second question. The behavior is likely observed because there is no ID field defined in the DataSource Model definition. The code would look similar to this:

.DataSource(dataSource => dataSource
   .Ajax()
   .Create(create => create.Action("Create", "DynamicMessage"))
   .Update(update => update.Action("Update", "DynamicMessage"))
   .Read(read => read.Action("Read", "DynamicMessage"))
    .Model(m => {
        m.Id(id => id.Id);
        m.Field(f => f.Id).Editable(false);
    })
)

In addition I am attaching a sample with a Grid that has CRUD operations enabled. Give it a try and let me know how it works for you.


Regards,
Viktor Tachev
Progress Telerik

[Baracskai]

Hello,

Thanks for the reply!

The second suggestion was good, now the row edit working well.

The first suggestion not working, the Create method was not called.

The only difference that I see compared with your project: my controller is inside an Area, but I don't think this is the problem, because the Read, Update, Destoy methods work well!

BR, Baracskai

[Baracskai]

Hello,

I find the solution.

I have 2 hidden fields in my grid that are <Required> fields (NOT NULL in database). Therefore the grid not send the data to the controller.

In this case:

- Can I setup deafult values for hidden fields from source code?

- Can I send the post request by pressing the Enter button in the editable cell?

Thank you!

[Viktor Tachev]

Hello Baracskai,

Setting a default value can be configured via the DefaultValue option in the DataSource Model configuration. The configuration would look similar to this:

.DataSource(dataSource => dataSource
   .Ajax()
   .Create(create => create.Action("Create", "DynamicMessage"))
   .Update(update => update.Action("Update", "DynamicMessage"))
   .Read(read => read.Action("Read", "DynamicMessage"))
    .Model(m => {
        m.Id(id => id.Id);
        m.Field(f => f.Id).Editable(false);
        m.Field(f => f.MyIntFieldName).DefaultValue(1);
        m.Field(f => f.MyStringFieldName).DefaultValue("default string value");
    })
)

Regards,
Viktor Tachev
Progress Telerik

[Baracskai]

Hello,

Do you have any idea why the DefaultValue not working? Currently I try set the default values in Model, but it is not appear after I try add new row to the grid. After my last reply it was worked (only the viewmodel changed, but I not find the reference point). 

Please see attached image.

My viewmodel code:

 

public class DynamicMessageDto
{
    //[HiddenInput(DisplayValue = false)]
    public Guid Id { get; set; }

    [Required(ErrorMessage = "'{0}' mező megadása kötelező!")]
    [StringLength(2000)]
    [DataType(DataType.Text)]
    [Display(Name = "Azonosító")]
    public string StringId { get; set; }

    [Required(ErrorMessage = "'{0}' mező megadása kötelező!")]
    [StringLength(10)]
    [Display(Name = "Nyelv")]
    //[HiddenInput(DisplayValue = false)]
    public string Culture { get; set; }

    [Required]
    [DataType(DataType.Text)]
    [Display(Name = "Szöveg")]
    //[HiddenInput(DisplayValue = false)]
    public string Message { get; set; } = "< Not set >";
}

 

[Viktor Tachev]

Hello,

 

The default value not being applied could be related to a known issue observed in the previous version of the components. Would you update to the latest release and see how the behavior changes? The current version is 2019.3.917.

 

Regards,
Viktor Tachev
Progress Telerik