かずきのBlog@hatena

すきな言語は C# + XAML の組み合わせ。Azure Functions も好き。最近は Go 言語勉強中。日本マイクロソフトで働いていますが、ここに書いていることは個人的なメモなので会社の公式見解ではありません。

Ignite UIを使ってみたんだけれど

大変だった。

  • C:\Program Files (x86)\Infragistics\2015.1\Ignite UI\MVC\MVC5\Binのdllを参照に追加する
  • C:\Program Files (x86)\Infragistics\2015.1\Ignite UIのjs, cssフォルダをプロジェクトにコピーする
  • cssとjsを以下のような感じでページに取り込む(jquery uiがいる)
<link href="~/Content/Site.css" rel="stylesheet" type="text/css" />
<link href="~/css/structure/infragistics.css" rel="stylesheet" />
<link href="~/Content/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="~/css/themes/bootstrap/infragistics.theme.css" rel="stylesheet" />
<script src="~/Scripts/modernizr-2.6.2.js"></script>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/jquery-ui-1.11.4.min.js"></script>
<script src="~/Scripts/bootstrap.min.js"></script>
<script src="~/js/infragistics.core.js"></script>
<script src="~/js/infragistics.dv.js"></script>
<script src="~/js/infragistics.lob.js"></script>

あとはヘルプを見ながら頑張って使うだけ。

@using Infragistics.Web.Mvc
@model IQueryable<IngniteEdu.Controllers.Person>
@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>

<div class="row">
    <div class="col-md-12">
        @(Html.Infragistics()
            .Grid<IngniteEdu.Controllers.Person>()
            .ID("igGrid")
            .Height("400px")
            .AutoGenerateColumns(false)
            .Columns(column =>
            {
                column.For(x => x.Name).HeaderText("名前");
                column.For(x => x.Age).HeaderText("年齢");
            })
            .DataSource(this.Model)
            .DataBind()
            .Render())
    </div>
</div>

課題

JavaScriptの動的ロードがうまくいかない…。何故じゃ…。