new widget samples

this would provide highchart data based on value selected.

by bhupendra negi

HTML

<script src="http://code.highcharts.com/stock/highstock.js"></script>
<script src="http://code.highcharts.com/stock/modules/exporting.js"></script>
<div id = "selApp">
  <select id = "drpApp">
      <option value="MSFT" selected>Dsx Client Care </option>
      <option value="AAPL">3Dx University </option>
      <option value="GOOG">Dsx Client Order </option>
      </select> 
</div>   
<div id="container" style="height: 400px; min-width: 310px"></div>

JavaScript

$(function (){
    $("#drpApp").on("change",function(e) {loadGraph(e.target.value);});    
    //for initial loading
    var selvalue = $("#drpApp").val();
    loadGraph(selvalue);
});


function loadGraph(val)
{
    console.log(val);
    var txt = $("#drpApp option:selected").text();
    
 $.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=' + val.toLowerCase() + '-c.json&callback=?', function (data) {
        // Create the chart
        $('#container').highcharts('StockChart', {


            rangeSelector : {
                selected : 1
            },

            title : {
                text : txt
            },

            series : [{
                name : val,
                data : data,
                tooltip: {
                    valueDecimals: 2
                }
            }]
        });
    });
}