jQuery Forum

how to enable drawing multiple lines on highstock basic-line graph?
[2Replies]
- 29-May-2014 03:22 AM
- Forum: Using jQuery Plugins
I want to draw multiple line for this type of graph of your library :http://www.highcharts.com/stock/demo/basic-line
I found this sample on internet: http://jsfiddle.net/yildirim_timur/Hb3Q7/
Below you can see my html file. I tried to do couple of things but couldn't make it. How can i make my chart to be able to draw multiple lines as well? (it is for an ipad app project)
1. <!DOCTYPE html>
2. <html>
3. <head>
4. <meta http-equiv="content-type" content="text/html; charset=UTF-8">
5. <title>Senior Project Timur Aykut YILDIRIM - IH Technology</title>
6. <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script>
7. <link rel="stylesheet" type="text/css" href="/Users/ihtechnology/Desktop/chart_deneme/css/normalize.css">
8. <link rel="stylesheet" type="text/css" href="/Users/ihtechnology/Desktop/chart_deneme/css/result-light.css">
9. <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet"/>
10. <script type='text/javascript'>
11. var serviceDataURL = "http://78.46.106.130:83/get_item_data_ios?generic=";
13. function setDictionary(x){
14. return x;
15. } // no need for this method
17. var dict = "{\"line_ids\":[],\"measure\":\"1\",\"db_name\":\"NPI\",\"timeoffset\":433112400000,\"show_total\":true}";
19. $(function() {
20. $.getJSON(serviceDataURL.concat(dict), function(data) {
21. // Create the chart
22. window.chart = new Highcharts.StockChart({
23. chart : {
24. renderTo : 'container'
25. },
26. navigation: {
27. buttonOptions: {
28. enabled: false,
29. width: 60
30. }
31. },
32. rangeSelector : {
33. buttonSpacing: 20,
34. buttonTheme: { // styles for Q,Y,YTD,ALL buttons
35. fill: 'none',
36. stroke: 'none',
37. 'stroke-width': 15,
38. style: {
39. color: '#039',
40. fontWeight: 'bold'
41. },
42. states: {
43. hover: {},
44. select: {
45. fill: '#039',
46. style: {
47. color: 'white'
48. }
49. }
50. }
51. },
52. selected : 3, // 3=ALL buton at first
53. inputDateFormat: '%Y-%m-%d',
54. inputEditDateFormat: '%Y-%m-%d',
55. buttons:[
56. {
57. type: 'month',
58. count: 3,
59. text: 'QQ'
60. },
62. {
63. type: 'year',
64. count: 1,
65. text: 'YY'
66. },
68. {
69. type: 'ytd',
70. text: 'YTD'
71. },
73. {
74. type: 'all',
75. text: 'ALL'
76. },
77. ]
78. },
79. title : {
80. text : 'My Total Market'
81. },
82. credits: {
83. text: " ",
84. href: " ",
85. },
86. series : [{
87. name : 'Total Market',
88. data : arr,
89. tooltip: {
90. valueDecimals: 2
91. }
92. }],
93. exporting: {
94. enabled: false
95. }
96. }, function(chart){
97. // apply the date pickers
98. setTimeout(function(){
99. $('input.highcharts-range-selector').attr('readonly',1); // burda webviewı engelledik
100. $('input.highcharts-range-selector', $('#'+chart.options.chart.renderTo))
101. },0)
102. });
103. });
105. });
107. //]]>
108. </script>
109. </head>
110. <body>
111. <div id="container" style="height: 500px; min-width: 500px;"></div>
112. <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
113. <script src="http://code.highcharts.com/stock/highstock.js"></script>
114. <script src="http://code.highcharts.com/stock/modules/exporting.js"></script>
115. </body>
116. </html>

how to get whole JSON data from webservice at once?
[4Replies]
- 24-Apr-2014 06:39 AM
- Forum: Using jQuery
I'm trying to get JSON data from my webservice to display it in a data grid editor (developed with jquery) called Handsontable ( http://handsontable.com/ )

Basically my JSON looks like this:
1. [
2. ["", "2012", "2013", "2014(YTD)"],
3. ["Ferrari", 1460089088.3900001, 1637243070.99, 283566771.55000001],
4. ["Alfa Romeo", 1199141138.1900001, 1224624821.1500001, 192307335.49000001],
5. ]
What i want to do is passing the whole json from webservice to initialize the variable called myData in my html file at once. I mean without using loops etc - the simples way since i'm very inexperienced in jQuery and i'm little bit confused after all those different things i read on the internet.

