This is a migrated thread and some comments may be shown as answers.

Recently added data is not showing after saving

1 Answer 54 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Kumar Bharat
Top achievements
Rank 1
Kumar Bharat asked on 02 May 2014, 09:54 AM
Hi,

My search page showing list of employee in a grid and I want inline operation of grid.

My issue is :

Recently added data is not showing after "Save Changes" button clicked (It shows a copy of 1st record).
but  new data is appears after refresh button is clicked.

"Save change"  action is adding data perfectly.

Screenshot is attached 

Please see my code

cshtml
--------------------
@model TelerikMvc5App.ViewModel.EmployeeViewModel

@(Html.Kendo().Grid<TelerikMvc5App.ViewModel.EmployeeViewModel>()
    .Name("gridEmployee")
    .Columns(columns =>
    {
        columns.Bound(p => p.EmployeeId);
        columns.Bound(p => p.EmployeeName).Width(140);
        columns.Command(command => command.Destroy()).Width(110);
    })
    .ToolBar(toolbar =>
    {
        toolbar.Create();
        toolbar.Save();
    })
    .Editable(editable => editable.Mode(GridEditMode.InCell))
    .Pageable(pageable => pageable
                .Refresh(true)
                .PageSizes(true)
                .ButtonCount(5))
    .Navigatable()
    .Filterable()
    .Sortable()
    .Scrollable()
    .DataSource(dataSource => dataSource
        .Ajax()
        .Batch(true)
        .ServerOperation(false)
        .Events(events => events.Error("error_handler"))
            .Model(model => model.Id(p => p.EmployeeId))
            .Create("CreateEmp", "Employee", new { Area = "Employee" })
            .Read("SearchEmp", "Employee", new { Area = "Employee" })
            .Update("SaveEmp", "Employee", new { Area = "Employee" })
            .Destroy("DeleteEmp", "Employee", new { Area = "Employee" })
    )
)

<script type="text/javascript">
    function error_handler(e) {
        if (e.errors) {
            var message = "Errors:\n";
            $.each(e.errors, function (key, value) {
                if ('errors' in value) {
                    $.each(value.errors, function () {
                        message += this + "\n";
                    });
                }
            });
            alert(message);
        }
    }
</script>


Controller
---------------------------------

 public static List<EmployeeViewModel> empList = new List<EmployeeViewModel>();


private List<EmployeeViewModel> GetAllEmployees()
        {           
            empList.Add(new EmployeeViewModel() { EmployeeId = 1, EmployeeName = "Kumar" });
            empList.Add(new EmployeeViewModel() { EmployeeId = 2, EmployeeName = "Jaysankar" });
            empList.Add(new EmployeeViewModel() { EmployeeId = 3, EmployeeName = "Sathish" });
            empList.Add(new EmployeeViewModel() { EmployeeId = 4, EmployeeName = "Koushik" });
            empList.Add(new EmployeeViewModel() { EmployeeId = 5, EmployeeName = "Ramesh" });            
            return empList;
        }

public ActionResult Search()
        {
            if (empList.Count == 0)
            {
                GetAllEmployees();
            }
            return View();
        }

 public ActionResult SearchEmp([DataSourceRequest]DataSourceRequest request)
        {
            return Json(empList.ToDataSourceResult(request));
        }

 [AcceptVerbs(HttpVerbs.Post)]
        public ActionResult CreateEmp([DataSourceRequest] DataSourceRequest request, [Bind(Prefix = "models")]IEnumerable<EmployeeViewModel> emps)
        {
            foreach (EmployeeViewModel emp in emps)
            {               
                empList.Add(emp);
            }
        return Json(empList.ToDataSourceResult(request));
        }

 [AcceptVerbs(HttpVerbs.Post)]
        public ActionResult SaveEmp([DataSourceRequest] DataSourceRequest request, [Bind(Prefix = "models")]IEnumerable<EmployeeViewModel> emps)
        {  
                foreach EmployeeViewModel emp in emps)
                {
                    // some code
                }            }
            return Json(empList.ToDataSourceResult(request));
        }

 [AcceptVerbs(HttpVerbs.Post)]
        public ActionResult DeleteEmp([DataSourceRequest] DataSourceRequest request, [Bind(Prefix = "models")]IEnumerable<EmployeeViewModel> emps)
        {
            if (emps.Any())
            {
                foreach (EmployeeViewModel emp in emps)
                {
                    var item = empList.First(x => x.EmployeeId == emp.EmployeeId);
                    empList.Remove(item);
                }
            }            
            return Json(empList.ToDataSourceResult(request));
        }

--------------------------------------------------


Thanks
Kumar

1 Answer, 1 is accepted

Sort by
0
Alexander Popov
Telerik team
answered on 06 May 2014, 06:49 AM
Hello Kumar,

This behavior could be observed in case the Model's ID (in this case EmployeeId) is populated during the item creation. Basically, the Grid's DataSource checks whether the ID is different from the default value (zero, unless specified otherwise) and if it is - it treats the item as new and sends it to the Create method, otherwise it sends it to the Update method. Usually the IDs are assigned on the server side, so I would recommend setting the EmployeeId column as not editable. Passing the ModelState to the ToDataSourceResult is also recommended, for example: 
return Json(empList.ToDataSourceResult(request, ModelState));

Regards,
Alexander Popov
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
Grid
Asked by
Kumar Bharat
Top achievements
Rank 1
Answers by
Alexander Popov
Telerik team
Share this question
or