I have a form, that I need to get the values from:

var formConfig = JSON.stringify($("#bookingform").serializeArray());

which returns below:

[{"name":"client_id","value":"1"},{"name":"consignee_id","value":""},{"name":"client","value":"DAKO"},{"name":"model","value":"2"},{"name":"type","value":"2"},{"name":"temperatur","value":"2"},{"name":"shipper_labels","value":"1"},{"name":"batteri_labels","value":"1"},{"name":"batteri_number","value":"2222"},{"name":"pickup","value":"April 27, 2017 18:25"},{"name":"intern_marks","value":"fdsfads"},{"name":"extern_marks","value":"sadsfdsf"},{"name":"consignee","value":""},{"name":"marks","value":""}]

I then need to access above values from the JSON string, which I am using this function to:

var confirmBooking = function(element, setting, correct, notcorrect) {
    $('.confirm-booking')
    .find(element)
    .html(setting === 1 ? correct : notcorrect);
};

The thought is, I can use above function:

confirmBooking('.config_batteri', formConfig.client_id, "Yes", "No");

and so on..

formConfig.client_id should return 1, since that's the value in the JSON string above.

However it returns undefined:

console.log(formConfig.client_id); // Returns "undefined"

I have a form, that I need to get the values from:

var formConfig = JSON.stringify($("#bookingform").serializeArray());

which returns below:

[{"name":"client_id","value":"1"},{"name":"consignee_id","value":""},{"name":"client","value":"DAKO"},{"name":"model","value":"2"},{"name":"type","value":"2"},{"name":"temperatur","value":"2"},{"name":"shipper_labels","value":"1"},{"name":"batteri_labels","value":"1"},{"name":"batteri_number","value":"2222"},{"name":"pickup","value":"April 27, 2017 18:25"},{"name":"intern_marks","value":"fdsfads"},{"name":"extern_marks","value":"sadsfdsf"},{"name":"consignee","value":""},{"name":"marks","value":""}]

I then need to access above values from the JSON string, which I am using this function to:

var confirmBooking = function(element, setting, correct, notcorrect) {
    $('.confirm-booking')
    .find(element)
    .html(setting === 1 ? correct : notcorrect);
};

The thought is, I can use above function:

confirmBooking('.config_batteri', formConfig.client_id, "Yes", "No");

and so on..

formConfig.client_id should return 1, since that's the value in the JSON string above.

However it returns undefined:

console.log(formConfig.client_id); // Returns "undefined"

• javascript
• jquery
• json

5 Answers 5

You need to use JSON.parse(), to make it a regular JavaScript object again.

What JSON.stringify() does is, as the name implies, make it a string. That is just a regular string, that represents JSON data. It doesn't magically have the JSON data properties.

Furthermore serializeArray() returns an array of {name: ..., value: ...} objects. If you didn't turn it into a JSON string, the result still could not easily be accessed by doing formConfig.client_id. You'd have to loop through the formConfig array, to find the desired name/value pair.

From the looks of it, you don't need to turn the JavaScript object into JSON at all, if you are just going to use it in the same script (unless you are going to send the JSON string somewhere else perhaps).

Based on OP's ments, I'm assuming OP just want to access a particular form element's value. Using jQuery, this can easily be acplished with:

// get the value of the client_id element (assuming it's an input element)
var client_id = $( '#bookingform input[name="client_id"]' ).val();
// call the function
confirmBooking( '.config_batteri', client_id, "Yes", "No" );

If you want to have an object with all the form values, have a look at the answers in this question.

Do this:

var jsonStr = '[{"name":"client_id","value":"1"},
                {"name":"consignee_id","value":""},
                {"name":"client","value":"DAKO"},
                {"name":"model","value":"2"},
                {"name":"type","value":"2"},
                {"name":"temperatur","value":"2"},
                {"name":"shipper_labels","value":"1"},
                {"name":"batteri_labels","value":"1"},
                {"name":"batteri_number","value":"2222"},
                {"name":"pickup","value":"April 27, 2017 18:25"},
                {"name":"intern_marks","value":"fdsfads"},
                {"name":"extern_marks","value":"sadsfdsf"},
                {"name":"consignee","value":""},
                {"name":"marks","value":""}]';

var obj = JSON.parse(jsonStr);
var val = obj[0].value;

The reason you can't do obj[0].name is because your parsed JSON object has a collection of objects, where the first object has this structure:

{
    name:"client_id",
    value:"1"
}

So, you have to access it using obj[0].value NOT obj[0].name as it would give you client_id.

I think that's what you want.

console.log(formConfig.confirmBooking);

would change of syntax help? please try

console.log(formConfig[0]['client_id']);

I hope it works for you

Since it's an array of objects, you target the first element which returns an object and then use the "value" property to get the actual value of 1 which you expected .

Also use parseInt("1") to get 1 as a type "number"

Hope this solves the issue ! Let me no ASAP

== EDIT

var formConfig = [{
    "name": "client_id",
    "value": "1"
}, {
    "name": "consignee_id",
    "value": ""
}, {
    "name": "client",
    "value": "DAKO"
}];

// This function returns the value for the name
function search(str) {

    for (var obj of formConfig) {
        if (obj.name == str) {
            return obj.value;
        }
    }
}

search("client_id"); // 1
search("client"); // DAKO