Read custom bound update data in controller

[Paul Ridden]

Hello,

I am using the Kendo UI Grid control with the following key features activated:

• Custom Toolbar
• Batch Editing

I would like to get a string from a textbox in the custom toolbar when the user saves the changes made in grid. Here my code:

@(Html.Kendo().Grid(Model.TrackAndTraceTypeList)
    .Name("Grid")
    .Columns(columns =>
    {
        columns.Bound(item => item.CustomerLevel).Title("Customer<br/>Level").Width(80);
        columns.Bound(item => item.TrackAndTraceTypeId).Title("T&T<br/>Type Id").Width(80);
        columns.Bound(item => item.TrackAndTraceTypeName).Title("T&T Type<br/>Name");
        columns.Bound(item => item.Level).Title("Level").Width(60);
        columns.Bound(item => item.Description).Title("Description");
        columns.Bound(item => item.MTC).Title("MTC").Width(60);
        columns.Bound(item => item.Failure).Title("Failure").Width(80);
        columns.Bound(item => item.Success).Title("Success").Width(80);
        columns.Bound(item => item.Multiple).Title("Multiple").Width(80);
        columns.Bound(item => item.Photo).Title("Photo").Width(60);;
        columns.Bound(item => item.MessageTypeId).Title("Msg<br/>Type Id").Width(80);
    })
    .ToolBar(toolbar =>
        {
            toolbar.Template(@<text>
            <div class="k-toolbar k-grid-toolbar k-grid-top">
                <table style="width:400px">
                    <tr>
                        <td>
                            <a class="k-button k-button-icontext k-grid-save-changes" href="javascript:void(0)">
                                 <span class="k-icon k-update"></span>Save changes
                            </a>
                            <a class="k-button k-button-icontext k-grid-cancel-changes" href="javascript:void(0)">
                                <span class="k-icon k-cancel"></span>Cancel changes
                            </a>
                        </td>
                        <td>
                            <label class="category-label" for="category">Version No:
                                <input id="txtVersionNumber" type="text" style="width: 80px" />
                            </label>
                        </td>
                    </tr>

                </table>
           </div>
        </text>);
        })
    .Editable(editable => editable.Mode(GridEditMode.InCell))
    .Groupable()
    .Pageable(page => page.PageSizes(new int[] { 10, 20, 30, 50 }))
    .Sortable()
    .Filterable()
    .Selectable(s => s.Mode(GridSelectionMode.Single))
    .DataSource(dataSource => dataSource
        .Ajax()
        .Batch(true)
        .ServerOperation(false)
        .Events(events => events.Error("error_handler"))
        .Model(model => {
            model.Id(ttt => ttt.TrackAndTraceTypeId);
            model.Field(ttt => ttt.TrackAndTraceTypeId).Editable(false);
            model.Field(ttt => ttt.TrackAndTraceTypeName).Editable(false);
            model.Field(ttt => ttt.CustomerLevel).Editable(false);
            model.Field(ttt => ttt.Level).Editable(false);
            model.Field(ttt => ttt.MessageTypeId).Editable(false);
        })
        .PageSize(20)
        .Read(read => read.Action("TrackAndTrace_Read", "Customers"))
        .Update(update => update
            .Action("TrackAndTrace_Update", "Customers")
            .Data("versionNumber"))
     )
     .Resizable(resize => resize.Columns(true))
)
</div>

<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);
        }
    }

    function versionNumber(){
        return {version: $("#txtVersionNumber").val()};
    }

</script>

And my Controller look like this:

public ActionResult TrackAndTrace_Read([DataSourceRequest] DataSourceRequest request)
       {
           // Get the customer Id from the URL
           int customerIdValue = 0;

           if (Request.UrlReferrer.Segments.Length > 1)
           {
               string customerId = Request.UrlReferrer.Segments[Request.UrlReferrer.Segments.Length - 1];
               int.TryParse(customerId, out customerIdValue);
           }

           var data = GetCustomerTrackAndTraceTypeDetails(customerIdValue, request.Page).TrackAndTraceTypeList.AsEnumerable();

           return Json(data.ToDataSourceResult(request));
       }

       [AcceptVerbs(HttpVerbs.Post)]
       public ActionResult TrackAndTrace_Update([DataSourceRequest] DataSourceRequest request, [Bind(Prefix = "models")]IEnumerable<CustomerTrackAndTraceType> trackAndTraceTypes)
       {
           if (trackAndTraceTypes != null && ModelState.IsValid)
           {
               int customerIdValue = 0;

               if (Request.UrlReferrer.Segments.Length > 1)
               {
                   string customerId = Request.UrlReferrer.Segments[Request.UrlReferrer.Segments.Length - 1];
                   int.TryParse(customerId, out customerIdValue);
               }

               Customer currentCustomer = db.Customers.Find(customerIdValue);

               foreach (var tttItem in trackAndTraceTypes)
               {
                   // Save the Track And Trace Type Updates
                   db.AddCustomerTrackAndTraceTypeLink(tttItem.TrackAndTraceTypeId,
                       tttItem.CustomerId,
                       tttItem.Description,
                       tttItem.MTC,
                       tttItem.Failure,
                       tttItem.Multiple,
                       tttItem.Success,
                       tttItem.Photo,
                       User.Identity.Name); // record who made the change

                   // Update the customer level for the Grid
                   tttItem.CustomerLevel = currentCustomer.Name;
               }
           }

           return Json(trackAndTraceTypes.ToDataSourceResult(request, ModelState));
       }

To summarize, I need to pass the data in the txtVersionNumber into the db.AddCustomerTrackAndTraceTypeLink() method.

Thanks in advance,
Paul

[Ignacio]

Try adding "version" as a parameter in your TrackAndTrace_Update controller action.

So it would be:

public ActionResult TrackAndTrace_Update([DataSourceRequest] DataSourceRequest request, [Bind(Prefix = "models")]IEnumerable<CustomerTrackAndTraceType> trackAndTraceTypes, string version)

Hope this helps.

[Paul Ridden]

Thank you!

I knew it had to be simple.