CODEWITHSUNDEEP
c#asp.net-mvc-3razorwebgrid
Sean Cain
Sean Cain

Reputation: 898

Razor webgrid ajax paging and sorting

I'm trying to learn how to use Razor WebGrid in MVC3. How does the ajaxUpdateCallback parameter work?

Upvotes: 28

Views: 53549

Answers (2)

Sean Chase
Sean Chase

Reputation: 1293

The ajaxUpdateCallback is the name of the javascript function that will get called after the server call is complete. The title of your question is regarding paging and sorting with the WebGrid which would look something like this...

@{
    var grid = new WebGrid(canPage: true, rowsPerPage: ThisController.PageSize, canSort: true, ajaxUpdateContainerId: "grid");
    grid.Bind(Model.Employees, rowCount: Model.TotalRecords, autoSortAndPage: false);
    grid.Pager(WebGridPagerModes.All);
    @grid.GetHtml(htmlAttributes: new { id="grid" },
        columns: grid.Columns(
            grid.Column(format: (item) => Html.ActionLink("Edit", "Edit", new { EmployeeID = item.EmployeeID })),
            grid.Column("FullName"),
            grid.Column("Title")
        ));
}

I have a full example here if you'd like to see it:

Example

Upvotes: 47

Mike Brind
Mike Brind

Reputation: 30035

The ajaxUpdateCallBack parameter is used to specify the JavaScript function that should be called when the element denoted by the ajaxUpdateContainerId value has been updated as a result of sorting or paging etc. You pass it into the constructor like this:

var grid = new WebGrid(data, ajaxUpdateContainerId : "grid", 
                ajaxUpdateCallback: "callBack");

And it will point to this:

function callBack(){
    alert('Called Back');
}

Upvotes: 15

Related Questions