Below you can download and/or see my html code:
1. <!DOCTYPE html>
2. <html>
3. <head>
4. <meta http-equiv="content-type" content="text/html; charset=UTF-8">
5. <link rel="stylesheet" type="text/css" href="/css/result-light.css">
7. <script src="http://warpech.github.io/jquery-handsontable/lib/jquery.min.js"></script>
8. <script src="http://warpech.github.io/jquery-handsontable/dist/jquery.handsontable.full.js"></script>
9. <link rel="stylesheet" media="screen" href="http://warpech.github.io/jquery-handsontable/dist/jquery.handsontable.full.css">
10. <link rel="stylesheet" media="screen" href="http://warpech.github.io/jquery-handsontable/demo/css/samples.css?20140401">
12. <style type="text/css">
13. body {background: white; margin: 20px;}
14. h2 {margin: 20px 0;}
15. </style>
17. <script type='text/javascript'>
18. $(document).ready(function () {
19. var myData = ( [
20. ["", "2012", "2013", "2014(YTD)"],
21. ["Ferrari", 1460089088.3900001, 1637243070.99, 283566771.55000001],
22. ["Alfa Romeo", 1199138.1900001, 1224821.1500001, 1923335.49000001],
23. ]);
25. $('#myTable').handsontable({
26. data: myData,
27. minSpareRows: 1,
28. //colHeaders: true,
29. contextMenu: true,
30. readOnly: true,
31. fixedColumnsLeft: 1
32. });
33. });
34. </script>
35. </head>
37. <body>
38. <div id="myTable" class="handsontable" style="width: 400px; margin-left:auto; margin-right:auto; background-color:silver"></div>
39. </body>
40. </html>
Attachments
- demo.html.zip
  
  Size: 1.48 KB Downloads: 943

How can i record generated jQuery form into xml file?
[6Replies]
- 06-Jun-2012 01:45 PM
- Forum: Using jQuery
Hi, I've managed to make some sort of form which generates exam by jquery. And now i want to publish it. I'm using jsp. Is it possible to record my generated exam form into an xml file, and read it from server when user wants to take that exam, it will look as an exam form? If it is, how can i do it? Can you give me some examples?

Thanks in advance :)
Timur

treeview plugin doesn't work when i move it to another html file
[2Replies]
- 26-Mar-2012 05:57 AM
- Forum: Using jQuery Plugins
Hi,

i'm trying to make a simple webpage with jQuery, html and css. And i downloaded a treeview plugin which is developed with jQuery that helps me to display hierarchic view. When i downloaded the treeview plugin, it works fine in the html file that came inside the plugin's folder. But when i tried to move the codes into my own file, it doesn't work. i don't have much experience with jQuery or etc. But i will be appriciated if you point the problem. i installed my own page and treeview plugin to following addresses.

Thanks in advance.
Timur

my html file: http://student.cankaya.edu.tr/~c0711058/problem/urun-001.htm

treeview plugin's directory: http://student.cankaya.edu.tr/~c0711058/problem/jquery.treeview/

treeview plugin's sample html file: http://student.cankaya.edu.tr/~c0711058/problem/jquery.treeview/demo/prerendered.html

Changing attributes of clonned html table and radiobutton
[4Replies]
- 08-Feb-2012 08:26 AM
- Forum: Getting Started
Hi,
I'm new with JavaScript and jQuery. I clonned below html table with this jQuery script:
1. $("#table1").clone().appendTo("#div1");
1. <div id="div1">
2. <table border="1" id="table1">
3. <tr>
4. <td colspan="5">Question text will be here</td>
5. </tr>
6. <tr>
7. <td><input type="radio" id="A" name="ans" />answer1 <br /></td>
8. <td><input type="radio" id="B" name="ans" />answer2 <br /></td>
9. <td><input type="radio" id="C" name="ans" />answer3 <br /></td>
10. <td><input type="radio" id="D" name="ans" />answer4 <br /></td>
11. <td><input type="radio" id="E" name="ans" />answer5 <br /></td>
12. </tr>
13. </table>
15. <table border="1" id="table1">
16. <tr>
17. <td colspan="5">Question text will be here</td>
18. </tr>
19. <tr>
20. <td><input type="radio" id="A" name="ans" />answer1 <br /></td>
21. <td><input type="radio" id="B" name="ans" />answer2 <br /></td>
22. <td><input type="radio" id="C" name="ans" />answer3 <br /></td>
23. <td><input type="radio" id="D" name="ans" />answer4 <br /></td>
24. <td><input type="radio" id="E" name="ans" />answer5 <br /></td>
25. </tr>
26. </table>
27. </div>
And now, I'm trying to is, changing id of clonned tables and clonned radiobuttons. I need to change clonned tables id properties, otherwise i can't select them on following steps of my project. And i also need to change name property of all radiobuttons, because i can only select one radiobutton on browser when it's like this.

I've read the documentation about the .attr() api over this page: http://api.jquery.com/attr/ . So I know how to change the attributes of an html element with jQuery, but i don't know, how to change these attributes of clonned html elements dynamically.

Can you help me with this please?

Response title

Attachments

jQuery Forum

Activity Trend