2016-11-10 9 views
0

MVC 5プロジェクトでのJquery Datatablesの使用。また、作業全体をより簡単にしているDatatables.MVC5ヘルパーを使用し、this tutorialの後にMVCサーバー側の処理のためにすべてを設定するのに役立ちます。MVC 5&Jquery DataTablesユーザーロールに基づく列の表示

ボタンの列、つまり[編集] | [削除|最初の2つの列はユーザ​​ー役割に基づいています。これらのボタンは私の通常のMVCコントローラを呼び出します。私は、ボタンを作成することができます

、私はロール・チェックを処理する方法を考え出すことはできません。私の以前のクライアント側は、Razor Syntaxで簡単でした。DataTableを使用するのがずっと面倒です。

現行の表。私はカミソリの構文を試みたが、すべてのHTMLベースのだったdummysプロジェクトのための私の前のテーブルとは違って働いていない列というタイトルのボタン列で

 $(function() { 
     assetListVM = { 
      dt: null, 
      init: function() { 
       dt = $('#assetdatatable').DataTable({ 
        "serverSide": true, 
        "processing": true, 
        "DisplayLength": 25, 
        "ajax": { 
         "type": "POST", // Required to change from 'GET' as this produced server error query string length too long. 
         "url": "@Url.Action("Get","Demo")", 
         "data": // Allows us to return extra data object to controller 
          function (d) { 
           d.excelExport = $("#excelExport").val(); 
          } 
        }, 
        "scrollY": viewheight, // Calculated to help ensure table is fitting max area of screen with out dropping off screen. 
        "colReorder": true, 
        "select": true, 
        "stateSave": true, 
        "dom": 'fBrtip', 
        "lengthMenu": [[25, 50, 100, 200, -1], [25, 50, 100, 200, "All"]], 
        "buttons": [ 
         "pageLength", 
         "copy", 
         "excel" 
         ], 
        "columns": [ 
// HERE I need to check user Role and choose if to display column or not. 
// I have tried Razor @if (User.IsInRole("Sausage")) { } 
         { 
          "title": "button column" 
          "data": "AssetID", 
          "className": 'details_button', 
          "render": function (AssetID) 
          { 
           return '<a class="btn-xs btn-primary glyphicon glyphicon-list-alt" href=/Demo/Details/' + AssetID +'></a>'; 
           } 
          }, 
         { "title": "AssetID", "data": "AssetID" }, 
         { "title": "SIM", "data": "SIM" }, 
         { "title": "IMEI", "data": "IMEI" }, 
         { "title": "Software", "data": "LoggedOnSoftware" }, 
         { "title": "Soft No", "data": "LoggedOnSoftwareVerNo" }, 
         { "title": "Last Reset", "data": "LastResetType" }, 
         { 
          "title": "Last Log", "data": "LastLogOnTime", 
          "render": function (LastLogOnTime) { 
           return (moment(LastLogOnTime).isValid()) ? moment(LastLogOnTime).format("DD MMM YY") : "-"; 
          } 
         } 
        ], 
        "order": [[2, 'asc']] 
       }); 
      } 
     } 

     // initialize the datatables 
     assetListVM.init(); 
    }); 

。現在のユーザーロールを持つビューバックオブジェクトを表示して確認することができますが、テーブルの設定内で/ elseデシジョンを実行する方法はわかりません。

誰もがこのようなもののいずれかの例を持っている場合私はグリップを得ることができるか、それが非常に高く評価されるだろう正しい方向に私を指すことができます。

私が検索し、私が見つけた最も近い質問がthis old oneたチェックしています。

更新:ジェイミー

へ おかげ

ここでは、現在のユーザーの役割に基づいて、私の新しい作業コードは、最初の列を非表示になりますです。

var RoleCheck = @(User.IsInRole("sausage") ? "true" : "false"); // new check for user role outside of Jquery DataTable function which will work. 
      $(function() { 
     assetListVM = { 
      dt: null, 
      init: function() { 
       dt = $('#assetdatatable').DataTable({ 
        "serverSide": true, 
        "processing": true, 
        "ajax": { 
         "type": "POST", // Required to change from 'GET' as this produced server error query string length too long. 
         "url": "@Url.Action("Get","Demo")", 
         "data": // Allows us to return extra data object to controller 
          function (d) { 
           d.excelExport = $("#excelExport").val(); 
          } 
        }, 
        "columnDefs": [ 
         { 
         "target": [0], 
         "visible": RoleCheck // new variable true or false based on user role. 
         } 
        ] 
        "columns": [ 
         { 
          "title": "button column" 
          "data": "AssetID", 
          "className": 'details_button', 
          "render": function (AssetID) 
          { 
           return '<a class="btn-xs btn-primary glyphicon glyphicon-list-alt" href=/Demo/Details/' + AssetID +'></a>'; 
           } 
          }, 
         { "title": "AssetID", "data": "AssetID" }, 
         { "title": "SIM", "data": "SIM" }, 
         { "title": "IMEI", "data": "IMEI" }, 
         { "title": "Software", "data": "LoggedOnSoftware" }, 
         { "title": "Soft No", "data": "LoggedOnSoftwareVerNo" }, 
         { "title": "Last Reset", "data": "LastResetType" }, 
         { 
          "title": "Last Log", "data": "LastLogOnTime", 
          "render": function (LastLogOnTime) { 
           return (moment(LastLogOnTime).isValid()) ? moment(LastLogOnTime).format("DD MMM YY") : "-"; 
          } 
         } 
        ], 
        "order": [[2, 'asc']] 
       }); 
      } 
     } 
     // initialize the datatables 
     assetListVM.init(); 
    }); 
+0

あなたは、モデルの検証部分を作ることができませんか?プロパティ 'CanEdit'のように、あなたのコントローラにその値をセットし、' CanEditを返しますか?ボタン: ''; ' – JamieD77

+0

'@ Url.Action(" Get "、" Demo ")'が働いているとき 'return @(User.IsInRole(" Sausage ")?'ボタンhtml ':"' '"); 'も動作する必要があります – JamieD77

+0

@ JamieD77残念なことに行レベルで働いてくれてありがとうJamie、それはボタンを隠し、私はすべての列を表示しないようにしたい。 –

答えて

1

この列にcolumnDefを追加してそこに表示することができます。

"columnDefs": [ 
     { 
      "targets": [ 0 ], //first column 
      "visible": @(User.IsInRole("Sausage") : ? "true" : "false") 
     } 
    ] 

インラインレイザーコードではなく、変数を設定します。

var RoleCheck = @(User.IsInRole("Sausage") : ? "true" : "false"); 


"columnDefs": [ 
     { 
      "targets": [ 0 ], //first column 
      "visible": RoleCheck 
     } 
    ] 

https://datatables.net/examples/basic_init/hidden_columns.html

+0

Jamieにはありがとうございました。問題は、Razorの構文がスクリプトではうまくいかず、TrueまたはFalseを返します。あなたの方法を使って。スクリプトの外でvar RoleCheck = @(User.IsInRole( "Galleos")? "true": "false"); columnDefs "visible":RoleCheckあなたの答えを喜んで修正できるかどうか、私はそれを行方としてマークします。 –

関連する問題