|
<SfGrid ID="Grid" @ref="Grid" AllowPaging="true" DataSource="@Orders" ShowColumnChooser="true" Toolbar="@ToolbarItems">
<GridColumnChooserSettings>
<Template>
@{
var
ContextData = context as ColumnChooserTemplateContext;
<Counter @key="ContextData.Columns.Count" ValueChanged="OnChange" ColumnContext="ContextData"></Counter>
}
</Template>
<FooterTemplate>
@{
var
ContextData = context as ColumnChooserFooterTemplateContext;
}
<SfButton @onclick="@(async ()
=> await ContextData.CancelAsync())">Abort</SfButton>
</FooterTemplate>
</GridColumnChooserSettings>
<GridColumns>
. . . . . .. .
</GridColumns>
</SfGrid>
public async void
OnChange(List<string> VisibleCols, List<string>
HiddenCols)
{
await
Grid.ShowColumnsAsync(VisibleCols.ToArray(), "Field");
await
Grid.HideColumnsAsync(HiddenCols.ToArray(), "Field");
}
[Counter.razor]
<div class="setMargin">
<SfTextBox Placeholder="Search" Input="@OnInput"></SfTextBox>
</div>
<SfListBox @ref="ListBox" TValue="string[]" DataSource="@CloneData" TItem="DataModel">
<ListBoxFieldSettings GroupBy="Type" Text="Text" Value="Id"
/>
<ListBoxSelectionSettings ShowCheckbox="true" ShowSelectAll="true"></ListBoxSelectionSettings>
<ListBoxEvents ValueChange="ValueChange" TValue="string[]" TItem="DataModel"></ListBoxEvents>
</SfListBox>
<style>
.setMargin {
margin-bottom: 10px;
}
</style>
@code
{
. . . . . .. . . .
async Task
OnInput(InputEventArgs eventArgs)
{
CloneData =
DataSource.FindAll(e =>
e.Text.ToLower().StartsWith(eventArgs.Value.ToLower()));
await Task.Delay(100);
await
Preselect();
}
protected override async Task
OnInitializedAsync()
{
CloneData = DataSource;
await Task.Delay(100);
await Preselect();
}
List<DataModel>
DataSource = new List<DataModel>
{
new DataModel() { Text = "Order
ID", Id = "OrderID", Type ="Order
Details" },
new DataModel() { Text = "Customer
ID", Id ="CustomerID", Type ="Customer
Details"},
new DataModel() { Text = "Employee
ID", Id = "EmployeeID" , Type ="Product
Details"},
new DataModel() { Text = "First
Name", Id = "FirstName" , Type ="Customer
Details"},
new DataModel() { Text = "Order
Date", Id = "OrderDate" , Type ="Order
Details"},
new DataModel() { Text = "Last
Name", Id = "LastName" , Type ="Customer
Details"},
new DataModel() { Text = "Hire
Date", Id = "HireDate", Type ="Product
Details"},
new DataModel() { Text = "Title", Id = "Title", Type ="Order
Details"},
new DataModel() { Text = "Freight", Id = "Freight", Type ="Order
Details"},
};
public async Task
Preselect()
{
var cols = ColumnContext.Columns.FindAll(x
=> x.Visible == true).ToList();
var selectlist = new List<DataModel>();
foreach (var column in cols)
{
selectlist.Add(DataSource.Where(x => x.Text == column.HeaderText).FirstOrDefault());
}
if
(selectlist.Count > 0)
{
if
(ListBox != null)
{
await
ListBox.SelectItemsAsync(selectlist.AsEnumerable());
}
}
}
public async Task
OnCreated(List<GridColumn> args)
{
await Preselect();
}
public async Task
ValueChange(ListBoxChangeEventArgs<string[], DataModel> args)
{
List<string> VisibleColumn = new List<string>();
List<string> HiddenColumn = new List<string>();
var columnHeader = DataSource.Select(x =>
x.Id).ToList();
foreach (var col in columnHeader)
{
if
(((IList)(args.Value)).Contains(col))
{
VisibleColumn.Add(col);
}
else
{
HiddenColumn.Add(col);
}
}
ValueChanged.Invoke(VisibleColumn,
HiddenColumn);
}
|
