How To filter Data Table on Click on High Charts Graph Data
In my previous post you have seen how to trigger click event on Google charts and HighCharts.In this post i will show you how to filter data in data table base on high chart click event
HighCharts Click Event Code:
series: {
cursor: 'pointer',
point: {
events: {
click: function () {
alert('Category: ' + this.series.name +', Type: '+this.category+ ', value: ' +this.y);
tableFilter(this.series.name,this.category,this.y);
}
}
}
}
cursor: 'pointer',
point: {
events: {
click: function () {
alert('Category: ' + this.series.name +', Type: '+this.category+ ', value: ' +this.y);
tableFilter(this.series.name,this.category,this.y);
}
}
}
}
Function to filter data based on Click event:
function tableFilter(status,category,value){
alert(status+" "+category+" "+value)
var oTable = $('#example').DataTable()
oTable.search( '' ).columns().search( '' ) .draw();
var cate
cate = category
alert(status)
oTable.columns(0).search(status).draw();//here we have to provide column index and search string
oTable.columns(1).search(cate).draw();
}
alert(status+" "+category+" "+value)
var oTable = $('#example').DataTable()
oTable.search( '' ).columns().search( '' ) .draw();
var cate
cate = category
alert(status)
oTable.columns(0).search(status).draw();//here we have to provide column index and search string
oTable.columns(1).search(cate).draw();
}
You can go through sample code in my JS fiddle:
No comments:
Post a Comment