MVC.Datalist installation

Install MVC.Datalist package from nuget.

> Install-Package Datalist

Render datalist dialog's partial in the page.

<html>
    <body>
+       @Html.Partial("MvcDatalist/_Dialog")

        @RenderBody()
    </body>
</html>

Include datalist stylesheet to your page.

<html>
    <head>
+       <link href="~/Content/MvcDatalist/mvc-datalist.css" rel="stylesheet">
    </head>
    <body>
        @Html.Partial("MvcDatalist/_Dialog")

        @RenderBody()
    </body>
</html>

Include datalist scripts to your page.

<html>
    <head>
        <link href="~/Content/MvcDatalist/mvc-datalist.css" rel="stylesheet">
    </head>
    <body>
        @Html.Partial("MvcDatalist/_Dialog")

        @RenderBody()

+       <script src="~/Scripts/MvcDatalist/mvc-datalist.js"></script>
    </body>
</html>

Initialize MVC.Datalist instances after rendering datalist html

<html>
    <head>
        <link href="~/Content/MvcDatalist/mvc-datalist.css" rel="stylesheet">
    </head>
    <body>
        @Html.Partial("MvcDatalist/_Dialog")

        @RenderBody()

        <script src="~/Scripts/MvcDatalist/mvc-datalist.js"></script>
        <script>
+           [].forEach.call(document.getElementsByClassName('datalist'), function(element) {
+               new MvcDatalist(element);
+           });
        </script>
    </body>
</html>