1

I have a JSON Array like: 

[{
  "name": "abc", "month":"Jan-15","value":xyz
},{
  "name": "bcd", "month":"Jan-15","value":xyz
},{
  "name": "abc", "month":"Feb-15","value":xyz
},{
  "name": "bcd", "month":"Feb-15","value":xyz
}]

No. of "names" may vary from month to month. But no. of "month" stays the same.

I need to create tabular overview: 

Name   Jan-15   Feb- 15 ...... Dec-15
abc    value     value  .....  value
bcd    value     value  .....   value

I'm new to Javascript and I really don't know how to get values in right columns and rows. Though I know how to dynamically add rows. Shall I opted for "pure" solution or is better to check for a framework like e.g. AngularJS ?

Edit: I have extracted "Months" and "Names" from array and I need to do something like: value = check for this particular "name" in array and return corresponding "value".

How do I write this in JS?

Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
KwabenaOwusu
  • 25
  • 5
  • If it's just for one table, angular seems overkill. If you'll use angular for other code as well, it's a nice framework. For just this one table, you can use array.filter and array.map to get your array into the correct format. – Shilly Jun 24 '15 at 16:11
  • jQuery may be helpful if you have a `table` element and want to populate it with the data, to render the data, but you should be able to restructure and access your data using raw JS. As above, loading an entire library for one small piece of functionality is overkill. If you need the library generally, cool, otherwise you can often just use the library's source to figure out how it does it, and implement your own thing locally. – Carl Smith Jun 24 '15 at 16:17

1 Answers1

0

It depends on the form of your data object. If you have an array object or a string object you need to use JSON.parse in order to be able to use indices and values. If yes, then you will need to have JSON.parse(data).name to return your name values. JSON.parse(data).month for your months and of course JSON.parse(data).value to return the xyz values. If your data is already a JSON object then you will simply use data.name, data.month and data.value accordingly. These links might help you get into the basics, follow the syntax and the examples. http://www.w3schools.com/js/js_json.asp http://www.w3schools.com/json/json_eval.asp http://www.json.org/js.html and https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse

CookieMonster
  • 216
  • 3
  • 13
  • Thanks very much. I will check those links – KwabenaOwusu Jun 24 '15 at 16:47
  • Hi Guys, thanks very much. But those links didn't help me much. Mostly nothing new. No hints for me to solve this issue ? Thanks – KwabenaOwusu Jun 25 '15 at 06:30
  • Can you provide a fiddle for what exactly you need? Is there a specific framework you are using? Where and how exactly is your JSON initialized? Also how exactly do you want your tabular overview to be? It looks like you have multiple values under each month, however your JSON file has one value for each month. – CookieMonster Jun 25 '15 at 07:02
  • Thanks for taking your time to go through my question. – KwabenaOwusu Jun 25 '15 at 09:45
  • Thanks for taking your time to go through my question. I use plain JS ( no Framework) to fetch data from a MS Access database using SQL. Results are then output as JSON string or javascript objects. Data structure is very easy: It is like a monthly sales overview. E.g. in Jan-15 we sold 10 apples, 10 oranges, 15 cars etc. In Feb : 2 Apples, 5 bikes , 20 shoes etc. As you have noticed, article names, no. of articles and corresponding no. of sales may vary. I need to present this data in a tabular overview as shown above in my initial post. Regards – KwabenaOwusu Jun 25 '15 at 09:57
  • What kind of request and method do you use to fetch your data with? Ajax? Post/Get? – CookieMonster Jun 25 '15 at 10:49
  • I'm not using AJAX. This is a pure client side only application using JS, MS Access database. No server. Data is fetched from MS Access data via JS. E.g. var SQL_query = "SELECT xx from TABLE where xy = myx. "myx" is a value obtained from a select box. Currently the whole process is completed in MS Excel but due to some limitations in Excel I need to use a proper database. Using a server is not an option. I need to create the same 2-dimensional table in Excel with html. I know html and CSS very good but I'm limited when it comes to JS. Thanks – KwabenaOwusu Jun 25 '15 at 11:27
  • You can use an ajax request to fetch local JSON which can simply be in the same folder with your HTML as well, then parse it with a function and get the content. If you are not allowed to do that you can use jQuery and use $.getJSON. if you are not allowed to use jQuery either, then maybe you could try something like that http://stackoverflow.com/questions/9838812/how-can-i-open-a-json-file-in-javascript-without-jquery – CookieMonster Jun 25 '15 at 11:54
  • Thanks mate. I don't have any problem with fetching JSON data. I'm just looking for a solution on how to display data in correct tabular order. – KwabenaOwusu Jun 25 '15 at 12:12