Passing grid dataitem to another view (ASP.NET MVC).

2 posts, 0 answers
  1. Navin
    Navin avatar
    12 posts
    Member since:
    Dec 2012

    Posted 13 Aug 2013 Link to this post

    Hi.

    I currently have the following Model:
    public class AwesomeDTO
    {
      public string ID {get;set;}
      public string Name {get;set;}
      public string Description {get;set;}
     
    }
    I currently have a following partial view with a grid.
    @model IEnumerable<AwesomeDTO>
     
    @(Html.Kendo().Grid(Model)
        .Name("AwesomeGrid")
        .Columns(columns =>
                {
                                 
                    columns.Bound(u => u.Name).Title("Name").Filterable(true).Width(200);
                    columns.Bound(u => u.Description).Title("Description").Filterable(false).Width(200);
                    columns.Command(command => command.Custom("Manage").Click("manageUser").Text("Manage")).Title("Manage");
                }
            )
        .Pageable()    
        .Filterable(filter => filter.Enabled(true))
        .DataSource(dataSource => dataSource
                .Ajax()
                .ServerOperation(false)
                .PageSize(10)
                .Model(model => model.Id(u => u.ResourceID))
                .Events(events => events.Error("onError"))
                    .Read(read => read.Action("GetAwesome", "Awesome"))
           )
         )

    The custom command calls the following Javascript function "manageUser" defined as follows:

    function manageUser(e) {
            e.preventDefault();
     
            var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
            var result;
     
            debugger;
            $.ajax({
                url: '@Url.Action("ManageAwesoem", "Awesome")',
                type: 'POST',
                data: JSON.parse(JSON.stringify(dataItem)),
                content: 'text/html',
                success: function (data) {
                    alert(data);
                },
                error: function (data) {
                    alert('error:' + data);
                }
            });
        }

    My Controller is as follows:
    public ActionResult ManageAwesome(AwesomeDTO userToManage)
    {
        return View(userToManage);
    }

    I would like the View to render with the AwesomeDTO properties. The step where I am not quite understanding is when and how to call the ManageAwesome view so that it renders in a new location in the browser. I do not want to expose the ID of the AwesomeDTO in the URL string and so I am looking for an alternative way to achieve this from the Kendo Grid.

    Any help would be appreciated.

    Thanks,
    Navin
  2. Atanas Korchev
    Admin
    Atanas Korchev avatar
    8462 posts

    Posted 14 Aug 2013 Link to this post

    Hello Navin,

     You could try using only JSON.stringify. Otherwise jQuery won't send the data in JSON format.

    $.ajax({
                url: '@Url.Action("ManageAwesoem", "Awesome")',
                type: 'POST',
                data: JSON.stringify(dataItem),
                contentType: "application/json",
                success: function (data) {
                    alert(data);
                },
                error: function (data) {
                    alert('error:' + data);
                }
            });

    Regards,
    Atanas Korchev
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top