Skip to content

Commit

Permalink
adding dom option as per https://datatables.net/reference/option/dom …
Browse files Browse the repository at this point in the history 
…and allow separated rendering of html & script
  • Loading branch information
@ekondur
Alexandre Verdon authored and ekondur committed May 3, 2023
1 parent 43368a3 commit 3c60787
Show file tree
Hide file tree
Showing 6 changed files with 143 additions and 55 deletions.
1 change: 1 addition & 0 deletions DatatableJS.Net/Builders/GridBuilder.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ public class GridBuilder<T>
internal bool _processing { get; private set; } = true;
internal bool _scrollX { get; private set; }
internal bool _stateSave { get; set; }
internal string _dom { get; set; }

internal bool _selectEnable { get; private set; }
internal SelectStyle _selectStyle { get; private set; }
Expand Down
82 changes: 58 additions & 24 deletions DatatableJS.Net/JSHelper.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -70,6 +70,25 @@ private static string GetEnumDescription(this Enum enumValue)
/// <param name="grid"></param>
/// <returns></returns>
public static MvcHtmlString Render<T>(this GridBuilder<T> grid)
{
var html = RenderHtmlString(grid);
var script = RenderScriptString(grid);
return new MvcHtmlString(html+script);
}


public static MvcHtmlString RenderHtml<T>(this GridBuilder<T> grid)
{

return new MvcHtmlString(RenderHtmlString(grid));
}
public static MvcHtmlString RenderScript<T>(this GridBuilder<T> grid)
{

return new MvcHtmlString(RenderScriptString(grid));
}

private static string RenderHtmlString<T>(this GridBuilder<T> grid)
{
var tfoot = grid._columnSearching ?
$@"<tfoot>
Expand All @@ -81,6 +100,27 @@ public static MvcHtmlString Render<T>(this GridBuilder<T> grid)

var tfootInit = string.Empty;



var html = $@"
<table id=""{grid._name}"" class=""{grid._cssClass}"" style=""width:100%"">
<thead>
<tr>
{string.Join(Environment.NewLine, grid._columns.Select(a => string.Format("<th>{0}</th>", a.Title)))}
</tr>
</thead>
{tfoot}
</table>
";

return html;
}


