2016-06-11 8 views
1

Asp.Net MVCを使用して、まずエンティティフレームワークコードで作成したデータベースからjQueryデータテーブルにデータを取得しています。したがって、データベースのすべてのレコードには、スキャフォルダーによって生成された「削除、詳細、編集」リンクもあります。これらのリンクについても検索が動作します。だから、特定の列のみの検索を許可するか、または他の特定の列の検索を無効にするにはどうすればよいですか?この場合、どのようにしてこの特定の列のソートを無効にすることができますか(削除、詳細、編集)?Asp.Net MVCエンティティフレームワークデータで特定の列の検索を無効にするMVCエンティティフレームワークデータ

私はAsp.Net Coreを使用しています。これは追加情報です。

コード:

div class="row"> 
<div class="col-sm-12"> 
    <p> 
     <a asp-action="Create">Create New</a> 
    </p> 
    <div class="panel panel-default"> 
     <div class="panel panel-heading"> 
      Reports 
     </div> 
     <div class="panel-body"> 
      <div class="table-responsive"> 
       <table class="table table-hover table-responsive" id="dataTables"> 
        <thead> 
         <tr> 
          <th> 
           @Html.DisplayNameFor(model => model.Description) 
          </th> 

          <th> 
           @Html.DisplayNameFor(model => model.RepFile) 
          </th>         

          <th class="col-sm-2"></th> 
         </tr> 
        </thead> 
        <tbody> 
         @foreach (var item in Model) 
         { 
          <tr> 
           <td> 
            @Html.DisplayFor(modelItem => item.Description) 
           </td> 

           <td> 
            @Html.DisplayFor(modelItem => item.RepFile) 
           </td> 

           <td> 
            <a asp-action="Edit" asp-route-id="@item.ID">Edit</a> | 
            <a asp-action="Details" asp-route-id="@item.ID">Details</a> | 
            <a asp-action="Delete" asp-route-id="@item.ID">Delete</a> 
           </td> 
          </tr> 
         } 
        </tbody> 
       </table> 
      </div> 
     </div> 
    </div> 

    </div> 
</div> 

@sectionスクリプトstandard jQuery Datatablesにおいて{

<script> 
    $(document).ready(function() { 
     $('#dataTables').DataTable({ 
      responsive: true 
     }); 
    }); 
</script> 

}

+0

を検索するための別の例のスレッドあなたは[jQueryのDataTableの](https://datatables.net)を使用していますか? –

+0

@FlorinSecalはい、私のデータベースのデータを表示しています – Arianit

答えて

1

、フィルタリングは、クライアント側で行われ、探索は、すべての行および列上で動作します。

あなたは、各列に対して礼儀を(searchableorderableなど)を定義して設定をカスタマイズすることができます:あなたは、オプションのparamettersを使用してデータテーブルを設定するときにすることをarchieveでき

$('#example').dataTable({ 
 
    "columns": [{ 
 
    "searchable": true, 
 
    "orderable": true 
 
    }, { 
 
    "searchable": true, 
 
    "orderable": true 
 
    }, { 
 
    "searchable": true, 
 
    "orderable": true 
 
    }, { 
 
    "searchable": false, 
 
    "orderable": false 
 
    }, { 
 
    "searchable": false, 
 
    "orderable": false 
 
    }, { 
 
    "searchable": false, 
 
    "orderable": false 
 
    }, ] 
 
})
<script src="https://cdn.datatables.net/u/bs/jq-2.2.3,dt-1.10.12/datatables.min.js"></script> 
 
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> 
 
<link href="https://cdn.datatables.net/u/bs/jq-2.2.3,dt-1.10.12/datatables.min.css" rel="stylesheet" /> 
 
<link href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" /> 
 

 
<table id="example" class="display" cellspacing="0" width="100%"> 
 
    <thead> 
 
    <tr> 
 
     <th>Name</th> 
 
     <th>Position</th> 
 
     <th>Office</th> 
 
     <th>Age</th> 
 
     <th>Start date</th> 
 
     <th>Salary</th> 
 
    </tr> 
 
    </thead> 
 
    <tfoot> 
 
    <tr> 
 
     <th>Name</th> 
 
     <th>Position</th> 
 
     <th>Office</th> 
 
     <th>Age</th> 
 
     <th>Start date</th> 
 
     <th>Salary</th> 
 
    </tr> 
 
    </tfoot> 
 
    <tbody> 
 
    <tr> 
 
     <td>Tiger Nixon</td> 
 
     <td>System Architect</td> 
 
     <td>Edinburgh</td> 
 
     <td>61</td> 
 
     <td>2011/04/25</td> 
 
     <td>$320,800</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Garrett Winters</td> 
 
     <td>Accountant</td> 
 
     <td>Tokyo</td> 
 
     <td>63</td> 
 
     <td>2011/07/25</td> 
 
     <td>$170,750</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Ashton Cox</td> 
 
     <td>Junior Technical Author</td> 
 
     <td>San Francisco</td> 
 
     <td>66</td> 
 
     <td>2009/01/12</td> 
 
     <td>$86,000</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Cedric Kelly</td> 
 
     <td>Senior Javascript Developer</td> 
 
     <td>Edinburgh</td> 
 
     <td>22</td> 
 
     <td>2012/03/29</td> 
 
     <td>$433,060</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Airi Satou</td> 
 
     <td>Accountant</td> 
 
     <td>Tokyo</td> 
 
     <td>33</td> 
 
     <td>2008/11/28</td> 
 
     <td>$162,700</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Brielle Williamson</td> 
 
     <td>Integration Specialist</td> 
 
     <td>New York</td> 
 
     <td>61</td> 
 
     <td>2012/12/02</td> 
 
     <td>$372,000</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Herrod Chandler</td> 
 
     <td>Sales Assistant</td> 
 
     <td>San Francisco</td> 
 
     <td>59</td> 
 
     <td>2012/08/06</td> 
 
     <td>$137,500</td> 
 
    </tr> 
 
    </tbody> 
 
</table>

+0

この場合、私は3つの列を持っていますので、最初の列は検索できないはずです。 – Arianit

+0

はい、列を定義する順番はあなたのテーブルの順番です –

+0

私がずっと探していた答えは、私の目の前でした!ありがとうございました – Arianit

1

注文の場合:カラム.orderable

このパラメータを使用DataTables

記述から、あなたはコラム時に注文するエンドユーザーの 能力を削除することができます。これは、 の内容の列の場合に便利です(たとえば、 の表の「編集」または「削除」ボタンがある場合)。

here

関連する問題