Using PUT and DELETE for DataSource Actions

[dwhite]

I am using the Restful Routing (http://restfulrouting.com/) library in my MVC5 project. Restful Routing gives me true REST based actions for my controllers. I'm trying to use the Kendo Grid in edit mode against these actions. Using the MVC wrapper, I have the following code for my data source:

.DataSource(ds => ds
   .Ajax()
   .Model(model => model.Id(mapping => mapping.Id))
   .Read(read => read.Action("list", "mappings").Type(HttpVerbs.Get))
   .Create(create => create.Action("create", "mappings").Type(HttpVerbs.Post))
   .Update(update => update.Action("update", "mappings").Type(HttpVerbs.Put))
   .Destroy(destroy => destroy.Action("destroy", "mappings").Type(HttpVerbs.Delete))
   .PageSize(20)
)

The actions there should resolve to the URL /mappings/{id} with the exception of Read and Create. When I look at the generated JavaScript code though, I get the following: 

"dataSource": {
    "transport": {
        "prefix": "",
        "read": {
            "url": "/mappings/list",
            "type": "GET"
        },
        "create": {
            "url": "/mappings",
            "type": "POST"
        }
    },

There are no definitions for the update or destroy actions. If I change .Action to .Url, then I'm able to apply an HttpVerb. I figure the Url is the way to go, but how do I get the models Id within the Url string? I thought that perhaps the CleintTemplate placeholders would work, but they don't, e.g.:

.Update(update => update.Url(Url.Action("Update", "Mappings", new { id = "#=Id#"})).Type(HttpVerbs.Put))

So, how can I get the Model's Id in a Url?

Thanks,
Damien

[Rosen]

Hi dwhite,

I'm afraid that we are not familiar with Restful Routing library nor it is clear how it is configured in your case. Therefore, could you please provide a small runnable sample in which this issue can be observed locally.

In order to pass the id of the model via the URL, you will need to use a JavaScript function to build the URL. Similar to the following:

$(function() {
    var grid = $("#grid").data("kendoGrid");

    grid.dataSource.transport.options.update.url = function(data) {
        return "@Url.Content("~/mappings/")" + data.Id;
    }

    grid.dataSource.transport.options.destroy.url = function(data) {
        return "@Url.Content("~/mappings/")" + data.Id;
    }
});

.DataSource(dataSource =>
    dataSource.Ajax()
      .Model(model =>{/*..*/})
      .Read(read => read.Url(Url.Content("~/mappings")).Type(HttpVerbs.Get))
      .Create(create => create.Url(Url.Content("~/mappings")).Type(HttpVerbs.Post))
      .Update(update => update.Url(Url.Content("~/mappings")).Type(HttpVerbs.Put))
      .Destroy(destroy => destroy.Url(Url.Content("~/mappings")).Type(HttpVerbs.Delete))
)

Regards,
Rosen
Telerik