score:3
Accepted answer
you want the "change" event on the select list, not the click event. (based on your fiddle code)
<select id="list">
<option value="a">data set a</option>
<option value="b">data set b</option>
<option value="c">data set c</option>
<option value="d">data set d</option>
</select>
$("#list").change(function(){
//... do stuff
var selval = $(this).val();
if(selval == "a" || selval == ''){
options.series = [{name: 'a', data: [1,2,3,2,1]}]
} else if(selval == "b"){
options.series = [{name: 'b', data: [3,2,1,2,3]}]
} else if(selval == "c"){
options.series = [{name: 'c', data: [5,4,8,7,6]}]
} else {
options.series = [{name: 'd', data: [4,7,9,6,2]}]
}
var chart = new highcharts.chart(options);
});
score:2
working demo http://jsfiddle.net/wdcl4/ or http://jsfiddle.net/gunax/3/ using $(this)
api used: http://api.jquery.com/change/
please note for jquery 1.4.4 use $("#list").change(function(){...});
http://jsfiddle.net/gunax/2/
jquery 1.7... could use $("#list").on('change', function(){...});
hope this helps!
code
$("#list").on('change', function(){
//alert('f')
var selval = $("#list").val();
if(selval == "a" || selval == '')
{
options.series = [{name: 'a', data: [1,2,3,2,1]}]
}
else if(selval == "b")
{
options.series = [{name: 'b', data: [3,2,1,2,3]}]
}
else if(selval == "c")
{
options.series = [{name: 'c', data: [5,4,8,7,6]}]
}
else
{
options.series = [{name: 'd', data: [4,7,9,6,2]}]
}
var chart = new highcharts.chart(options);
});
Source: stackoverflow.com
Related Query
- Treat option as click event on select drop-down list
- Fire click event on a highchart column drilldown chart on clicking x axis for drill down reports
- I am using click event to trigger a new page to generate the drill down data from highcharts however the entire chart is being generated
- Highmaps drill down map select event
- Highcharts - Double click event
- Highcharts chart click event fired on click of the reset zoom button (bug?)
- programmatically trigger click event in svg rect element
- Highcharts : Chart with drilldown how to obtain click event of drill up button
- Click event on clicking on the graph
- highcharts how to catch and insert logic in click reset zoom button event
- highmaps get country name on click event
- In high chart how to add event for label click
- programatically fire a click event for a point on highchart scatter plot
- How to pass custom data into Highcharts graph click event
- Get X Axis value on bar Highchart click event
- Click event not fire in highcharts tooltip
- HighStock HighCharts Setting Flag on Click Event
- How to call typescript function inside High chart click event
- Click event on highchart axis
- HighCharts: Mouse click event is handled by both Series handler and Point handler
- Highchart heatmap: select all cells on click of button or checkbox
- adding click event dynamically created highchart
- HiChart click event 1st time it's working but when I update the data then click event is not working
- HighCharts: How to Determine on Click Event what Data Grouping the Chart is Currently In?
- Click event on bar high charts in angular 2
- How to catch the click event from the axis ticks jqplot, highcharts,flot
- How to attach click event function in Highcharts
- highcharts change rendered image source on click
- HighChart : plot line click event for multiple chart
- Highcharts : How do I keep the marker formatting and make the click event fire with a 5K+ point scatter plot?
More Query from same tag
- How to get series marker symbol when displaying shared tooltips?
- Highchart contextmenu export black screen when stylemode
- highcharts with more series that start from different x value
- Date and time wrong on Highstock chart
- Highcharts line style change
- Highcharts Grouped Data In Subgroup
- Spiderweb Highcharts with multiple scales on multiple axes
- AngularJS ng-repeat freezes browser while HighCharts render
- Ruby on Rails: How to generate an array from records to display in Highcharts?
- SyntaxError: illegal character when posting array to data attribute of highcharts
- Highstock show avegrage values of selected Area
- How to remove fine white line between halo and Highcharts pie chart
- Highcharts tooltip shows tooltip date in milliseconds
- How to send other variables in x-axis of ReactHighCharts?
- Getting all colors from a div with jQuery/JS
- 'ManyToOneRel' object has no attribute 'parent_model' error with django chartit
- Highcharts - Adding a point with addPoint stretches time
- highmaps stopped updating after move to .NET Core
- High charts and expression language issue - Syntax error on token "{" expected
- How to find the width of single cell in xaxis ? ( Refer screenshot )
- Getting the corresponding x-axis value from the max value in y-axis in Highcharts
- Why does GeoJSON map looks stretched in Highmaps for WSG84?
- Highcharts using Django-Chartit. Chart lines not displayed without window resize, or Inspect Element
- Is it possible to render a linear gradient in highcharts that has multiple stops?
- Incorrect JSON data format
- Creating hyperlink on the highcharts stacked bar chat
- Highcharts - Format overlapping scatter points in a shared tooltip
- Use single color for all series in the same chart
- How to use high charts in Angular?
- The last label on xaxis disappears partly in Highcharts