The Ajax Action link behaves strangely when it is in a Telerik MVC grid

advertisements

A have a razor view with a Telerik MVC grid. The first column has a link for deleting the record. The link is an Ajax Actionlink.

@(
 Html.Telerik().Grid<QMS.Models.CustomerTableRow>(Model)
        .Name("CustomerTable")
        .Columns(c =>
        {
            c.Template(
                @<text>
                @Ajax.ActionLink("Delete","Delete", new { key = item.CustomerKey },new AjaxOptions{ Confirm="Delete this Customer?",UpdateTargetId = "CustomerTable", HttpMethod = "Delete"})
                </text>
                );
            c.Bound(col => col.FirstName);
            c.Bound(col => col.LastName);
            c.Bound(col => col.Email);
            c.Bound(col => col.HomePhone);
        })
        .Pageable()
        .Sortable()
        .Resizable(res => res.Columns(true))
        .Scrollable()
        )

//Action Method in view
 //[HttpDelete]  <-- can't have this or else a "Resource not found" error occurs
        public ActionResult Delete(String key)
        {
                repo.DeleteCustomer(key);
                return PartialView("CustomerTable", repo.GetCustomerTable());
        }

Some odd things happen when I click on the "Delete" link that I create in the template column. First, the confirmation message does not appear but the delete action is still called. Second, even though I have HttpMethod="Delete", If I decorate the action method with [HttpDelete] I get a "resource not found" error. Finally, this grid is in a partial view and the action method returns the partialview after the delete however all formatting is lost, it's as if the CSS file is no longer there. None of this happens if the link is rendered outside of the grid. I am using version 2011.1.315


Just curious, are you using jQuery 1.6.1 (I believe this is the most recent at this time) or 1.5.1 the version telerik provides?

For example in my app I'm using @Html.Telerik().ScriptRegistrar().jQuery(false) to include the scripts Telerik needs but to not include jQuery so that I can include it myself and have control over which version it uses

Do you get the same behavior regardless of which version you include?

I'm assuming since it works outside of the grid you have jquery.unobtrusive-ajax.min.js referenced.