I am trying to format a date field in KendoUI Grid where the field is coming as an object:
"callStart":{"date":"2014-01-24 12:04:36","timezone_type":3,"timezone":"Europe\/Berlin"}
I have tried:
{ field: "callStart", title: "Fecha", width: "100px", format: "{0:yyyy-MM-dd}" }
but still showing:
[object Object]
Any idea?
Thanks!
Don't know if you already solved it, but I'll answer late anyways. The reason why it's not working is because you are probably trying to bind the entire object callStart into the field column. The field expects only a date object, but you are not giving it one.
Also, your object seems to still be in JSON string format, you need to parse the object out as a first step (if it really is just raw JSON). Then the next step, you can:
Parse callStart on the columns themselves (with kendo Templates)
Parse callStart on the datasource itself through its schema
Option 1: Parse on the column field itself using a template
{
field: "callStart",
title: "Fecha",
width: "100px",
template: "#= kendo.toString(kendo.parseDate(callStart.date, 'yyyy-MM-dd HH:mm:ss'), 'MM/dd/yyyy') #"
}
The advantage of this option is that your data source object still maintains its original form, but filtering and sorting may get a bit tricky.
Option 2: Parse the object through the dataSource schema
var gridDS = new kendo.data.DataSource({
data: result,
schema: {
parse: function (result) {
for (var i = 0; i < result.length; i++) {
var resultItem = result[i];
resultItem.callStart = kendo.parseDate(result[i].callStart.date, 'yyyy-MM-dd HH:mm:ss');
}
return result;
}
},
//etc...
});
Each data source object goes through the parse function and you can do whatever processing you need to do to turn it into a JS date or kendo Date object. The advantage is that you can control the exact type for that column and makes filtering/sorting easier.
You'll probably have to do some tweaking to get your desired output, but these are the general options you need to pick from.
Related
When I writing my JSON data to HTML tag it's writing but don't write object. It's write [object Object]:
○Data1 ○wash dishes ○[object Object]
○find some break ○[object Object]
I'm trying to do lists with pointing JSON database but it's looks like that. I'm calling my JSON with that code:
var db_note = objpick(data);
db_note.date.forEach(function(element) {
tabledatednote.insertAdjacentHTML( 'beforeend',"<li>" + element + " </li>");
/* I just writed to this part because is just changing "no_date.>date<" part while displaying other JSONs */
});
objpick.js is an external file
function objpick(data){
for(i in data){ var result = data[i] }
return result
};
and there is my JSON database
{
"nodate": ["wash dishes", "find some bread"],
"date": [{"01/01/2077" : "Cyberpunk Meet"}, {"25/05/2005" : "Buney?"}],
"bookmark" : ["Data1"]
}
Ultimately what's being displayed is a string. So the code converts whatever you want to display to a string. For simple values, this conversion is easy. It's consistent and obvious what the resulting string is for a single value.
But objects are not simple values. They are potentially complex. And unless otherwise defined on your object(s), the default string representation for an object is: [object Object]
Some of the things you are display are values:
"find some bread"
But some of them are objects:
{"25/05/2005" : "Buney?"}
For the objects, you'd need to tell the code how to display it. Some options I can think of are:
Manually. For example, check if a certain property exists on the object and, if it does, display that property's value.
JSON-encode the object and display the resulting JSON string.
Override .toString() on your object(s).
Which you choose is up to you, and for the same reason that you're seeing the current default behavior... Because only you know how you want/expect that object to be displayed.
I am trying to make the simple line-graph from d3.js example work with JSON instead of a CSV file.
d3.csv(filePath,
// When reading the csv, I must format variables:
d => {
return {date: d3.timeParse("%Y-%m-%d")(d.date), value: d.value}
}).then(
// Now I can use this dataset:
function (data) {
data = JSON.parse(JSON.stringify(data));
....
It fails with an error: d3.v6.js:1816 Error: attribute d: Expected number, "MNaN,
For the graph code, see: https://www.d3-graph-gallery.com/graph/line_basic.html
How do I make it work with the JSON format ?
If you have json data you'll need to use d3.json. While the primary difference between the two is one parses delimited text with column headers, the other parses JSON. A second subtle but in this case key difference is that d3.csv can be provided a row function that formats data row by row, in this case the function the parses the date. We can achieve the equivalent outcome this with d3.json, but we need to wait until after we load the data:
d3.json("data.json").then(function(data) {
data = data.map(function(d) { return { date : d3.timeParse("%Y-%m-%d")(d.date), value : d.value } });
...
As seen in this example.
This approach works with d3.csv as well, just that you could use the row function instead:
d3.csv("data.csv", function(d) { return { date : d3.timeParse("%Y-%m-%d")(d.date), value : d.value } })
.then(function(data) { ...
The data returned by d3.csv is a javascript array. The data returned by d3.json is either a javascript array or object. If this is not true then there is a problem with the url, valid csv/json formatting, etc. There is no need to convert the data back to JSON and then back to a JavaScript array/object: this is an unnecessary step, though it should be relatively harmless in most cases.
As for the error you have: you have some SVG path data in the error message, it appears the x value of each coordinate is NaN, which when dealing with graphs and charts is almost always an indicator of:
a bad x scale,
bad/missing x values, or
a mismatch of datatype between scale and data.
In this case, likely caused by the fact that the row function wasn't executed and you were using unparsed dates in scale creation and then scaling.
I need to convert information in various structured formats to other formats (e.g. html or text) using NodeJS. So I took the approach to convert the source format to JSON based on JSON-Schemas. I can also convert the resulting JSON to text based on Pug templates.
What I'm now looking for is a flexible way to standardise the data and simplify the structures in the JSON so there are less variations in e.g. the date and time format.
An example of such object would be:
{
header: {
sender: {
// more properties
id: '12345';
}
receiver: {
// more properties
id: '987654';
}
date: {
date: '170910',
time: '0922'
}
// more properties
}
// more properties
someMore: {
birthdate: {
year: 2016,
month: 5,
day: 11
}
otherProperty: {
// more properties
date: '20170205'
}
}
}
I'd like to convert this to
{
header: {
senderId: '12345',
receiverId: '987654'
date: '20170910T0922'
}
// more properties
someMore: {
birthdate: '20160511',
otherProperty: {
// more properties
date: '20170205'
}
}
}
The idea is to recursively loop over all properties in the object and use a Map that has een entry for every property that should be acted on, e.g.
var map = new Map();
map.set('sender', getSender());
map.set('date', normalizeDate());
map.set('birthdate', normalizeDate());
for each property key the map is checked and if it returns a function, the function is executed, if not
the property is created and the loop goes on.
However, I get the distinct impression this problem has been solved before, so I wonder if there are npm packages I could use instead?
After searching some more and trying out different JSON transformers I settled on dot-object because it provides a simple way to transform part of the structure with multiple 'rules' in one go.
I gave up on the idea of writing a lot of general normalizing functions and just settled for the most obvious ones (gender and date/time) and handled them by transforming the various structures to a single standardized structure and then apply the appropriate function.
This might not be the most elegant approach but I'm time constraint and this works.
To convert the source to the result as described in the question, this code was used:
const dot = require('dot-object');
const rules = {
'header.sender.id': 'header.senderId',
'header.receiver.id': 'header.receiverId'
};
const target = {};
dot.transform(rules, src, target);
// normalizing
target.date = normalizeDate(target.date);
target.someMore.birthdate = normalizeDate(target.someMore.birthdate);
target.someMore.otherProperty.date = normalizeDate(target.someMore.otherProperty.date);
I gets following data in to a variable fields
{ data: [ '{"myObj":"asdfg"}' ] }
How to get the value of myObj to another variable? I tried fields.myObj.
I am trying to upload file to server using MEANjs and node multiparty
Look at your data.
fields only has one property: data. So fields.myObj isn't going to work.
So, let's start with fields.data.
The value of that is an array. You can see the []. It has only one member, so:
fields.data[0]
This is a string. You seem to want to treat it as an object. It happens to conform to the JSON syntax, so you can parse it:
JSON.parse(fields.data[0])
This parses into an object, so now you can access the myObj property.
JSON.parse(fields.data[0]).myObj
var fields = { data: [ '{"myObj":"asdfg"}' ] };
alert(JSON.parse(fields.data[0]).myObj);
How do I display all the points in this Json return statement to an HTML table on my view?
return Json(
new
{
vol = exposure.Volatility,
points =
from point in exposure.ExposurePointCollection
select new
{
date = point.ExposureDate,
val = point.MaximumExposure
}
});
If this is the result of an ajax call, you will need to iterate over the collection (presumably the "points" value) and add them to the DOM via javascript. jQuery can help with this, but there are also plug-ins for jQuery that will do virtually all of the work for you, something like jqGrid comes to mind.
Looping through the json result (assuming "points" is what you are looping over)
success: function(data){
jquery.each(data.points, function(index, value){
//index is the index of the array, value is the actual value
});
}
Look here for using jQuery to modify the DOM: http://api.jquery.com/html/#html2