Add json string to a javascript object

Hi,

I have a data control that is filled with data from a javascript object like the following:
var chartDataSales = [{
            "date": "2016-09-01",
            "sales": 4252,
            "budget": 2800
        },
        {
            "date": "2016-09-02",
            "sales": 1500,
            "budget": 2200
        },
        {
            "date": "2016-09-03",
            "sales": 2300,
            "budget": 2200
        },
        {
            "date": "2016-09-04",
            "sales": 1700,
            "budget": 2200
        },
        {
            "date": "2016-09-05",
            "sales": 0,
            "budget": 2200
        },
        {
            "date": "2016-09-06",
            "sales": 1500,
            "budget": 1500
        },
        {
            "date": "2016-09-07",
            "sales": 0,
            "budget": 1600
        },
        {
            "date": "2016-09-08",
            "sales": 1800,
            "budget": 1600
        },
        {
            "date": "2016-09-09",
            "sales": 0,
            "budget": 1600
        },
        {
            "date": "2016-09-10",
            "sales": 1500,
            "budget": 3200
        },
        {
            "date": "2016-09-11",
            "sales": 3800,
            "budget": 2000
        },
        {
            "date": "2016-09-12",
            "sales": 0,
            "budget": 1500
        },
        {
            "date": "2016-09-13",
            "sales": 0,
            "budget": 1500
        },
        {
            "date": "2016-09-14",
            "sales": 1500,
            "budget": 1600
        },
        {
            "date": "2016-09-15",
            "sales": 2200,
            "budget": 3200
        },
        {
            "date": "2016-09-16",
            "sales": 1500,
            "budget": 3200
        },
        {
            "date": "2016-09-17",
            "sales": 0,
            "budget": 3200
        },
        {
            "date": "2016-09-18",
            "sales": 0,
            "budget": 3200
        },
        {
            "date": "2016-09-19",
            "sales": 0,
            "budget": 3200
        },
        {
            "date": "2016-09-20",
            "sales": 0,
            "budget": 3200
        },
        {
            "date": "2016-09-21",
            "sales": 0,
            "budget": 3200
        },
        {
            "date": "2016-09-22",
            "sales": 0,
            "budget": 3200
        },
        {
            "date": "2016-09-23",
            "sales": 0,
            "budget": 3200
        },
        {
            "date": "2016-09-24",
            "sales": 0,
            "budget": 3200
        },
        {
            "date": "2016-09-25",
            "sales": 0,
            "budget": 3200
        },
        {
            "date": "2016-09-26",
            "sales": 0,
            "budget": 3200
        },
        {
            "date": "2016-09-27",
            "sales": 0,
            "budget": 3200
        },
        {
            "date": "2016-09-28",
            "sales": 0,
            "budget": 3200
        },
        {
            "date": "2016-09-29",
            "sales": 0,
            "budget": 3200
        },
        {
            "date": "2016-09-30",
            "sales": 0,
            "budget": 3500
        }];

Open in new window


As you can see it's just usual json code. Now I need to get data from a sql database instead of using static data. In order to do that I've created this function:
Public Function ConvertDataTabletoString() As String
        Dim dt As New DataTable()
        Dim sql As New StringBuilder
        sql.AppendLine("SELECT CONVERT(NVARCHAR(10), o.orderDate, 121) AS date, SUM(o.OrderTotal) AS sales, apc.salesBudget FROM dbo.Orders AS o  ")
        sql.AppendLine("INNER JOIN dbo.aspnet_ProfileCustomized AS apc ON apc.sellerID = o.sellerID ")
        sql.AppendLine("WHERE o.saved = 1 AND apc.sellerID = 264 AND MONTH(o.orderDate) = 9 AND YEAR(o.orderDate) = 2016 ")
        sql.AppendLine("GROUP BY o.orderDate, apc.salesBudget ")

        Using con As New SqlConnection(config.ConnectionString)
            Using cmd As New SqlCommand(sql.ToString, con)
                con.Open()
                Dim da As New SqlDataAdapter(cmd)
                da.Fill(dt)
                Dim serializer As New System.Web.Script.Serialization.JavaScriptSerializer()
                Dim rows As New List(Of Dictionary(Of String, Object))()
                Dim row As Dictionary(Of String, Object)
                For Each dr As DataRow In dt.Rows
                    row = New Dictionary(Of String, Object)()
                    For Each col As DataColumn In dt.Columns
                        row.Add(col.ColumnName, dr(col))
                    Next
                    rows.Add(row)
                Next
                Return serializer.Serialize(rows)
            End Using
        End Using
    End Function

Open in new window


This is now stored in a string but I need to get the json data stored in this string to be stored in the chartDataSales javascript object in the same format as shown above.

Is there a for me to accomplish that?

Thanks for help!

Peter
Peter NordbergIT ManagerAsked:
Who is Participating?

Improve company productivity with a Business Account.Sign Up

x
 
Kyle HamiltonConnect With a Mentor Data ScientistCommented:
to turn the json string into a javascript object (not jquery object) see my first comment.

str = outputOfQuery

jsObject = JSON.parse(str)

thats the first step.

the second step is to combine your original js object with the new object jsObject you just created. see my last comment
0
 
Kyle HamiltonData ScientistCommented:
you can use javascript's builtin function JSON.parse(string)

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse

you will now have two js objects which you can merge as desired. if you need help merging please provide some sample output from your query as well as the desired result
0
 
Kyle HamiltonData ScientistCommented:
oh, i missed that it's the same format.
if you are uding any js libraries, like jquery, some will have an extend function that you can use to merge the objects. or you can write your own. have a look at Object.assign()
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign
0
Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

 
Peter NordbergIT ManagerAuthor Commented:
Hi and thanks for answer,

To complicated for me to solve with jquery object. The vb function returns json code, it's just stored in a string and I don't know how to get it in to the chartDataSales .

Peter
0
 
Julian HansenCommented:
Does the function run when the page is generated or is it an AJAX call?

If you are generating the page then you don't need to do anything except output the string - just put the "var chartDataSales = " on the front of it and terminate it with a ";" - as long as the output appears inside <script> tags it will be valid JavaScript.

If you are doing an AJAX call using JQuery then jQuery will convert it for you.
0
 
Peter NordbergIT ManagerAuthor Commented:
Hi,

I've now tried the approach to load the data into a hiddenfield and take its value and fill chartDataSales with it.

You can see the process in the three images below:

The string gets fille from the datatable output, but have double quotes.The string gets the output from the datatable.

I replace the double quotes with one single quote.I replace the double quotes with single.

I check so that the value fills the variable when the script is loading on page load.The data is shown in the variable when javascript loads with the page.

Still it won't fill the chart. Can anyone see the error I'm doing and how to correct it?

Peter
0
 
Julian HansenCommented:
Your original JSON had date, sales, budget the above has date, sales, salesBudget
0
 
Peter NordbergIT ManagerAuthor Commented:
Yes, I changed from budget to salesBudget because that were the database fields. It works if I past it directly like this:

var chartDataSales = [{ 'date': '2016-09-05', 'sales': 11875.0000, 'salesBudget': 60000.0000 }, { 'date': '2016-09-10', 'sales': 11875.0000, 'salesBudget': 60000.0000 }, { 'date': '2016-09-15', 'sales': 9375.0000, 'salesBudget': 60000.0000 }];
0
 
Kyle HamiltonData ScientistCommented:
your variable value is a string. you need to convert it to a json object as per the very first post in response to your question. have you tried this yet?
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.