Question

My Telerik MVC 3 grid is filled via Ajax. After inserting a row I need to rebind my grid. When I’m doing a rebind on the OnSave() event the data rebind is still sending on the Controller Action. I need something like an OnInserted event.

Any idea?

Answer 1

Use the following criteria,

 @(Html.Telerik().Grid<PackageDetails>()
     .Name("gvPackage")
     .DataKeys(keys => keys.Add(k => k.PKG_CODE))
     .Columns(column =>
     {
        column.Bound(c => c.PKG_NAME).Title("Description").Width(200);
        column.Bound(c => c.MESG_UNIT).Title("Measuring Unit").Width(100);
        column.Bound(c => c.STD_QNT).Title("Quantity").Width(100);
        column.Bound(c => c.MODEL).Title("Model").Width(100);

        column.Bound(c => c.COMP_CODE).ClientTemplate("<input type='text' id='txtSerial<#=COMP_CODE#>' value='<#=PKG_NAME#>' />").Title("Serial Number");

        column.Bound(c => c.COMP_DESC).Title("Model").Width(100);
                                  })
        .DataBinding(dbBindings => dbBindings.Ajax().Select("_PackageDetailsLoad", "SalesDept"))

)

Controller Code

[GridAction]
        public ActionResult _PackageDetailsLoad(string programID, string projectID, string packageID)
        {
            objLoginHelper = (LoginHelper)Session["LogInInformation"];

            return View(new GridModel<PackageDetails>
            {
                Data = salesDal.ReadPackageDetails(programID, projectID, packageID)
            });
        }

In JavaScript use the following Code

$('#ddlProgram').change(function () {          
     LoadPackageAndBindGrid();
 });

function LoadPackageAndBindGrid() {

            var params = {
                programID: $('#ddlProgram').val(),
                projectID: $('#ddlProject').val(),
                packageID: $('#ddlPackage').val()
            };

            var grid = $('#gvPackage').data('tGrid');
            grid.dataSource._data = [];               

            // Reload The Package Details
            grid.ajaxRequest(params);
        }