CODEWITHSUNDEEP
asp.net-mvckendo-uikendo-gridkendo-asp.net-mvc
John Mathison
John Mathison

Reputation: 910

ASP.NET MVC & Kendo Grid Sortable

I'm new using MVC and Kendo.

I have this controller:

    public ActionResult Index()
    {
        db.Configuration.ProxyCreationEnabled = false;
        return View(db.students.ToList());
    }

The View has this:

@model IEnumerable<MVC_Test1.Models.student>

@{
ViewBag.Title = "Index";
}

<h2>Index</h2>

@(Html.Kendo().Grid(Model)
.Name("Grid")
.Pageable(pager => pager
    .PageSizes(new[] { 2, 3, 4 })
    .ButtonCount(5)) 
.Sortable()
.Selectable()
.DataSource(dataSource => dataSource
    .Ajax()
    .PageSize(2)
    .ServerOperation(false)
 )
.Columns(columns =>
{
    columns.Bound(p => p.FirstName).Title("Name");
    columns.Bound(p => p.MiddleName).Title("Middle");
    columns.Bound(p => p.LastName).Title("Lastname");
    columns.Bound(p => p.EnrollmentDate).Format("{0:" + System.Globalization.CultureInfo.CurrentCulture.DateTimeFormat.ShortDatePattern + "}").Title("Created");
    columns.Command(commands =>
    {
        commands.Custom("Options");
    }).Title("Options").Width(200);
})

I have see the kendo sortable widget, but I don't know how to mix everything to have this working. Here is the demo: http://demos.telerik.com/kendo-ui/sortable/integration-grid

Thank you.

Upvotes: 1

Views: 2343

Answers (3)

Spivonious
Spivonious

Reputation: 718

You'll want to handle the change event of the Sortable widget, and do an ajax post in there to update values on the server-side.

See the events demo for more info: http://demos.telerik.com/aspnet-mvc/sortable/events

Upvotes: 0

CSharper
CSharper

Reputation: 5590

Post the Grid to the server on some event 

var gridData = $("#ProposalGridX").data("kendoGrid");

            $.ajax({
                url: "/GridPost/PersonPost",
                type: 'POST',
                data: JSON.stringify(gridData.dataSource.view()),
                dataType: 'json',
                contentType: 'application/json',
                success: function (data) {

                }
            });


        [HttpPost]
        public JsonResult PersonPost(List<QPM.Models.PortfolioViewModel> model)
        {
            //model will contain gridview
            //update OrderPos
        }

Upvotes: 1

Matt Millican
Matt Millican

Reputation: 4054

Have you looked at their example here: http://demos.telerik.com/aspnet-mvc/sortable/integration-grid?

They have the grid + sortable working with the MVC helpers.

Upvotes: 1

Related Questions