I have a graph that is properly generated when the page loads. That code is:
<body>
<div id="placeholder" style="width:800px;height:400px;"></div>
<script type="text/javascript">
$(function () {
$.plot($("#placeholder"),
[ { data: %s } ],
{ xaxes: [ { mode: 'time' } ],
yaxes: [ ] })
});
</script>
Which works fine. I have a button that executes jquery and makes a request to get a new json data structure. I’ve validated that the json being returned is indeed proper json. I’m attempting to graph the result with:
<script type="text/javascript">
$(function() {
$("#button").click( function()
{
//alert('button clicked');
$.ajax({
url: '/graph',
type: 'POST',
dataType: 'html',
data: {
start_date: $('#start_date').val(),
end_date : $('#end_date').val(),
ticker : $('#ticker').val()
},
success: function(result) {
var placeholder = $("#placeholder");
$.plot(placeholder,
[ { data: result } ],
{ xaxes: [ { mode: 'time' } ],
yaxes: [ ] });
}
});
}
);
});
Which redraws the graph, but it’s empty and the y-axes is the default -1.0 through 1.0 and the x-axes is a single time entry of 00:00:00.
I’ve tried to use the setData() and draw() method calls but they don’t fix the issue.
There are no javascript errors being thrown as shown by firebug.
So, what am I doing wrong?
TIA!
Are you sure the response is valid? Your dataType is ‘html’, so unless you’re doing something with a script tag, then the response is just a string. If you’re returning JSON directly, then you need to use dataType ‘json’.