paging issue of two webgrid ( parital view ) on main view in mvc

See more:

ASP.NET

Visual-Studio

MVC4

I have two partial view with name Files and Documents.Each have separate webgrids. i am rendering both partial view in main view .Its fine . when i click on next page of one grid it also change page of another grid . can anybody help me regarding this issue .Thanks in advance sue .Thanks in advance

WebGrid 1

@model IList<IC.Controllers.Files>

@{
   WebGrid grid = new WebGrid(Model, rowsPerPage: 5,canPage:true);
   grid.Pager(WebGridPagerModes.All);
   @grid.GetHtml( tableStyle: "webgrid-70",
                    headerStyle: "webgrid-70-header",
                    footerStyle: "webgrid-70-footer",
                    alternatingRowStyle: "webgrid-70-alternating-row",
                    selectedRowStyle: "webgrid-70-selected-row",
                    rowStyle: "webgrid-70-row-style",
                    mode:WebGridPagerModes.All,
                    firstText: "<< First",
 previousText: "< Prev",
 nextText: "Next >",
 lastText: "Last >>",
                    columns: grid.Columns(
                        grid.Column("FileID","ID"),
		                grid.Column("FileName", "File Name"),
		                grid.Column("Owner", "Created By") ,
                        grid.Column("CreatedDate", "Created Date") ,
                        grid.Column("IsActive", "Is Active")        
 ))
}

WebGrid 2

@model IList<IC.Controllers.Documents>

@{
   WebGrid grid2 = new WebGrid(Model, rowsPerPage: 5,canPage:true);
   grid2.Pager(WebGridPagerModes.All);
   @grid2.GetHtml( tableStyle: "webgrid-100",
                    headerStyle: "webgrid-100-header",
                    footerStyle: "webgrid-100-footer",
                    alternatingRowStyle: "webgrid-100-alternating-row",
                    selectedRowStyle: "webgrid-100-selected-row",
                    rowStyle: "webgrid-100-row-style",
                    mode:WebGridPagerModes.All,
                    firstText: "<< First",
 previousText: "< Prev",
 nextText: "Next >",
 lastText: "Last >>",
                    columns: grid2.Columns(
                        grid2.Column("DocumnetID","ID"),
		                grid2.Column("DocumnetName", "Name"),
                        grid2.Column("Detail", format: @<text>@Html.ActionLink("Select", "Submit", new { QtId = item.DocumnetID }) </text>),
                        grid2.Column("Edit", format: @<text>@Html.ActionLink("Edit", "Submit", new { QtId = item.DocumnetID }) </text>),
                        grid2.Column("Delete", format: @<text>@Html.ActionLink("Delete", "Submit", new { QtId = item.DocumnetID },new { onclick = "return confirm('Are you sure you wish to delete this article?');" }) </text>)
 ))
}