We Keep Coding

Error: Undefined on get object attribute in Vue (Nuxt)

I have a 'region' object, and it is displayed normally, with all the attributes, but when I need to access some of its attributes, it says that it is 'undefined'.
const region = { "id": 7, "name": "Paraiba", "slug": "paraiba", "created_at": "2022-09-14T23:44:10.000000Z", "updated_at": "2022-09-14T23:44:10.000000Z" }
If I display {{ region }} it displays complete: { "id": 7, "name": "Paraíba", "slug": "paraiba", "created_at": "2022-09-14T23:44:10.000000Z ", "updated_at": "2022-09-14T23:44:10.000000Z" }
However, if I print {{ region.name }} it returns undefined.

As the call is via API, it is not loaded after, but before, but the property did not exist. Solved!
{{ region?.name }}

How to render nested JSON inside JSX in react native?

I want to list the json response. How do i render nested json inside my jsx?
following is json response
[{
"data": {
"total_students": 13,
"seats": "",
"categories": [{
"id": 28,
"name": "Economy",
"slug": "economy",
}],
"instructor": {
"id": "24",
"name": "Ad",
"sub": ""
},
"menu_order": 0
},
"headers": [],
"status": 200
}
This is how the response looks like. Also rendering in react is as shown below
return this.state.user.map(user =>
<CardSection>
<View style={styles.thumbnailContainerStyle}>
<Text key= {user.data.name} style={styles.userStyle}>{this.state.user.data}</Text>
</View>
</CardSection>
I have tried like the above but getting error in rendering part cannot define name of undefined.What wrong am i doing?please help

You don't have a key name in data object that undefined If you want to nested JSON you can access like
name in instructor : user.data.instructor.name
name in categories (array) : user.data.categories.map(category => category.name)

user.data.name does not seem to be present in your JSON response. The name could be user.data.instructor.name.

Custom parameters in Module_Json (Business Catalyst)

{Module_JSON} allow you to parse json files in Business Catalyst, however, there is NO documentation, or functionality to utilize the data using liquid. I tried talking to support, but they said that my questions were out of the support boundaries.
Here is what I would like to do: I would like to call specific items within an array via Json.
{
"description": "List of a collection of Doughnuts",
"doughnuts": [
{
"id": "5001",
"type": "Plain",
"price": 0
},
{
"id": "5002",
"type": "Glazed",
"price": 1
},
{
"id": "5005",
"type": "Sugar",
"price": 1
},
{
"id": "5007",
"type": "Powdered Sugar",
"price": 1.25
},
{
"id": "5006",
"type": "Chocolate with Sprinkles",
"price": 1.5
},
{
"id": "5003",
"type": "Chocolate",
"price": 2
},
{
"id": "5004",
"type": "Maple Syrup",
"price": 2.25
}
]
}
To parse the JSON you have to do this:
{module_json,json="/mrbean.json" template="/module_json/template.tpl"}
Let's say I would like to parse the plain donut, I would try and put the parameter right in the callback function like this:
{module_json,json="/mrbean.json" type="plain" template="/module_json/template.tpl"}
Nothing happens. Does anyone know how I can do this? Otherwise, I don't see why the Module_Json tag should be used. Should I just use Ajax instead?

There is a rather clear example here http://docs.businesscatalyst.com/Developers/liquid/render-your-own-JSON-files-using-module_json
If you need any help please post here.
Please include some more explanation in your question.
Do you have a template created?
Please post your template so I can check your syntax.
If your data rendered with json looks like this {
"description":"List of a collection of Products",
"products":[
{
"id":"SLI123",
"type":"Toy",
"price":20
},
{
"id":"SLI124",
"type":"Shirt",
"price":40
},
then you liquid rendering can be something like this
<div>{{this.description}}</div>
<ul> {%; for products in this.products %}
<li id={{product.id}} type={{product.type}}>
{%; if product.price == 20 %}
Price: Only ${{product.price}}!!!
{%; else %}
Price: ${{product.price}}
{%; endif %}
</li>
{%; endfor %}
</ul>

The tag makes no assumptions about how the json is structured. This allows it to load any valid json, but puts the onus on the caller to handle the data within.
In this case, you could use the collection parameter to assign it to a variable, like so:
{module_json,json="/mrbean.json" collection="food"}
{{ food.doughnuts[0].type }} <!-- Plain -->
(The same data is available within the named file, when using the template parameter.)
Otherwise, I don't see why the Module_Json tag should be used. Should I just use Ajax instead?
If it better suits your application to have the user make another round-trip after page load to see the data, then use ajax / fetch.
If the app should load with the data as quickly as possible, then module_json can insert the data into the first response.

Retaining the state of an object in JavaScript & convert it into text which can be passed as parameter(as object) to another function

We have a UI where user makes selection & click on process button. On click on button, system calls a method written in JavaScript and it returns a object which looks like this.
{
"users": [{
"id": 1,
"name": "Ed",
"orders": [{
"id": 10,
"total": 10.76,
"status": "invoiced"
},{
"id": 11,
"total": 13.45,
"status": "shipped"
}]
}]
}
What I want:
I want to pass this JavaScript object to a method which should generate a text producing output like this:
{
"users": [{
"id": 1,
"name": "Ed",
"orders": [{
"id": 10,
"total": 10.76,
"status": "invoiced"
},{
"id": 11,
"total": 13.45,
"status": "shipped"
}]
}]
}
I should be able to pass a real JavaScript object to this method and by going over the object it should produce a text showcasing the structure of this object.
In .net world we can do this by using reflection and then return the string. We also have option of serializing the object into XML or JSON or any other format.
Is it possible with JavaScript.
Why I want to do this.
I have written 50 test cases which expects this object as input. I can take output of the method and pass it to any testcase.
Thank you

You should add your stringified object to some <pre> and <code> tags to get the best output.
<div><pre><code class="text"></code></pre></div>
And then use the JSON.stringify spaces parameter:
$('.text').html(JSON.stringify(obj, null, 2));
You can also use tabs if you want.
$('.text').html(JSON.stringify(obj, null, '\t'));
Fiddle

Use JSON.stringify() method. It does exactly what you need.

How to access the data from return JSON from webservice in javascript or jquery

Hi i have a return json data which returns the webservice
The structure of webservice is like that:
jsonp1332655154667({"products": [{"uid": "37",
"samsid": "hjk",
"name": "Science%20Essentials%2010%20AC%20edn",
"shortname": "scienceessentials10",
"description": "Science%20Essentials%2010%20ACE%20is%20the%20fourth%20in%20a%20series%20of%20four%20books%20designed%20for%20the%20National%20Curriculum.%20",
"generated": "3/25/2012%205:59:19%20AM",
"Description": "Science%20Essentials%2010%20ACE%20is%20the%20fourth%20in%20a%20series%20of%20four%20books%20designed%20for%20the%20National%20Curriculum.%20",
"PublishingCompany": "Macmillan%20Australia",
"Service": "OneStopScience",
"Service": "OneStopDigital",
"Icon": "http://curriculumplatform.s3.amazonaws.com/prod/icons/brain48.png",
"Country": "Australia",
"Shortname": "scienceessentials10",
"MarketingSite": "http%3a%2f%2fwww.macmillan.com.au%2fsecondary%2fonix%2fall%2f6F597241EFC0E43DCA257791001CAFC0%3fopen%26div%3dSecondary%26cat%3dScience%253EAustralian%252BCurriculum%26template%3ddomSecondary%26ed%3dsite%2fseced31.nsf",
"Skin": "OneStopScience%20Green"},
"tag":"s_science"'
"tag":"s_maths"'
"tag":"s_arts",
{"uid": "5",}]})
I have three "tag" elements. but when we access the products.tag it gives always last element like:s_arts.
Is there any way to find out all the elements eg:s_science,s_maths,s_arts.
please help.

It is invalid json, your tag should be:
...,
"tag": ["s_science", "s_maths", "s_arts" ],
...
Then product.tag would be an array that you could access successfully
Regards

If you have multiple keys in the same object, you're going to get undefined behaviour. Only one will be preserved, and since pairs are not ordered, you can't guarantee which you'll get.
In short: the webservice is returning you faulty data. If multiple tags are expected, the service should return an array of values in the tag attribute:
...
"tag":["s_science", "s_maths", "s_arts"],
...

You need to send the tags as an array:
jsonp1332655154667({"products": [{"uid": "37",
"samsid": "hjk",
"name": "Science%20Essentials%2010%20AC%20edn",
"shortname": "scienceessentials10",
"description": "Science%20Essentials%2010%20ACE%20is%20the%20fourth%20in%20a%20series%20of%20four%20books%20designed%20for%20the%20National%20Curriculum.%20",
"generated": "3/25/2012%205:59:19%20AM",
"Description": "Science%20Essentials%2010%20ACE%20is%20the%20fourth%20in%20a%20series%20of%20four%20books%20designed%20for%20the%20National%20Curriculum.%20",
"PublishingCompany": "Macmillan%20Australia",
"Service": "OneStopScience",
"Service": "OneStopDigital",
"Icon": "http://curriculumplatform.s3.amazonaws.com/prod/icons/brain48.png",
"Country": "Australia",
"Shortname": "scienceessentials10",
"MarketingSite": "http%3a%2f%2fwww.macmillan.com.au%2fsecondary%2fonix%2fall%2f6F597241EFC0E43DCA257791001CAFC0%3fopen%26div%3dSecondary%26cat%3dScience%253EAustralian%252BCurriculum%26template%3ddomSecondary%26ed%3dsite%2fseced31.nsf",
"Skin": "OneStopScience%20Green"},
"tags": [
"s_science"'
"s_maths"'
"s_arts"
],
{"uid": "5",}]})
Then you reference them as data.tags[0], data.tags[1], data.tags[2].

if your response is in this format
YourResponse = {
"products" : [
{"uid" :"5", ......., "whtever":"someval"},
{"uid" :"6", ......., "whtever":"someval1"}
]
};
you can use this
$(YourResponse).each(
function(objName, objValue) {
console.log(objName); // wil get object name like uid, whtever
console.log(objValue); // wil get object's value
});
so to get Tags you will have to take Tuan's suggestion; send them in array