검도 그리드 페이지 변경 옵션을 얻는 방법?

Question

내 웹 API 용 검도 UI 그리드 (angularJs 버전) 설정을 완료했습니다. 나는 단절 쪽 페이지 매김을 포함시켰다. 각 페이지 변경 요청에 대해 take, skip, page 및 pageSize 옵션을 보냅니다.

여기 API에서 내 자신의 검색 모델을 만들고 그 값을 JS 개체에 바인딩 한 다음 서버에 데이터를 게시하고 싶습니다.

그리드와 관련된 이벤트의 값을 얻을 수 있는지 궁금합니다. page change, pageSize.

내 사용자 지정 데이터 필드

을 확인할 수 있습니다 :`

public class SearchModel 
{ 
    .... 
    ....... 
    public int PageNo { get; set; } 
    public int PageSize { get; set; } 
    public string SortOrder { get; set; } 
    public string SortColumn { get; set; } 
} 

그래서 서버 측에서이 지정된 필드는 채워지지 할 필요가있다. 이를 위해 이러한 동일한 필드를 사용하여 JS에서 객체를 만들 수 있으며 그리드 페이지 매김 이벤트에서 값을 채워야합니다. pageNo 및 페이지 크기와 같습니다.

각도 js를 사용하여이를 수행하는 방법은 무엇입니까?

Answer 1

일반적으로 데이터 소스 매개 변수를 추출하고 추가하는 대신 dataSource.transport.read.data 구성 (http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#configuration-transport.read.data)을 사용하여 검도 데이터 소스 매개 변수에 값을 추가합니다.

이 예인 http://dojo.telerik.com/@Stephen/uXAjU을 살펴보십시오. 이것은 원격 데이터 바인딩을위한 수정 된 검도 그리드 데모입니다.

나는 단순히는 dataSource의 전송 구성 config (설정) read.data 추가 한

: CUSTOMDATA가

transport: { 
    read: { 
     url: "//demos.telerik.com/kendo-ui/service/Northwind.svc/Orders", 
     data: customData 
    } 
} 

가 (당신이 당신의 검색 모델 매개 변수를 추가 할 수있는 곳입니다) :

function customData() { 
    return { 
     custom1: 1, 
     custom2: "Two", 
     custom3: new Date() 
    }; 
} 

을 이제 그리드가 원격 서비스를 쿼리 할 때마다 사용자 정의 transport.read.data 메소드에 의해 리턴 된 데이터 외에도 데이터 소스 기능 (예 : 페이징/필터링/그룹화 매개 변수)에 내장 된 매개 변수를 전달합니다. dev 도구 네트워크 탭에서 customData가 그리드/데이터 소스 읽기 요청에 추가되는지 확인하십시오.

Answer 2

이것을 확인하십시오.

var grid = $('#test_grid').data('kendoGrid'); 
var pager = grid.pager; 
pager.bind('change', test_pagechange); 

function test_pagechange(e){ 
    console.log(e); 
} 

또한이

바인딩 이벤트가 때 페이지 변경을 해고 시도 할 수 있습니다. 그리드의 dataSource의 page() 메소드로 현재 페이지 인덱스를 얻을 수있다.

$("#grid").data("kendoGrid").dataSource.page(); 

또한 @Stephen가 다시 업데이트 된 질문을 볼 수있는 문서 http://docs.telerik.com/kendo-ui/api/javascript/ui/pager#events-change