jqueryのclick（）イベントを含むフォームからハイチャートを更新

同じページのフォームが送信されるたびに更新したいグラフがあります。 var chart = new Highcharts.Chart(options)式はそれ自身で正常に動作します（グラフが描画されます）。 .click()イベントのコールバック関数内に配置すると、対応する送信ボタンをクリックすると、更新されたプロットが画面上で1秒間点滅し、元のプロットが消去されて置き換えられます。jqueryのclick（）イベントを含むフォームからハイチャートを更新

私は私が必要とすることにとても近づいていますが、私はこれで困惑しています。ご協力いただきありがとうございます。

ライブラリ：ここ

<link type="text/css" href="css/cupertino/jquery-ui-1.8.16.custom.css" rel="stylesheet" />  
<script type="text/javascript" src="js/jquery-1.6.2.min.js"></script> 
<script type="text/javascript" src="js/jquery-ui-1.8.16.custom.min.js"></script> 
<script type="text/javascript" src="js/highcharts.js"></script>

はJavascriptである：ここでは

<script> 
    $(function() { 
$("#lines").val(),colors: $("#colors").val(),}, 
var options = { 
    chart : { 
     renderTo : 'container', 
     defaultSeriesType: 'line', 
     zoomType: 'xy' }, 
    title : { text : 'Foo' }, 
    xAxis: { title: { text: 'x label' } }, 
    yAxis: { title: { text: 'y label' } }, 
    series : {} 
} 
    var chart = new Highcharts.Chart(options); 
    $("#submit").click(function() { 
    options.series = [{"name": 10402, "color": "rgba(255,139,0,0.5)", "data": [[ 146,55.8 ],[150,60.9]]},{"name": 10403, "color": "rgba(255,255,0,0.5)", "data": [[ 130,25.8 ],[150,54.9]]}]; 
    var chart = new Highcharts.Chart(options); 
    }); 

    }); 
    </script>

は、HTMLのボディです：

<body> 
<form name="chartform" id="chartform"> 
<input type="submit" id="submit" /><br /> 
</form> 
<div id="container" style="width: 100%; height: 800px"></div> 
</body>

これは私にナットを駆動しています。

出典

2012-01-09 f1r3br4nd

は、これは私のために正常に動作している：

var chart; 
$(document).ready(function() { 
    options ={ 
     chart: { 
     renderTo: 'container', 
     defaultSeriesType: 'line', 
     zoomType: 'xy' 
     }, 
       title : { text : 'Foo' }, 
       xAxis: { title: { text: 'x label' } }, 
    yAxis: { title: { text: 'y label' } }, 

     series: {} 
       }; 

    chart = new Highcharts.Chart(options); 
    series3 = [{"name": 10402, "color": "rgba(255,139,0,0.5)", data: [[ 146,55.8 ],[150,60.9]]},{"name": 10403, "color": "rgba(255,255,0,0.5)", "data": [[ 130,25.8 ],[150,54.9]]}]; 
    series2 = [{ 
     name: '1042', 
     color: "rgba(255,139,0,0.5)", 
     data: [[ 146,55.8 ],[150,60.9]] 
     }, { 
     name: '10403', 
      color: "rgba(255,255,0,0.5)", 
     data: [[ 130,25.8 ],[150,54.9]] 
     }]; 
    $("#chartform").submit(function() { 
    options.series = series3; 
    var chart = new Highcharts.Chart(options); 
return false; 
    }); 


});

EDIT：私は問題はあなたがフォームを提出していることであると信じています。偽を返し、クリックの代わりにサブミットハンドラを使用します。あなたはそれが住んでいることを確認することができます：http://jsfiddle.net/bCFHL/157/

出典

2012-01-09 22:41:56 Nobita

私のフォーマットが間違っている場所が見つかりません。 – f1r3br4nd

@ f1r3br4ndあなたは正しいです。問題は別の部分にあった。私が更新したものはうまくいきます！ – Nobita

さて、私は最終的に私の走りを得ました。私が ''ボタンを '

jqueryのclick（）イベントを含むフォームからハイチャートを更新

答えて

関連する問題