Client-Side Events
The Bootstrap Sparkline control provides several client-side events fired at different moments of the control's life cycle. Use the checkboxes below to specify which events should be added to the log.
<dx:BootstrapSparkline ID="SparklineCilentSideEvents" ClientInstanceName="SparklineCilentSideEvents" runat="server" ArgumentField="date" ValueField="sales" DataSourceUrl="~/jsondata/simple.json">
<ClientSideEvents Drawn="onDrawn" Init="onInit" TooltipHidden="onTooltipHidden" TooltipShown="onTooltipShown" />
</dx:BootstrapSparkline>
<demo:EventMonitor runat="server" EventNames="TooltipShown TooltipHidden Init Drawn"
ControlID="SparklineCilentSideEvents" />
function onDrawn(s, e) {
dxbsDemo.eventMonitor.trace(s, e, 'Drawn');
}
function onInit(s, e) {
dxbsDemo.eventMonitor.trace(s, e, 'Init');
}
function onTooltipHidden(s, e) {
dxbsDemo.eventMonitor.trace(s, e, 'TooltipHidden');
}
function onTooltipShown(s, e) {
dxbsDemo.eventMonitor.trace(s, e, 'TooltipShown');
}
Exporting API
You can export and print the Sparkline control using the client-side ExportTo and Print methods. The following export formats are supported:
The following client-side events are fired during the export process:
- Exporting - Fires before sparkline data is exported.
- Exported - Fires after sparkline data has been exported.
- FileSaving - Fires before a file with exported data is saved on the user's local storage.
<dx:BootstrapButton runat="server" ClientSideEvents-Click="exportSparkline" Text="Export Sparkline" UseSubmitBehavior="false" AutoPostBack="false"></dx:BootstrapButton>
<dx:BootstrapButton runat="server" ClientSideEvents-Click="printSparkline" Text="Print Sparkline" UseSubmitBehavior="false" AutoPostBack="false"></dx:BootstrapButton>
<dx:BootstrapSparkline ID="ClientSideMethodsSparkline" ClientInstanceName="ClientSideMethodsSparkline" runat="server" ArgumentField="date" ValueField="sales" DataSourceUrl="~/jsondata/simple.json">
<ClientSideEvents Exported="onExported" Exporting="onExporting" FileSaving="onFileSaving" />
</dx:BootstrapSparkline>
<demo:EventMonitor runat="server" EventNames="Exporting Exported FileSaving"
ControlID="ClientSideMethodsSparkline" />
function onExported(s, e) {
dxbsDemo.eventMonitor.trace(s, e, 'Exported');
}
function onExporting(s, e) {
dxbsDemo.eventMonitor.trace(s, e, 'Exporting');
}
function onFileSaving(s, e) {
dxbsDemo.eventMonitor.trace(s, e, 'FileSaving');
}
function exportSparkline() {
ClientSideMethodsSparkline.ExportTo("Sparkline", "PNG");
}
function printSparkline() {
ClientSideMethodsSparkline.Print();
}