jQuery Datatables: Using a database object - javascript

I am populating the fields of my User object in a datatable. The User object has a database field for email and phone , so that works as expected. The name field is actually an object with a bunch of keys in it so I want to use first_name. I tried doing the below but it doesn't seem to work. If I use just name, it renders out [Object object] so I know it's accessing name correctly.
$('#example').DataTable( {
data: [
'email,
'phone',
'name['first_name']'
]
});

According to https://datatables.net/reference/option/columns.data, you could reference it by using name.first_name.

Related

Change resultant's key name in cube.js

Currently, I am using the react dashboard for frontend and cube.js for the backend.
Result which I get from the backend is in the form of json and each key represents the column of my database.
Resultant example:
{
user.email:"xxx",
user.id:"xxx",
}
Where User is my table and email is the column name. This is causing me problem while rendering the data using react-table.
Is there any way I can give alias to columns and get data like this:
{
email:"xxx",
id:"xxx"
}
you can define your accessor as a function as the sample in npm, https://www.npmjs.com/package/react-table#example
{
id: 'email', // Required because our accessor is not a string
Header: 'Email',
accessor: d => d['user.email'] // Custom value accessors!
}
in javascript you can access the value like this object["user.email"]
You said you can't use it like that in react-tables, so you're going to have to transform it into another object that the table can accept.
Something like this
var user = {
email: object["user.email"]
}
Now you can access the newly transformed object like this.
user.email

Parse an Object in Angular Component Template file

I have an object in my address.component.ts as follows:
address : any;
This is the data that gets populated in address from back-end
{street1: "abc"
city: "some state"
country: "some country"
}
I am getting this data after calling a service.
My Template file is as follows:
<h1>{{address}}</h1>
On the browser, it is displayed as follows:
[Object object]
Instead of this I want to display entire address Object. I know I can do
<h1>{{address.street1}}</h1>
<h1>{{address.state}}</h1>
<h1>{{address.country}}</h1>
But I don't want to do it because there is a possibility that back-end might change the fields in address (like adding one more field). Is there any way I can display all the data in address object instead of just [Object object] on the browser.
Use
<h1 ng-repeat="(key, value) in address">{{value}}</h1>
ng-repeat repeats your element based on the condition in it.
For more information please see ng-repeat documentation.
You can use this function for getting all information. After it, print it in HTML:
var newAddress = Object.values(address);

Select2 with remote data and pre-selecting custom options

I'm using Select2 4.0.3 with remote data and server paging and it is working fine. The data returned from the api has additional fields, something like this:
var data = {
id: 12345,
text: 'John Doe',
email: 'abc#123.com'
}
According to the documentation here is the example of how to pre-select an option when using remote data, which also works fine (with one issue as noted below):
$.ajax({
type: 'GET',
url: '/api/students/s/' + studentId
}).then(function (data) {
// create the option and append to Select2
var option = new Option(data.full_name, data.id, true, true);
studentSelect.append(option).trigger('change');
// manually trigger the `select2:select` event
studentSelect.trigger({
type: 'select2:select',
params: {
data: data
}
});
});
The documentation explains about the last bit:
Notice that we manually trigger the select2:select event and pass
along the entire data object. This allows other handlers to
access additional properties of the selected item.
In my case the additional property is the email field.
My question/problem is that for the above 'manually' appended option the select2 JSON data has only the id and text fields. If the user clicks the list and allows it to populate the data from the server then the data has the id, text, and email fields as it should.
The documentation statement explaining why the trigger was needed indicates to me that the data object returned from the api would be passed on (and presumably used), but this does not seem to be the case.
So in my case leaving out or including the trigger portion has no effect of the control, so am I misunderstanding the purpose of that code or is select2 not working as documented?
For Example, in the templateSelection function used to format the control selection, which is called when the append and trigger code is executed, the object passed to the function has only the id and text properties. In fact if the original data object had completely different properties, say name, value, and email, the data object passed to the function still has id and text only, which is the default object used by select2. This behaviour forced me to modify the object to conform to the {id, text} pattern.

get JSON object javascript

I have the Student.groovy class that hasMany Note.groovy
Student Class extend to User.groovy
I have a JavaScript function that takes as a parameter a list of notes in JSON.
The code below works.
$.each(data,function(key, value) {
alert(value.note);
alert(value.semester)
});
But if I do alert(value.student); me is returned [object, object]
and when I put alert(value.student.toSource()); It's shown ({class: "project.Student", id: 1})
If I do alert(value.student.name); It's shown undefined
You're most likely not sending back the correct JSON format to access the student's name.
As of now with the examples you have given you can only access the class and id of a given student.
value.student.class //<-- project.student
value.student.id //<-- 1
To be able to access the student's name you would have to have an object like so:
{
class: "project.Student",
id: 1,
name: "Example name"
}
If you think you are actually sending everything you need from the server just do a little $(document.body).append(data); or console.log(data); on your getJSON success callback so you can see clearly what you have.
I wouldn't be surpized if value.name works by the way. Depends on your json structure.

ExtJS 4.1 - Retrieve hasOne information for Nested JSON

I am attempting to retrieve the information for a Model and an associated model that contains a hasOne association. I was referencing the following Sencha documentation page (http://docs.sencha.com/ext-js/4-1/#!/guide/data). I currently have the following sample code working:
var Mtd = Ext.ModelMgr.getModel('Mtd');
Mtd.load(4, {
success: function(mtd){
console.log("Loaded! " + mtd.get('id'));
mtd.getTreatmentdesign(function(treatment,operation){
console.log(treatment.get('id'));
}, this);
}
});
Now, when I call mtd.getTreatmentdesign(), I notice that two requests are made to retrieve information. The first one is to retrieve the Mtd information which I am expecting but then it's also making a request to retrieve the Treatmentdesign information. The response for the Mtd contains the Mtd information as well as the Treatmentdesign information. So I want to process the Mtd and Treatmentdesign information with one request. It puzzled me that the documentation stated the following:
You may be wondering why we passed a success function to the User.load call but didn't have to do so when accessing the User's posts and comments. This is because the above example assumes that when we make a request to get a user the server returns the user data in addition to all of its nested Posts and Comments. By setting up associations as we did above, the framework can automatically parse out nested data in a single request.
So how can I retrieve associated information without having to make another request? I simply just want to use all the json from a single request as opposed to having to make multiple requests.
Be sure to set the associationKey config on the HasOne association to the property that contains the data for the associated model. By default, this is the name of the associated model class in all lowercase letters.
For instance, if the data for an Mtd record is returned by the server in the form
{
...
treatmentDesign: {
...
}
}
set the associationKey to 'treatmentDesign'.
Here's an example in action: http://jsfiddle.net/HP6fq/3/
Yes, associationKey works
Ext.define('User', {
extend:'Ext.data.Model',
fields: ['id', 'name', 'status'],
associations: [{ type: 'hasOne', model: 'Status', associationKey: 'status' }]
});
Ext.define('Status', {
extend:'Ext.data.Model',
fields: ['id', 'title'],
});
Demo here

Categories

Resources