AJAX WebMethod에서 돌아 오는 Gridview

Question

AJAX Control Toolkit을 사용하면 jquery를 사용하는 것보다 훨씬 많은 일을 할 수 있다는 것을 알게되었습니다. 그래서 나는 updatepanels 등의 컨트롤 대신에 jquery ajax를 사용하기 시작했다. 그리고 그것은 훨씬 빠르고 덜 복잡 해 보인다.

내가 가진 질문 중 하나는 updatepanel 내부에서 페이징이있는 gridview가 있었으며 DB에서 행을 가져 와서 gridview를 다시 바인딩하는 버튼이 있다는 것입니다. 이제는 webmethod를 사용하고 싶습니다.

webmethod에서이를 반환 할 수있는 방법이 있습니까? 어디뿐만 아니라 같은 컨트롤을 반환 할 수있는 방법이 updatepanel.Is 내부의 .ascx 컨트롤을 가지고 말할 수 많은 다른 경우가있을 수 있습니다? 모든 샘플 링크는

감사

이

Answer 1

WebMethods에서 GridView를 반환하지 마십시오. jQuery를 사용하여 클라이언트 측에서 데이터를 반환하고 바인드해야한다.

GridView를 완전히 교체하려는 경우 표 형식으로 데이터를 표시하기 위해 일종의 jQuery 플러그인을 사용하는 것이 좋습니다. jQGrid 또는 datatables (내 마음에 드는 것)을 들여다 볼 수 있습니다. 웹 메서드는 Json 형식의 데이터 만 반환 할 수 있습니다. 같은 뭔가 : datatables의 특정 경우

[WebMethod] 
public List<CustomObject> GetData(string param1, string param2) 
{ 
    //return data here 
} 

, 당신은 준수해야 an interface있다. 당신이 datatables를 사용하도록 선택하는 경우

가

public class ResponseData 
{ 
    #region properties 
    public int iTotalRecords { get; set; } //used by datatables to build the pager 
    public int iTotalDisplayRecords { get; set; } //used by datatables to build the pager 
    public string sEcho { get; set; } 
    public string sColumns { get;set; } //optional 
    public List<CustomObject> aaData { get; set; } //your actual business objects 
    #endregion   
} 

그래서 웹 방법은, 당신이하고 클라이언트 측에서 데이터를 결합하는 것 ResponseData

[WebMethod] 
public ResponseData GetData(string param1, string param2) 
{ 
    //return ResponseData 
} 

반환해야합니다 : 그것은 내 C# 버전에 다음과 같을 것이 같은 :

$(document).ready(function() { 
      var oTableSummary = $("#tbl").dataTable({ 
       "bJQueryUI": true, 
       "bPaginate": false, 
       "sPaginationType": "full_numbers", 
       "bServerSide": true, 
       "bProcessing": true, 
       "iDisplayLength": 50, 
       "bFilter": false, 
       "bSortClasses": false, 
       "bDeferRender": false, 
       "oLanguage": { "sSearch": "Search all columns:" }, 
       "aLengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]], 
       "sAjaxSource": "WebService.asmx/GetData", 
       "fnServerData": function(sSource, aoData, fnCallback) { 
        $.ajax({ 
         "type": "POST", 
         "dataType": 'json', 
         "contentType": "application/json; charset=utf-8", 
         "url": sSource, 
         "data": "{'param1': 'param1" , 'param2': 'param2' }", 
         "success": function(result) { 
          fnCallback(result); // draw the table 
         } 
        }); 
       } 
      }); 
     }); 

PS : 당신이 그것을 마스터 할 경우이 물건을 학습 꽤 쓸 필요 하겠지만 , 서버 컨트롤 사용으로 돌아 가기를 원하지 않을 것입니다. : D

Answer 2

당신은 웹 메소드를 가질 수

다시 발생을 평가 끈. 이 문자열에는 this 또는 this 접근 방식을 사용하여 컨트롤에서 렌더링 한 모든 HTML이 포함됩니다. 그리고 클라이언트 측에서 테이블의 소유자를 새로운 내용으로 바꿀 수 있습니다 (기본적으로 업데이트 패널이하는 것입니다).

그러나 더 좋은 방법은 모든 HTML이 아닌 데이터 만 전송하는 것입니다. 어쩌면 jquery grid plugins 약간 도움이 될 것입니다.

Answer 3

웹 메서드에서 서버 컨트롤을 반환하지 않습니다. 처음에는 코드의 양을 줄이는 것처럼 보일 수 있지만 장기적으로는 더 많은 코드와 두통이 생길 것입니다. 예를 들어 컨트롤, 코드에 바인딩 된 데이터 또는 코드 숨김에있는 이벤트에 어떻게 액세스 할 계획입니까? 마크 업의 양을 줄이는 것은 좋지만 코드 숨김을 희생 시키지는 않습니다.

때로는 개발자로서 우리는 사용법을 배울 때 약간의 신기술을 사용하는 경향이 있으며, 이것이 그 중 하나라고 생각합니다.