====== WebGrid ======

===== WebGridオブジェクト生成 =====

^WebGrid コンストラクターのパラメーター^^^
^名前^型^備考^
|source|IEnumerable<dynamic>|レンダリング対象のデータ。|
|columnNames|IEnumerable<string>|レンダリングされる列をフィルター選択します。|
|defaultSort|string|並べ替えの基準にする既定の列を指定します。|
|rowsPerPage|int|1 ページ当たりに表示する行数を制御します (既定値は 10)。|
|canPage|bool|データのページ切り替えを有効または無効にします。|
|canSort|bool|データの並べ替えを有効または無効にします。|
|ajaxUpdateContainerId|string|グリッドに含まれる要素の ID。これにより、AJAX のサポートが可能になります。|
|ajaxUpdateCallback|string|AJAX の更新が完了した時点で呼び出されるクライアント側の関数。|
|fieldNamePrefix|string|複数のグリッドをサポートするためのクエリ文字列フィールドのプレフィックス。|
|pageFieldName|string|ページ番号のクエリ文字列フィールド名。|
|selectionFieldName|string|選択した行番号のクエリ文字列フィールド名。|
|sortFieldName|string|並べ替え列のクエリ文字列フィールド名。|
|sortDirectionFieldName|string|並べ替えの方向のクエリ文字列フィールド名。|

^WebGrid.GetHtml のパラメーター^^^
^名前^型^備考^
|tableStyle|string|表のスタイル指定に使うクラス。|
|headerStyle|string|ヘッダー行のスタイル指定に使うクラス。|
|footerStyle|string|フッター行のスタイル指定に使うクラス。|
|rowStyle|string|行のスタイル指定に使うクラス (奇数行のみ)。|
|alternatingRowStyle|string|行のスタイル指定に使うクラス (偶数行のみ)。|
|selectedRowStyle|string|選択した行のスタイル指定に使うクラス。|
|caption|string|表見出しとして表示される文字列。|
|displayHeader|bool|ヘッダー行を表示するかどうかを指定します。|
|fillEmptyRows|bool|rowsPerPage の行数を確保するために、表に空の行を追加できるかどうかを指定します。|
|emptyRowCellValue|string|空の行に設定される値。fillEmptyRows が設定されている場合にのみ使用されます。|
|columns|IEnumerable<WebGridColumn>|列のレンダリングをカスタマイズするための列モデル。|
|exclusions|IEnumerable<string>|列の値が自動で設定される場合に除外する列。|
|mode|WebGridPagerModes|ページ切り替えレンダリングのモード (既定値は NextPrevious および Numeric)。|
|firstText|string|先頭ページへのリンクのテキスト。|
|previousText|string|前ページへのリンクのテキスト。|
|nextText|string|次ページへのリンクのテキスト。|
|lastText|string|最終ページへのリンクのテキスト。|
|numericLinksCount|int|表示する数字リンクの数 (既定値は 5)。|
|htmlAttributes|object|要素に設定する HTML 属性を保持します。|

[[https://msdn.microsoft.com/ja-jp/magazine/hh288075.aspx?f=255&MSPPError=-2147217396|ASP.NET MVC で WebGrid を最大限に活用する]]

<code charp WebGrid>
@model LatestResult.Models.DropDownListViewModel
@{
    // WebGridオブジェクト生成
    var grid = new WebGrid(source: Model.ResultData, ajaxUpdateContainerId: "content", canPage: false);
}
</code>

===== ソートやページング =====
アクションメソッドの引数にパラメータの名前を入れると値が自動的に入る。
<code charp Controller>
public ActionResult List(int page, string sort, string sortDir)
</code>

[[http://blog.okazuki.jp/entry/2013/12/02/125321|ASP.NET MVCでページャーつきテーブルを表示する]]

===== 条件により行の背景色を変更 =====
JQueryを使用して、条件によって背景色を変更する。
  * [[http://www.c-sharpcorner.com/article/mvc-webgrid-set-row-back-color-at-run-time/|MVC - WebGrid Set Row Back Color At Run Time]]\\
  * [[http://rfs.jp/sb/javascript/js-lab/jquery-table.html|jQueryでTABLE要素の操作]] 
  * [[http://stackoverflow.com/questions/26996770/how-to-change-the-colour-of-an-mvc-webgrid-row-text-depending-on-some-condition|How to change the colour of an MVC webgrid row text depending on some condition]]
  * [[http://www.dotnetawesome.com/2014/04/how-to-dynamically-set-row-background-color-of-webgrid-in-mvc4.html|How to Dynamically set row background color in a webgrid depending on the content in MVC4.]]

<code javascript List.cshtml>
@section scripts
{
    <script type="text/javascript">
        $(document).ready(function () {
            $("#content tbody tr").each(function (i, row) {
                var $actualRow = $(row);
                if ($actualRow.find('.state').text() == '未使用') {
                    $actualRow.find('td').css('background-color', 'lightcoral');
                }

            });
        });
    </script>
}
</code>
===== 参照 =====
  * [[http://blog.okazuki.jp/entry/2013/12/02/125321|ASP.NET MVCでページャーつきテーブルを表示する]]
  * [[http://surferonwww.info/BlogEngine/post/2010/09/10/Showing-multiple-tables-in-single-GridView.aspx|GridView に複数のテーブルを表示]]
  * [[http://www.mitechdev.com/2016/07/implementing-nested-webgrid-in-mvc5.html|Implementing Nested Web Grid in ASP.NET MVC5]]
  * [[http://www.dotnetawesome.com/2014/07/nested-webgrid-with-expand-collapse-in-aspnet-mvc4.html|How to Create Nested WebGrid with Expand/Collapse in ASP.NET MVC4.]]

Razor で #if DEBUG を使う
http://jirolabo.hatenablog.com/entry/2016/02/22/160232
http://stackoverflow.com/questions/4696175/razor-view-engine-how-to-enter-preprocessorif-debug

===== メモ =====
<code>
ビューヘルパー（リンク・エンコード）
http://aspmvc.tokumori-domain.com/view/linkviewhelper/
http://www.buildinsider.net/web/bookaspmvc5/040303

検証付きドロップダウンリストを実装する
http://miso-soup3.hateblo.jp/entry/2013/12/04/035934
http://www.atmarkit.co.jp/ait/articles/0904/10/news113_5.html

ASP.NET MVC で二重サブミットを防止したい
http://tnakamura.hatenablog.com/entry/2015/07/30/double-submit-protection

Show Ajax Loading Indicator when sorting or paging ASP.net MVC Webgrid
http://stackoverflow.com/questions/13004401/show-ajax-loading-indicator-when-sorting-or-paging-asp-net-mvc-webgrid

jQuery の ajax 処理で Now Loading の画像を表示する方法
https://jquery.nj-clucker.com/now-loading/

Displaying A Progress Indicator During JQuery Ajax Calls
http://www.binaryintellect.net/articles/1ec0ae5e-ff6e-4b59-8f16-3cb17ecda3cf.aspx
</code>