I have a grid with the excell Export. Now I have two custom Export buttons on the Page (Over and under the Grid).
Can I somehow trigger the Grid Excell Export command Manually?
---
ADMIN EDIT
Here is a workaround - a bit of JS to click the desired button and the second snippet shows how to invoke it from a blazor component and code.
<script>
function clickButton(selector) {
var btn = document.querySelector(selector);
if (btn && btn.click) {
btn.click();
}
}
</script>
@inject IJSRuntime _js
<style>
/* hide the built-in button if you like */
.myExcelExportButton {
display:none;
}
</style>
<button @onclick="@MyExternalExportTrigger">my external export button</button>
<TelerikGrid Data="@GridData" Pageable="true" Sortable="true" Resizable="true" Reorderable="true"
FilterMode="@GridFilterMode.FilterRow" Groupable="true"
Class="@GridClass">
<GridToolBar>
<GridCommandButton Class="@ExportBtnClass" Command="ExcelExport" Icon="@IconName.FileExcel">Export to Excel</GridCommandButton>
<label><TelerikCheckBox @bind-Value="@ExportAllPages" />Export All Pages</label>
</GridToolBar>
<GridExport>
<GridExcelExport FileName="telerik-grid-export" AllPages="@ExportAllPages" />
</GridExport>
<GridColumns>
<GridColumn Field="@nameof(SampleData.ProductId)" Title="ID" Width="100px" />
<GridColumn Field="@nameof(SampleData.ProductName)" Title="Product Name" Width="300px" />
<GridColumn Field="@nameof(SampleData.UnitsInStock)" Title="In stock" Width="100px" />
<GridColumn Field="@nameof(SampleData.Price)" Title="Unit Price" Width="200px" />
<GridColumn Field="@nameof(SampleData.Discontinued)" Title="Discontinued" Width="100px" />
<GridColumn Field="@nameof(SampleData.FirstReleaseDate)" Title="Release Date" Width="300px" />
</GridColumns>
</TelerikGrid>
@code {
// cascade through classes on the grid and/or on the built-in button to click it with JS
// so that it can invoke the built-in export operations
string GridClass { get; set; } = "MyGrid";
string ExportBtnClass { get; set; } = "myExcelExportButton";
async Task MyExternalExportTrigger()
{
var selector = $".{GridClass} .k-header .{ExportBtnClass}";
await _js.InvokeVoidAsync("clickButton", selector);
}
List<SampleData> GridData { get; set; }
bool ExportAllPages { get; set; }
protected override void OnInitialized()
{
GridData = Enumerable.Range(1, 100).Select(x => new SampleData
{
ProductId = x,
ProductName = $"Product {x}",
UnitsInStock = x * 2,
Price = 3.14159m * x,
Discontinued = x % 4 == 0,
FirstReleaseDate = DateTime.Now.AddDays(-x)
}).ToList();
}
public class SampleData
{
public int ProductId { get; set; }
public string ProductName { get; set; }
public int UnitsInStock { get; set; }
public decimal Price { get; set; }
public bool Discontinued { get; set; }
public DateTime FirstReleaseDate { get; set; }
}
}
---