Passing 2 fields to key in headers, react-csv - javascript

Related to the existing question. How to assign two fields data in header of react-csv. I am working on something and came across the same issue. Asking again since there is no correct answer given. The following code for headers. - key: "user.firstname + user.lastname" doesn't work and the fields are empty. Please help how to get this working! TIA!!
Code:
headers = [
{
label: "id",
key: "user.id"
},
{
label: "Agent Name",
key: "user.firstName + user.lastName"
},
{
label: "Agent Email",
key: "user.email"
},
{
label: "Agent Phone",
key: "user.phoneNumber"
},
{
label: "Agent Commission",
key: "agentComission"
},
{
label: "Company Commission",
key: "companyComission"
},
{
label: "Total Sale",
key: "sale"
}
];
Data format example :
data = [
{
id: 1,
firstnamename: "name ",
lastname: "lastname",
email: "test#gmail.com",
phoneNumber: 123456789,
agentComission: 'agent comission',
companyComission: 'company comission',
sale: 'sale',
},
{
id: 2,
firstnamename: "name",
lastname: "lastname,
email: "test2#gmail.com",
phoneNumber: 123456789,
agentComission: 'agent comission 2',
companyComission: 'company comission 2',
sale: 'sale 2',
},
];

Related

Javascript sort data from multiple level of array?

I have a list which I want sort according to Arrival Date & Departure Date based on Caption and Value. But Arrival and Departure don't exist together in the list. If sort using arrival, then the departure can be ignored, just push to the bottom of the list, and vice versa. How can I achieve that?
var svehicleList = [
{
Brand: 'Volvo',
Summary: [
{
Caption: "Consignee",
Value: "ONE TO ONE SDN BHD",
},
{
Caption: "Arrival",
Value: "18-08-2020 06:01",
}
]
},
{
Brand: 'BMW',
Summary: [
{
Caption: "Consignee",
Value: "ABC SDN BHD",
},
{
Caption: "Arrival",
Value: "14-08-2020 16:03",
}
]
},
{
Brand: 'TOYOTA',
Summary: [
{
Caption: "Consignee",
Value: "MATTA SDN BHD",
},
{
Caption: "Departure",
Value: "14-08-2020 16:03",
}
]
},
{
Brand: 'FERRARI',
Summary: [
{
Caption: "Consignee",
Value: "GLOBAL P SDN BHD",
},
{
Caption: "Departure",
Value: "14-08-2020 18:03",
}
]
},
{
Brand: 'HONDA',
Summary: [
{
Caption: "Consignee",
Value: "HH SDN BHD",
},
{
Caption: "Arrival",
Value: "09-09-2020 16:03",
}
]
},
];
Edited: There is actually two object in summary.
This one helped me: How to Sort Multi-dimensional Array by Value?
You have to write your own comparision function.
You could find the object with the wanted Caption, then sort by occurence and then by date with a wrapper for getting an ISO date.
const
getISO = (string = '') => string.replace(/^(..)-(..)-(....) (.*$)/, '$3-$2-$1 $4'),
sortBy = caption => ({ Summary: a }, { Summary: b }) => {
const
aa = a.find(o => o.Caption === caption),
bb = b.find(o => o.Caption === caption);
return !aa - !bb
|| getISO(aa?.Value).localeCompare(getISO(bb?.Value));
},
vehicleList = [{ Brand: 'Volvo', Summary: [{ Caption: "Consignee", Value: "ONE TO ONE SDN BHD" }, { Caption: "Arrival", Value: "18-08-2020 06:01" }] }, { Brand: 'BMW', Summary: [{ Caption: "Consignee", Value: "ABC SDN BHD" }, { Caption: "Arrival", Value: "14-08-2020 16:03" }] }, { Brand: 'TOYOTA', Summary: [{ Caption: "Consignee", Value: "MATTA SDN BHD" }, { Caption: "Departure", Value: "14-08-2020 16:03" }] }, { Brand: 'FERRARI', Summary: [{ Caption: "Consignee", Value: "GLOBAL P SDN BHD" }, { Caption: "Departure", Value: "14-08-2020 18:03" }] }, { Brand: 'HONDA', Summary: [{ Caption: "Consignee", Value: "HH SDN BHD" }, { Caption: "Arrival", Value: "09-09-2020 16:03" }] }];
vehicleList.sort(sortBy('Arrival'));
console.log(vehicleList);
vehicleList.sort(sortBy('Departure'));
console.log(vehicleList);
.as-console-wrapper { max-height: 100% !important; top: 0; }

How to assign two fields data in header of react-csv

I am working on react-csv. I created an array for custom headers there I used header array and assign label and key. Currently, I have a situation of two fields to be assigned ( in the header, key is used to assign the reference of data fields). I tried but I failed could someone please help me how to achieve this goal.
Thanks
Code
headers = [
{
label: "id",
key: "user.id"
},
{
label: "Agent Name",
key: "user.firstName + user.lastName"
},
{
label: "Agent Email",
key: "user.email"
},
{
label: "Agent Phone",
key: "user.phoneNumber"
},
{
label: "Agent Commission",
key: "agentComission"
},
{
label: "Company Commission",
key: "companyComission"
},
{
label: "Total Sale",
key: "sale"
}
];
key: "user.firstName + user.lastName" },, as you see I want to assign this two fields but when I click on export it gives me empty cell.
I hope this will work
import { CSVLink } from "react-csv";
headers = [
{
label: "id",
key: "id"
},
{
label: "Agent Name",
key: "fullname"
},
{
label: "Agent Email",
key: "email"
},
{
label: "Agent Phone",
key: "phoneNumber"
},
{
label: "Agent Commission",
key: "agentComission"
},
{
label: "Company Commission",
key: "companyComission"
},
{
label: "Total Sale",
key: "sale"
}
];
data = [
{
id: 1,
fullname: "name of agent",
email: "test#gmail.com",
phoneNumber: 123456789,
agentComission: 'agent comission',
companyComission: 'company comission',
sale: 'sale',
},
{
id: 2,
fullname: "name of agent 2",
email: "test2#gmail.com",
phoneNumber: 123456789,
agentComission: 'agent comission 2',
companyComission: 'company comission 2',
sale: 'sale 2',
},
];
<CSVLink data={data} headers={headers}>
Download me
</CSVLink>;

