Skip to content

Commit fffac91

Browse files
eyesnzeyesnz
committed
Provide example of using initial search values
1 parent ca6b8a4 commit fffac91

File tree

4 files changed

+141
-3
lines changed

4 files changed

+141
-3
lines changed

‎Mvc.JQuery.Datatables.Example/Controllers/HomeController.cs‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,11 @@ public ActionResult Index()
1616
return View();
1717
}
1818

19+
public ActionResult InitialSearch()
20+
{
21+
return View();
22+
}
23+
1924
public ActionResult JSUnitTests()
2025
{
2126
return View();

‎Mvc.JQuery.Datatables.Example/Mvc.JQuery.Datatables.Example.csproj‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -22,9 +22,9 @@
2222
</UpgradeBackupLocation>
2323
<OldToolsVersion>4.0</OldToolsVersion>
2424
<IISExpressSSLPort />
25-
<IISExpressAnonymousAuthentication />
26-
<IISExpressWindowsAuthentication />
27-
<IISExpressUseClassicPipelineMode />
25+
<IISExpressAnonymousAuthentication>enabled</IISExpressAnonymousAuthentication>
26+
<IISExpressWindowsAuthentication>enabled</IISExpressWindowsAuthentication>
27+
<IISExpressUseClassicPipelineMode>false</IISExpressUseClassicPipelineMode>
2828
<SolutionDir Condition="$(SolutionDir) == '' Or $(SolutionDir) == '*Undefined*'">..\</SolutionDir>
2929
<RestorePackages>true</RestorePackages>
3030
<MvcProjectUpgradeChecked>true</MvcProjectUpgradeChecked>
@@ -581,6 +581,8 @@
581581
<Content Include="Scripts\MicrosoftMvcValidation.debug.js" />
582582
<Content Include="Views\Home\JSUnitTests.cshtml" />
583583
<Content Include="Views\Home\_ExampleTable.cshtml" />
584+
<Content Include="Views\Home\InitialSearch.cshtml" />
585+
<Content Include="Views\Home\_ExampleTableInitialSearch.cshtml" />
584586
</ItemGroup>
585587
<ItemGroup>
586588
<Folder Include="Models\" />

‎Mvc.JQuery.Datatables.Example/Views/Home/InitialSearch.cshtml‎

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
@{
2+
ViewBag.Title = "Mvc.Jquery.Datatables";
3+
}
4+
5+
<script type="text/javascript" src="http://balupton.github.com/jquery-syntaxhighlighter/scripts/jquery.syntaxhighlighter.min.js"></script>
6+
<script type="text/javascript"> $.SyntaxHighlighter.init();</script>
7+
8+
<h1>Strongly typed datatable example</h1>
9+
<pre>
10+
Nuget install-package Mvc.JQuery.Datatables
11+
12+
Nuget install-package <a href="https://github.com/mcintyre321/EmbeddedResourceVirtualPathProvider">EmbeddedResourceVirtualPathProvider</a> <i>or</i> Nuget install-package Mvc.JQuery.Datatables.Templates
13+
14+
</pre>
15+
<p>
16+
Create a controller (see <a style="color: dodgerblue;" href="https://github.com/mcintyre321/mvc.jquery.datatables/blob/master/Mvc.JQuery.Datatables.Example/Controllers/HomeController.cs">example</a>)
17+
</p>
18+
<pre class="highlight">
19+
public class SomeController : Controller
20+
{
21+
...
22+
public DataTablesResult&lt;UserView> GetUsers(DataTablesParam dataTableParam)
23+
{
24+
IQueryable&lt;User> users = ... //take a queryable from your database...
25+
var userViews = users.Select(u => new UserView(u)); //...transform it into a view object ...
26+
return DataTablesResult.Create(userViews, dataTableParam) //...and return a DataTablesResult
27+
}
28+
}
29+
</pre>
30+
31+
<p>
32+
and render the partial (see <a href="https://github.com/mcintyre321/mvc.jquery.datatables/blob/master/Mvc.JQuery.Datatables.Example/Views/Home/Index.cshtml">example</a>)
33+
34+
<pre class="highlight">
35+
//include these scripts
36+
&lt;link type="text/css" href="@@Url.Content("~/Content/DataTables-1.8.2/media/css/demo_table.css")" rel="stylesheet"/>
37+
&lt;script src="@@Url.Content("~/Scripts/DataTables-1.8.2/media/js/jquery.dataTables.js")" type="text/javascript">&lt;/script>
38+
39+
@@Html.Partial("DataTable", Html.DataTableVm("table-id", (HomeController h) => h.GetUsers(null)))
40+
41+
</pre>
42+
</p>
43+
44+
<h1>Voila!</h1>
45+
<div style="padding: 5px; border: 1px solid grey">
46+
Custom placement for Position filter:
47+
<div id="custom-filter-placeholder-position"></div>
48+
Custom placement for hidden Salary filter:
49+
<div id="custom-filter-placeholder-salary"></div>
50+
</div>
51+
52+
@Html.Partial("_ExampleTableInitialSearch")
53+
<br />
54+
55+
<div>
56+
@if (Request.QueryString["lang"] != "de")
57+
{
58+
<a href="?lang=de#language-switch" id="language-switch">See table with Language settings applied</a>
59+
}
60+
else
61+
{
62+
<a href="/#language-switch" id="language-switch">Turn off language settings</a>
63+
}
64+
</div>
65+
66+

‎Mvc.JQuery.Datatables.Example/Views/Home/_ExampleTableInitialSearch.cshtml‎

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
@using Mvc.JQuery.Datatables
2+
@using Mvc.JQuery.Datatables.Example.Controllers
3+
@using Mvc.JQuery.Datatables.Models
4+
@using Mvc.JQuery.Datatables.Serialization
5+
6+
7+
<script type="text/javascript" src="//cdn.datatables.net/1.10.0/js/jquery.dataTables.js"></script>
8+
<link rel="stylesheet" href="//cdn.datatables.net/1.10.0/css/jquery.dataTables.css" />
9+
<!-- table tools (csv export etc) https://datatables.net/extensions/tabletools -->
10+
<script type="text/javascript" src="//cdn.datatables.net/tabletools/2.2.1/js/dataTables.tableTools.min.js"></script>
11+
<link rel="stylesheet" href="//cdn.datatables.net/tabletools/2.2.1/css/dataTables.tableTools.css" />
12+
13+
<script type="text/javascript" src="/Content/jquery.dataTables.columnFilter.js"></script>
14+
15+
16+
17+
@{
18+
var vm = Html.DataTableVm("table-id", (HomeController h) => h.GetUsers(null));
19+
//vm.JsOptions.Add("iDisplayLength", 25);
20+
//vm.JsOptions.Add("aLengthMenu", new object[] { new[] {5, 10, 25, 250, -1} , new object[] { 5, 10, 25, 250, "All"} });
21+
22+
vm.JsOptions.Add("fnCreatedRow", new Raw(@"function( nRow, aData, iDataIndex ) {
23+
$(nRow).attr('data-id', aData[0]);
24+
}"));
25+
vm.ColumnFilter = true;
26+
vm
27+
.FilterOn("Position", new { sSelector = "#custom-filter-placeholder-position" }, new { sSearch = "Tester" }).Select("Engineer", "Tester", "Manager")
28+
.FilterOn("Id", null, new { sSearch = "2~4", bEscapeRegex = false }).NumberRange()
29+
.FilterOn("IsAdmin", null, new { sSearch = "False" }).Select("True","False")
30+
.FilterOn("Salary", new { sSelector = "#custom-filter-placeholder-salary" }, new { sSearch = "1000~100000" }).NumberRange();
31+
//.FilterOn("Number").CheckBoxes(Enum.GetNames(typeof(Numbers)));
32+
vm.StateSave = false;
33+
//vm.DrawCallback = "drawCallback";
34+
35+
if (Request.QueryString["lang"] == "de")
36+
{
37+
//vm.Language = "{ 'sUrl': '" + Url.Content("~/Content/jquery.dataTables.lang.de-DE.txt") + "' }";
38+
vm.Language = new Language
39+
{
40+
sProcessing = "Bitte warten...",
41+
sLengthMenu = "_MENU_ Einträge anzeigen",
42+
sZeroRecords = "Keine Einträge vorhanden.",
43+
sInfo = "_START_ bis _END_ von _TOTAL_ Einträgen",
44+
sInfoEmpty = "0 bis 0 von 0 Einträgen",
45+
sInfoFiltered = "(gefiltert von _MAX_ Einträgen)",
46+
sInfoPostFix = "",
47+
sSearch = "Suchen",
48+
sUrl = "",
49+
oPaginate = new Paginate()
50+
{
51+
sFirst = "Erster",
52+
sPrevious = "Zurück",
53+
sNext = "Weiter",
54+
sLast = "Letzter"
55+
}
56+
}.ToJsonString();
57+
}
58+
}
59+
60+
<script type="text/javascript">
61+
function encloseInEmTag(data, type, full) {
62+
return '<em>' + data + '</em>';
63+
}
64+
</script>
65+
@Html.Partial("DataTable", vm)

0 commit comments

Comments
 (0)