Dashboard for Web Forms - How to Obtain Underlying Data for a Clicked Visual Element in a Custom Item
This example shows how to obtain underlying data in a custom dashboard item when a user clicks the item's visual element. The custom item is based on the dashboard-extension-funnel-d3-item. The DashboardControl's API is used to get underlying data and display it in the dxPopup DevExtreme UI component:
FunnelD3ItemViewer.prototype._showUnderlyingData = function (arguments) { if(!this.viewerApiExtension) return; var clientData = this.viewerApiExtension.getItemData(this.getName()); var columns = clientData.getDataMembers(); var requestParameters = { dataMembers: columns, uniqueValuesByAxisName: { "Default": arguments } }; this.viewerApiExtension.requestUnderlyingData(this.getName(), requestParameters, function (data) { var underlyingData = []; dataMembers = data.getDataMembers(); for (var i = 0; i < data.getRowCount() ; i++) { var dataTableRow = {}; dataMembers.forEach(function(dataMember) { dataTableRow[dataMember] = data.getRowValue(i, dataMember); }); underlyingData.push(dataTableRow); } new dxPopup(document.getElementById('myPopup'), { height: 800, showTitle: true, title: "Underlying Data", visible: true, contentTemplate: function () { var div = document.createElement('div'); new dxDataGrid(div, { height: 800, scrolling: { mode: 'virtual' }, dataSource: underlyingData }); return div; } }); }); }- Default.aspx (VB: Default.aspx)
- Default.aspx.cs (VB: Default.aspx.vb)
- funnel.js (VB: funnel.js)
- ASP.NET Web Forms Dashboard Control - Client-Side API Overview
- Obtain Underlying and Displayed Data in ASP.NET Web Forms Dashboard Control
- Create a Custom Item
- Extensions Overview
- ViewerApiExtension
- Dashboard for Web Forms - How to show underlying data in a custom grid dashboard item
- Dashboard for Web Forms - How to get data from a clicked dashboard item
- Dashboard for Web Forms - How to obtain a dashboard item's underlying data for a clicked visual element
- Dashboard for Web Forms - How to obtain underlying data for the specified dashboard item
- Dashboard for ASP.NET Core - How to obtain a dashboard item's client data
- Dashboard for ASP.NET Core - How to obtain a dashboard item's underlying data for a clicked visual element
- Dashboard for ASP.NET Core - How to obtain underlying data for the specified dashboard item
- Dashboard for MVC - How to obtain a dashboard item's client data
- Dashboard for MVC - How to obtain underlying data for the specified dashboard item
- Dashboard for MVC - How to obtain a dashboard item's underlying data for a clicked visual element
(you will be redirected to DevExpress.com to submit your response)