2013-05-14 4 views
2

UPDATE 수행하는 방법에 - 나는 새로운 정보에 따라 질문을 변경 한 : 권한 기반 UI 표시를

우리는 그리드에서 검색 결과를 반환하는 작은 응용 프로그램이 있습니다. 이것이 모든 응용 프로그램에서만 수행 할 수 있기 때문에 하나의 컨트롤러 동작 만 있습니다. 그러나 사용자 권한에 따라 숨겨지기를 원하는 일부 데이터가 있습니다.

$('#grdSearch').dataTable({ 
     "bProcessing": true, 
     "sAjaxSource": uri, 
     "fnServerData": function(sSource, aoData, fnCallback, oSettings) { 
      oSettings.jqXHR = $.ajax(
       { 
        type: "POST", 
        url: sSource, 
        data: JSON.stringify(BuildSearchParams()), 
        contentType: "application/json", 
        dataType: 'json', 
        success: function (data) { 
         if (typeof data["error"] == "undefined") { 
          fnCallback(data); 
         } else { 
          alert(data["error"]); 
         } 
        } 
       }); 
     }, 
     "aoColumns": [ 
      { "mData": "Name" }, 
      { "mData": "StockSource" }, 
      { "mData": "SomeOtherColumn" } 
     ]}); 

문제는이에 다음

<th>Name</th> 
@if (Model.UserCanSeeThis) 
{ 
    <th>StockSource</th> 
} 
<th>SomeOtherColumn</th> 

우리는 디스플레이 그리드를 구축 할 DataTables를 사용하여 코드 JS : 예를 들어, 사용자 권한에 따라,이 같은 HTML의 StockSource의 열을 숨기 "StockSource"를 보이지 않게 설정할 수 없습니다. 사용자에게 권한이 없으면 StockSource 열이 null로 설정되지 않기 때문입니다. 어떤 아이디어를 제어하는 ​​방법?.

답변

3

내가 생각할 수있는 한 가지 방법은보기 페이지에서 aoColumns를 처리 할 인라인 스크립트를 만들 수 있습니다.

<script> 
//Preload with the first column since you know it will always be there 
var includedColumns = [{ "mData": "Name" }]; 
@if (Model.UserCanSeeThis) 
{ 
    //Add stock source when the user can see 
    includedColumns.push({ "mData": "StockSource" }); 
} 
//Add additional columns 
includedColumns.push({ "mData": "SomeOtherColumn" }); 
</script> 


그럼 그냥 나는 그것을 좋아 변수

$('#grdSearch').dataTable({ 
     "bProcessing": true, 
     "sAjaxSource": uri, 
     "fnServerData": function(sSource, aoData, fnCallback, oSettings) { 
      oSettings.jqXHR = $.ajax(
       { 
        type: "POST", 
        url: sSource, 
        data: JSON.stringify(BuildSearchParams()), 
        contentType: "application/json", 
        dataType: 'json', 
        success: function (data) { 
         if (typeof data["error"] == "undefined") { 
          fnCallback(data); 
         } else { 
          alert(data["error"]); 
         } 
        } 
       }); 
     }, 
     "aoColumns": includedColumns }); 
+0

이와 비슷한 작업을 마무리했습니다. 브래지어 감사합니다! – jlembke

1

나는 여전히 서버 측에서이를 수행합니다. 다만 변수 StockSource

를 설정하지 않고 당신은 내가 당신이 테이블을 만드는보기로 다시 모델을 통과 제안 MVC를 사용하는 것처럼 JS는

if (data != null) { 
    /* Get data for the given row */ 
    out = "<table cellpadding='5' cellspacing='0' border='0' style='padding-left:50px;'>"; 
    out += "<tr><td>Name:</td><td>" + data["Name"] + "</td></tr>"; 
    if (data["StockSource"]) 
      out += "<tr><td>Stock Source:</td><td>" + data["StockSource"] + "</td></tr>"; 
    out += "</table>"; 
} 
+0

를 사용할 수 있습니다. 불행하게도, 내가 통제해야하는 실제 장소가 "aoColumns"가 건설되고있는 위의 나의 질문을 변경 한 곳이라는 것을 알았습니다. 내 잘못이야. 거기에 어떤 아이디어? – jlembke

1

과 같을 것이다. 이렇게하면 현재 테이블 생성 코드를 쉽게 유지 관리 할 수 ​​없으므로 현재 수행중인 것보다 더 깨끗한 방식으로 필요한 열을 만들 수 있습니다.

보기에서 열이 필요하면 렌더링을 확인하고 필요가 없으면 렌더링하지 않아도됩니다.

+0

당신 말이 맞아요, 일반적으로 어떻게 할 건데,이 경우 모든 호출이 js의 WebAPI에 직접 이루어 지므로 사용되는 컨트롤러 액션은 검색 페이지를 처음 렌더링하는 것입니다. – jlembke