Jqplot Conflict With Jquerymobile
in a same html page i need to use jquerymobile (www.jquerymobile.com) and plot a simple chart with the jqplot js library (www.jqplot.com). I think i have a conflict issue between j
Solution 1:
Is a common issue, the workaround it´s buggy...
Don´t use document ready with jquerymobile, use pageInit()
In jquery forum found this thread, its works with static data but i never make it work jqplot with a json call on jquerymobile.
http://forum.jquery.com/topic/ajax-problem-jquery-mobile-with-jqplot
Good luck!
Solution 2:
Am loving jqplot, to use with jqmobile try this try this:
<script>
$('#thirdpage').live('pageshow', function() {
$.jqplot('chart1', [[[1, 4],[3,7.10],[5,6],[7,3],[9,95.9],[121,416]]]);
});
</script><!-- Page Three --><sectionid="thirdpage"data-role="page"><headerdata-role="header"><h1>Charts</h1></header><divdata-role="content"><ahref="#firstpage"id="firstpage">PageOne</a><ahref="#secondpagepage"id="secondpage">Page2</a><divid="chart1"style="height:300px; width:500px;"></div></div></section>Solution 3:
There is an easier way (worked in my case):
-first: delare your plot container div outside of any page (for example just below body tag):
<body><divid="plotContainer"></div>
...
-then: set the plot (Chart) in your $(document).ready(function(){ ... here ... }); and hide it so it will not show between pages:
$("#jqxChart").jqxChart(settings);
$("#jqxChart").hide();
-finaly: just copy the div with the plot inside your page:
<script>
$('#page_ID').bind('pageshow', function(data) {
$("#jqxChart").appendTo("#ID_of_DIV_you_want");
$("#jqxChart").show();
$('#jqxChart').jqxChart('refresh');
});
</script>Hope this helps!!!
Post a Comment for "Jqplot Conflict With Jquerymobile"