change text of rows in type matrix surveyjs

I am building best employee survey project using surveyjs. When working in matrix type, I get trouble how to change text "employee1,employee2,employee3" with real name employee
see picture.
so far here is my code:
var json = {
title: "Software developer survey.",
pages: [
{
title: "Part 1",
questions: [
{
type: "matrix",
name: "Question1",
//isAllRowRequired: true,
title: "Please indicate if you agree or disagree with the following statements",
columns: [
{
value: 1,
text: "Strongly Disagree"
}, {
value: 2,
text: "Disagree"
}, {
value: 3,
text: "Neutral"
}, {
value: 4,
text: "Agree"
}, {
value: 5,
text: "Strongly Agree"
}
],
rows: [
{
value: "valueEmployee1",
text: "Employee1 ![Employee1](https://bezone.files.wordpress.com/2008/02/soeharto.jpg =50x50)"
}, {
value: "valueEmployee2",
text: "Employee2"
}, {
value: "valueEmployee3",
text: "Employee3"
}
]
},
//
]
},
thank you for your help
You can add matrix rows dynamically:
var json = {
questions: [
{
type: "matrix",
name: "score",
title: "Please score the employees in the list",
columns: [
{
value: 1,
text: "Bad"
}, {
value: 2,
text: "So-so"
}, {
value: 3,
text: "Good enough"
}, {
value: 4,
text: "Good"
}, {
value: 5,
text: "Excellent"
}
],
rows: [
]
}
]
};
window.survey = new Survey.Model(json);
var q = survey.getQuestionByName("score");
var employees = [{ id: "id1", name: "John"}, { id: "id2", name: "Ben"}, { id: "id3", name: "Chack"}]
employees.forEach(function(employee) {
q.rows.push(new Survey.ItemValue(employee.id, employee.name));
});
Here is the working sample - https://plnkr.co/edit/OMBt1n02Qc8f5znUmOHE?p=preview

Sencha touch Selectfield picker not showing correct selection

Store of the selectfield contains same word with different case like Ed & ed.When we select ed,In the picker it is showing Ed.
Code:
Ext.create('Ext.form.Panel', {
fullscreen: true,
items: [
{
xtype: 'fieldset',
title: 'Select',
items: [
{
xtype: 'selectfield',
label: 'Choose one',
displayField:'firstName',
valueField:'firstName',
store:Ext.create("Ext.data.Store", {
fields: [
{name: 'firstName', type: 'string'},
],
data : [
{firstName: "Ed"},
{firstName: "ed"},
{firstName: "Tommy"},
{firstName: "Aaron"},
{firstName: "Jamie"}
]
})
}
]
}
]
});
Fiddle for the problem
In Sencha, the selectfield is somethings whose value doesn't distinguish between the caps and small letter. So, it has provided valuefield. If you create your store like this below, you will get the expected result:
store: Ext.create("Ext.data.Store", {
fields: [{
name: 'firstName',
type: 'string'
}, {
name: 'value',
type: 'string'
}],
data: [{
firstName: "Ed",
value: 'edCaps'
}, {
firstName: "ed",
value: 'edSmall'
}, {
firstName: "Tommy",
value: 'tommy'
}, {
firstName: "Aaron",
value: 'aaron'
}, {
firstName: "Jamie",
value: 'jamie'
}]
})
Here is fiddle also. Happy coding! :)

Push data to array without index

I'd like to know how can i add this
{ post_id: 1, text: "text", creation: "date" }
to the "posts" in a array like this
var posts = [
{
post_id: 5,
text: "text",
creation: "date"
},
{
group: "favPosts",
posts: [
{ post_id: 2, text: "text", creation: "date" },
{ post_id: 7, text: "text", creation: "date" }
]
},
{
post_id: 8,
text: "text",
creation: "date"
}
]
I've already tried searching a hundred times but i can't seem to find a answer that suits my case, I've been trying to insert it with commands like slice and push but i can't seem to get it right, i'm still a beginner in javascript.
PS: I've come a solution but i don't think it's very "efficient";
addToGroup("favPosts");
function addToGroup(group) {
for(id in posts) {
if(posts[id].group == group){
posts[id].posts.push({ post_id: 10, text: "did it", creation: "date" });
console.log(posts[id]);
}
}
}
This should work with a push, I don't see why this wouldn't work.
Here is an example, I just used angular to easily display in HTML, not needed for what you are doing:http://plnkr.co/edit/PBCYxfjMqV3jzggMHJZ7?p=preview
var people = [
{
name: "Joe",
surname: "surname"
},
{
group: "name",
people: [{ name: "name", surname: "surname" }, { name: "name", surname: "surname" }]
},
{
name: "James",
surname: "surname"
}
];
var person = { name: "Jennifer", surname: "surname" };
people.push(person);

Categories