2015-12-01 4 views
0

Я работаю над приложением asp.net MVC 4, в котором я использую telerik MVC Grid (NOT KENDO GRID).Как поймать PageSizeChanged событие telerik MVC Grid (NOT KENDO GRID)

http://www.telerik.com/help/aspnet-mvc/telerik-ui-components-grid-client-api-and-events.html

в моей странице (cshtml) я имею сетки с использованием общей частичной страницы. на странице, у меня также есть другие элементы ввода (которые действуют как критерии фильтра для данных сетки). Пользователь выбирает значения из входных элементов и нажимает кнопку отправки, а данные в сетке заполняются соответственно (используя пост-запрос в коде MVC) ,

Я использую пейджинг в сетке, и пользователь может выбрать размер страницы. Сетка создана

Html.Telerik().Grid(Model) 
      .Name("Employees") 
      .Columns(cols => 
      { 
       cols.Bound(e => e.FirstName).Title("First Name"); 
       cols.Bound(e => e.LastName).Title("Last Name"); 
       cols.Bound(e => e.SSN).Title("SSN"); 
       cols.Bound(e => e.HireDate).Format("{0:MM/dd/yyyy}").Title("Hire Date"); 
       cols.Bound(e => e.GroupName).Title("Department GROUP");    

      }) 
       .Groupable() 
       .Sortable(x => x.OrderBy(z=>z.GetType())) 
       .Pageable(p => p.PageSize(5).Style(GridPagerStyles.PageSizeDropDown | GridPagerStyles.NextPreviousAndNumeric).PageTo((Model.Any()&&!string.IsNullOrWhiteSpace(Model.First().PageNumber)?Convert.ToInt32(Model.First().PageNumber):1))) 
       .Filterable() 
       .Render(); 

метод POST-контроллер возвращает служащий отфильтрованные данные, принимая значение модели и запросы к базе данных.

Теперь, когда изменяется размер страницы в сетке, запрос отправляется методу GET контроллера вместо сообщения.

Как поймать PageSizeChanged как событие сетки в JavaScript, чтобы я мог вручную публиковать форму везде, где пользователь меняет размер страницы?

EDIT: Я написал следующий код, чтобы получить нажмите событие, когда пользователь нажимает на номер в размер страницы в раскрывающемся списке

$(document).on('click', 'ul.t-reset > li.t-item', function (e) { 

//how to avoid default functionality of server call? 
//tried following 
//event.unbind(); 
       //event.preventDefault(); 
       //alert("Was preventDefault() called: " + event.isDefaultPrevented()); 
       //event.stopImmediatePropagation() 
//return false; 


}); 

ответ

0

MVC Сетки просто заводятся в кэндо сетки JavaScript, поэтому все методы API/События и т. д. можно использовать с сеткой MVC.

Проверьте событие изменения страницы сетки кендо и просто используйте это.

http://docs.telerik.com/kendo-ui/api/javascript/ui/pager#events-change

var grid = $("#Employees").data('kendoGrid'); 

Теперь у вас есть сетки, вы можете делать все, что вы хотите его. Подпишитесь на изменение события страницы, как в примере с документацией API Kendo;

<div id="pager"></div> 

<script> 
    function pager_change() { 
     console.log("pager change event"); 
    } 

    var dataSource = new kendo.data.DataSource({ 
     data: [ 
     { productName: "Tea", category: "Beverages" }, 
     { productName: "Coffee", category: "Beverages" }, 
     { productName: "Ham", category: "Food" }, 
     { productName: "Bread", category: "Food" } 
     ], 
     pageSize: 2 
    }); 

    dataSource.read(); 

    var pager = $("#pager").kendoPager({ 
     dataSource: dataSource 
    }).data("kendoPager"); 

    pager.bind("change", pager_change); 
</script> 

Я хотел бы создать сетку с MVC, и если мне нужно, чтобы попасть в его работах и ​​сделать много на стороне клиента магии я просто захватить его в виде сетки кэндо.