private static string RenderScriptString<T>(this GridBuilder<T> grid)
{
var tfootInit = string.Empty;

var initFootSearch = grid._stateSave ?
$@"var dtable = $('#{grid._name}').DataTable();
var dState = dtable.state.loaded();
Expand Down Expand Up @@ -170,15 +210,7 @@ public static MvcHtmlString Render<T>(this GridBuilder<T> grid)
$"lengthMenu: {string.Format("[[{0}], [{1}]]", string.Join(", ", grid._lengthMenuValues), string.Join(", ", grid._lengthMenuDisplayedTexts.Select(a => string.Concat(@"""", a, @""""))))},"
;

var html = $@"
<table id=""{grid._name}"" class=""{grid._cssClass}"" style=""width:100%"">
<thead>
<tr>
{string.Join(Environment.NewLine, grid._columns.Select(a => string.Format("<th>{0}</th>", a.Title)))}
</tr>
</thead>
{tfoot}
</table>
var script = $@"
<script>
$(document).ready(function () {{
$('#{grid._name}').DataTable( {{
Expand All @@ -193,24 +225,25 @@ public static MvcHtmlString Render<T>(this GridBuilder<T> grid)
leftColumns: {grid._leftColumns},
rightColumns: {grid._rightColumns}
}},
order: [{(!grid._ordering ? string.Empty : string.Join(", ", grid._orders.Select(a => $@"[{ a.Column}, '{(a.OrderBy == OrderBy.Ascending ? "asc" : "desc")}']")))}],
order: [{(!grid._ordering ? string.Empty : string.Join(", ", grid._orders.Select(a => $@"[{a.Column}, '{(a.OrderBy == OrderBy.Ascending ? "asc" : "desc")}']")))}],
ordering: {grid._ordering.ToLowString()},
searching: {grid._searching.ToLowString()},
paging: {grid._paging.ToLowString()},
{(!string.IsNullOrEmpty(grid._dom) ? $"dom: '{grid._dom}'," : string.Empty)}
{lengthMenu}
{(!string.IsNullOrEmpty(grid._callBack.CreatedRow) ? $"createdRow: function (row, data, dataIndex, cells) {{ {grid._callBack.CreatedRow}(row, data, dataIndex, cells); }}," : string.Empty) }
{(!string.IsNullOrEmpty(grid._callBack.DrawCallback) ? $"drawCallback: function (settings) {{ {grid._callBack.DrawCallback}(settings); }}," : string.Empty) }
{(!string.IsNullOrEmpty(grid._callBack.FooterCallback) ? $"footerCallback: function (tfoot, data, start, end, display) {{ {grid._callBack.FooterCallback}(tfoot, data, start, end, display); }}," : string.Empty) }
{(!string.IsNullOrEmpty(grid._callBack.FormatNumber) ? $"formatNumber: function (toFormat) {{ {grid._callBack.FormatNumber}(toFormat); }}," : string.Empty) }
{(!string.IsNullOrEmpty(grid._callBack.HeaderCallback) ? $"headerCallback: function (thead, data, start, end, display) {{ {grid._callBack.HeaderCallback}(thead, data, start, end, display); }}," : string.Empty) }
{(!string.IsNullOrEmpty(grid._callBack.InfoCallback) ? $"infoCallback: function (settings, start, end, max, total, pre) {{ {grid._callBack.InfoCallback}(settings, start, end, max, total, pre); }}," : string.Empty) }
{(!string.IsNullOrEmpty(grid._callBack.PreDrawCallback) ? $"preDrawCallback: function (settings) {{ {grid._callBack.PreDrawCallback}(settings); }}," : string.Empty) }
{(!string.IsNullOrEmpty(grid._callBack.RowCallback) ? $"rowCallback: function (row, data, displayNum, displayIndex, dataIndex) {{ {grid._callBack.RowCallback}(row, data, displayNum, displayIndex, dataIndex); }}," : string.Empty) }
{(!string.IsNullOrEmpty(grid._callBack.StateLoadCallback) ? $"stateLoadCallback: function (settings, callback) {{ {grid._callBack.StateLoadCallback}(settings, callback); }}," : string.Empty) }
{(!string.IsNullOrEmpty(grid._callBack.StateLoadParams) ? $"stateLoadParams: function (settings, data) {{ {grid._callBack.StateLoadParams}(settings, data); }}," : string.Empty) }
{(!string.IsNullOrEmpty(grid._callBack.StateLoaded) ? $"stateLoaded: function (settings, data) {{ {grid._callBack.StateLoaded}(settings, data); }}," : string.Empty) }
{(!string.IsNullOrEmpty(grid._callBack.StateSaveCallback) ? $"stateSaveCallback: function (settings, data) {{ {grid._callBack.StateSaveCallback}(settings, data); }}," : string.Empty) }
{(!string.IsNullOrEmpty(grid._callBack.StateSaveParams) ? $"stateSaveParams: function (settings, data) {{ {grid._callBack.StateSaveParams}(settings, data); }}," : string.Empty) }
{(!string.IsNullOrEmpty(grid._callBack.CreatedRow) ? $"createdRow: function (row, data, dataIndex, cells) {{ {grid._callBack.CreatedRow}(row, data, dataIndex, cells); }}," : string.Empty)}
{(!string.IsNullOrEmpty(grid._callBack.DrawCallback) ? $"drawCallback: function (settings) {{ {grid._callBack.DrawCallback}(settings); }}," : string.Empty)}
{(!string.IsNullOrEmpty(grid._callBack.FooterCallback) ? $"footerCallback: function (tfoot, data, start, end, display) {{ {grid._callBack.FooterCallback}(tfoot, data, start, end, display); }}," : string.Empty)}
{(!string.IsNullOrEmpty(grid._callBack.FormatNumber) ? $"formatNumber: function (toFormat) {{ {grid._callBack.FormatNumber}(toFormat); }}," : string.Empty)}
{(!string.IsNullOrEmpty(grid._callBack.HeaderCallback) ? $"headerCallback: function (thead, data, start, end, display) {{ {grid._callBack.HeaderCallback}(thead, data, start, end, display); }}," : string.Empty)}
{(!string.IsNullOrEmpty(grid._callBack.InfoCallback) ? $"infoCallback: function (settings, start, end, max, total, pre) {{ {grid._callBack.InfoCallback}(settings, start, end, max, total, pre); }}," : string.Empty)}
{(!string.IsNullOrEmpty(grid._callBack.PreDrawCallback) ? $"preDrawCallback: function (settings) {{ {grid._callBack.PreDrawCallback}(settings); }}," : string.Empty)}
{(!string.IsNullOrEmpty(grid._callBack.RowCallback) ? $"rowCallback: function (row, data, displayNum, displayIndex, dataIndex) {{ {grid._callBack.RowCallback}(row, data, displayNum, displayIndex, dataIndex); }}," : string.Empty)}
{(!string.IsNullOrEmpty(grid._callBack.StateLoadCallback) ? $"stateLoadCallback: function (settings, callback) {{ {grid._callBack.StateLoadCallback}(settings, callback); }}," : string.Empty)}
{(!string.IsNullOrEmpty(grid._callBack.StateLoadParams) ? $"stateLoadParams: function (settings, data) {{ {grid._callBack.StateLoadParams}(settings, data); }}," : string.Empty)}
{(!string.IsNullOrEmpty(grid._callBack.StateLoaded) ? $"stateLoaded: function (settings, data) {{ {grid._callBack.StateLoaded}(settings, data); }}," : string.Empty)}
{(!string.IsNullOrEmpty(grid._callBack.StateSaveCallback) ? $"stateSaveCallback: function (settings, data) {{ {grid._callBack.StateSaveCallback}(settings, data); }}," : string.Empty)}
{(!string.IsNullOrEmpty(grid._callBack.StateSaveParams) ? $"stateSaveParams: function (settings, data) {{ {grid._callBack.StateSaveParams}(settings, data); }}," : string.Empty)}
{(!grid._pageLength.HasValue ? string.Empty : $"pageLength: {grid._pageLength.Value},")}
language: {{
url: '{grid._language.URL}',
Expand Down Expand Up @@ -259,7 +292,7 @@ public static MvcHtmlString Render<T>(this GridBuilder<T> grid)
{(string.IsNullOrEmpty(grid._captionBottom) ? string.Empty : string.Format("$('#{0}').append('<caption style=\"caption-side:bottom\">{1}</caption>');", grid._name, grid._captionBottom))}
</script>";

return new MvcHtmlString(html);
return script;
}

private static string GetDataStr<T>(this GridBuilder<T> grid)
Expand All @@ -273,3 +306,4 @@ private static string GetDataStr<T>(this GridBuilder<T> grid)
}
}
}

24 changes: 23 additions & 1 deletion DatatableJS/Builders/GridBuilder.cs
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
using System;
using Microsoft.AspNetCore.Mvc.Rendering;
using System;
using System.Collections.Generic;
using System.Linq;
using static System.Net.WebRequestMethods;

namespace DatatableJS
{
Expand Down Expand Up @@ -32,12 +34,14 @@ public class GridBuilder<T>
internal bool _processing { get; private set; } = true;
internal bool _scrollX { get; private set; }
internal bool _stateSave { get; set; }
internal string _dom { get; private set; }

internal bool _selectEnable { get; private set; }
internal SelectStyle _selectStyle { get; private set; }
internal SelectItems _selectItems { get; private set; }
internal bool _selectInfo { get; private set; }
internal bool _selectToggleable { get; private set; }
public IHtmlHelper HtmlHelper { get; }

internal List<ColumnDefinition> _columns = new List<ColumnDefinition>();
internal List<FilterModel> _filters = new List<FilterModel>();
Expand All @@ -47,6 +51,11 @@ public class GridBuilder<T>
internal LanguageModel _language = new LanguageModel();
internal ColReorderModel _colReorder = new ColReorderModel();

public GridBuilder(IHtmlHelper htmlHelper)
{
HtmlHelper = htmlHelper;
}

/// <summary>
/// Default name is "DataGrid".
/// </summary>
Expand Down Expand Up @@ -233,6 +242,19 @@ public GridBuilder<T> Data(string data)
return this;
}


/// <summary>
/// Dom allow to control position of datatable elements
/// </summary>
/// <see cref="https://datatables.net/reference/option/dom"/>
/// <param name="dom"></param>
/// <returns></returns>
public GridBuilder<T> Dom(string dom)
{
_dom = dom;
return this;
}

/// <summary>
/// Set css class of table.
/// </summary>
Expand Down
10 changes: 9 additions & 1 deletion DatatableJS/Helpers/GridHelper.cs
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
using Microsoft.AspNetCore.Razor.TagHelpers;
using static System.Net.WebRequestMethods;

namespace DatatableJS
{
Expand Down Expand Up @@ -38,6 +39,12 @@ public class GridHelper : TagHelper
/// </summary>
public bool StateSave { get; set; }

/// <summary>
/// Enable control over displayed elements
/// </summary>
/// <see cref="https://datatables.net/reference/option/dom"/>
public string Dom { get; set; }

/// <summary>
/// Process
/// </summary>
Expand All @@ -58,7 +65,8 @@ public override void Process(TagHelperContext context, TagHelperOutput output)
Searching = Searching,
Processing = Processing,
ScrollX = ScrollX,
StateSave = StateSave
StateSave = StateSave,
Dom = Dom
};

context.Items.Add("DataGrid", grid);
Expand Down
Loading

0 comments on commit 3c60787

Please sign in to comment.