Bashing my head to the wall for the last few days as Kendo UI Grid was populating properly but when clicking Delete Or Update button it was always passing NULL to the Controller parameter.

The solution was to build the javascript result manaully before posting so MVC default model binder nows how to deserialise it.

The trick is that the MVC controller parameter should be called as products too:

result["products[" + i + "]." + member]

<script>
        $(document).ready(function () {
            dataSource = new kendo.data.DataSource({
                    transport: {
                        read: {
                            url: "ShoppingCartDetailsRead",
                            dataType: "json"
                        },
                        update: {
                            url: "ShoppingCartDetailsUpdate",
                            dataType: "json",
                            contentType: "application/json",
                            type: "POST"
                        },
                        destroy: {
                            url: "ShoppingCartDetailsDelete",
                            dataType: "json",
                            type: "POST"
                        },
                        parameterMap: function (data, type) {
                            if (type != "read") {
                                
                // post the products so the ASP.NET DefaultModelBinder will understand them:
                                var result = {};
 
                                for (var i = 0; i < data.models.length; i++) {
                                    var product = data.models[i];
 
                                    for (var member in product) {
                                        result["products[" + i + "]." + member] = product[member]; //NB: controller parameter should be products
                                    }
                                }
                                return result;
                                
                            } else {
                                return JSON.stringify(data);
                            }
                        }
                    },
                    batch: true,
                    pageSize: 20,
                    schema: {
                        model: {
                            id: "ShoppingCartItemID",
                            fields: {
                                ShoppingCartItemID :  { editable: false, default:1},
                                ShoppingCartID: { editable: false},
                                ProductID: { editable: false},
                                ProductName: { validation: { required: true } },
                                ListPrice: { type: "number"},
                                Quantity: { type: "number"}
                            }
                        }
                    }
                });
 
            $("#grid").kendoGrid({
                dataSource: dataSource,
                navigatable: true,
                sortable: true,
                pageable: true,
                toolbar: ["save", "cancel"],
                columns: [
                    { field: "ShoppingCartItemID", title: "Cart Id", width: 30 },
                    { field: "ShoppingCartID", title: "User Id", width: 110 },
                   { field: "ProductName", title: "Item", width: 110 },
                    { field: "ProductId", title: "Item Id", width: 110 },
                    { field: "ListPrice", title: "List Price", format: "{0:c}", width: 110 },
                    { field: "Quantity", title: "Quantity", width: 110 },
                    { command: "destroy", title: "&nbsp;", width: 90 }],
                editable: true
            });
        });
    </script>