как поймать событие PageSizeChanged Telerik MVC Grid (НЕ KENDO GRID)

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

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

на моей странице (cshtml) у меня есть сетка, использующая общую частичную страницу. на странице у меня также есть другие элементы ввода (которые действуют как критерии фильтрации для данных сетки). Пользователь выбирает значения из элементов ввода и нажимает кнопку отправки, и данные в сетке заполняются соответствующим образом (с использованием post requst в коде 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 контроллера, а не post.

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

ИЗМЕНИТЬ: я написал следующий код, чтобы получать событие клика всякий раз, когда пользователь нажимает на число в раскрывающемся списке размера страницы.

 $(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;


});

asp.net-mvc telerik c#-4.0 telerik-grid
person amol    schedule 01.12.2015    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Сетки MVC просто превращаются в javascript Kendo Grid, поэтому все методы / события API и т. Д. Можно использовать с сеткой MVC.

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

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

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

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

<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, и если мне нужно разобраться в ее работе и совершить много магии на стороне клиента, я просто возьму ее как сетку Кендо.

person Greg    schedule 16.12.2015