2016-11-27 1 views
0

저는 자바 스크립트에 관해서는 초보자입니다. jsGrid 플러그인을 사용하여 브라우저에 눈금을 표시합니다. 그리드 열 머리글의 값은 "요청 상태"및 "요청 ID"입니다. 정적 데이터로도 작동하도록 할 수 있습니다. 이 데이터는 더 이상 내가 선택할 때 필터링하지 "요청"또는됩니다 (데이터 소스로 테스트를위한 JSON 파일을 사용) 아약스 호출에서 데이터를 가져 오는에 관해서jsGrid 플러그인 - 원격 데이터로 필터링하는 방법?

(function() { 
    var adminDashboardController = { 
     loadData: function(filter) { 
      return $.grep(this.requests, function(request) { 
       return (!filter.Status || request.Status === filter.Status) 
       && (!filter.RequestId || request.RequestId.indexOf(filter.RequestId) > -1) 
      }); 
     }, 

     insertItem: function(insertingReq) { 
     }, 

     updateItem: function(updatingReq) { 
     }, 

     deleteItem: function(deletingReq) { 
     } 
    }; 

    window.adminDashboardController = adminDashboardController; 

    adminDashboardController.status = [ 
     { Name: ""}, 
     { Name: "Requested"}, 
     { Name: "Declined"} 
    ]; 

    //This is the static data 
    adminDashboardController.requests = [ 
     { "Status": "Requested", "RequestId": "1"}, 
     { "Status": "Declined", "RequestId": "2"} 
    ]; 
}()); 

그러나으로 "거부" 필터링 기준. 이 문서에서 언급 한 형식을 사용하고 있습니다. -

(function() { 
    var adminDashboardController = { 
     loadData: function (filter) { 
      return $.ajax({ 
       type: "GET", 
       dataType: "json", 
       url: "/json/db514.json", 
       data: filter 
      }); 
     }, 
     insertItem: function(insertingReq) { 
     }, 

     updateItem: function(updatingReq) { 
     }, 

     deleteItem: function(deletingReq) { 
     } 
    }; 

    adminDashboardController.status = [ 
     { Name: ""}, 
     { Name: "Requested"}, 
     { Name: "Declined"} 
    ]; 
}()); 

이 경우 필터링을 구현하는 방법을 이해할 수 없습니다!

답변

0

이유는 코드에서 필터링을 구현해야하기 때문입니다. 일반적으로

이 그것을 할 수 있습니다

  1. 백엔드에
  2. (당신의 첫 번째 샘플에서와 같이) 클라이언트에서, 당신은 필터링을 할 것이며, 이는 엔드 포인트에 필터를 통과해야 데이터를 반환하십시오.
  3. 는, JSON 및 필터 데이터를로드, 또는 아직 클라이언트 측에서 필터링 할 귀하의 경우는 백엔드에 엔드 포인트를 추가 할 수 있습니다 중 하나에서

, (부분적으로 클라이언트의 백엔드와 후) 접근 방식을 결합 예를 들어 :

loadData: function (filter) { 
    return $.ajax({ 
     type: "GET", 
     dataType: "json", 
     url: "/json/db514.json" 
    }).then(function(requests) { 
     return $.grep(requests, function(request) { 
      return (!filter.Status || request.Status === filter.Status) 
      && (!filter.RequestId || request.RequestId.indexOf(filter.RequestId) > -1) 
     }); 
    }); 
} 

체크 아웃 GtiHub https://github.com/tabalinas/jsgrid/issues/32에서이 문제.

관련 문제