How to get a list of map objects from list of strings dart - dart

I have the following list with phone numbers:
listofnumbers = ['01225','03933']
and a list of map objects as:
List mapofobjects = [
{
'name': 'John Doe',
'phone': {
'numbers': ['03323', '02333'],
'verified': true
},
'uid': '2BDNDD',
'createdat': 'today..'
},
{
'name': 'Mary Doe',
'phone': {
'numbers': ['03933', '39939'], // matches 03933 in listofnumbers
'verified': true
},
'uid': '1BDNDD',
'createdat': 'today..'
},
{
'name': 'Vincin Doe',
'phone': {
'numbers': ['01225', '59939'], // matches 01225 in listofnumbers
'verified': true
},
'uid': 'XBDNDD',
'createdat': 'today..'
}
];
How can I convert the listofnumbers into a list of map objects using each listofnumbers item as join.
I should get something like this for the listofnumbers of two numbers:
finalList = List mapofobjects = [
{
'name': 'John Doe',
'phone': {
'numbers': ['03323', '02333'],
'verified': true
},
'uid': '1BDNDD',
'createdat': 'today..'
},
{
'name': 'Vincin Doe',
'phone': {
'numbers': ['01225', '59939'],
'verified': true
},
'uid': 'XBDNDD',
'createdat': 'today..'
}
];
With each object matching/replacing a listofnumbers of item when phone['numbers'] contains the item.

You can use two forEach to get this result, like this:
List finallist = [];
listofnumbers.forEach((element) {
mapofobjects.forEach((e) => {
if (e['phone']['numbers'].contains(element))
finallist.add(e)
});
});
print(finallist.length.toString());
the result is: 2

You can do something like this:
final finalList = [
...mapofobjects.where((dynamic object) =>
object['phone']['numbers'].any((phone) => listofnumbers.contains(phone)))
];
finalList.forEach(print);
// {name: Mary Doe, phone: {numbers: [03933, 39939], verified: true}, uid: 1BDNDD, createdat: today..}
// {name: Vincin Doe, phone: {numbers: [01225, 59939], verified: true}, uid: XBDNDD, createdat: today..}

Related

How to make each parameter appear in a table row?

I have a device that get some telemetry data via REST API. Some of the data that it received is in the following format:
{
...
parameters: [
{
'name': 'parameter1',
'grade': '2',
'info': 'some informtion'
},
{
'name': 'parameter2',
'grade': '1',
'info': 'some informtion'
},
...
]
}
what I want to do is to visualize the data in the following way:
name | grade | info
---------------------------------------
parameter1 | 2 | some information
parameter2 | 1 | some information
... | ... | ...
now if I break down each parameter and send it to the device separately it will override the previous one.
How can I make that?
Figured out a way to do this:
Go to 'Widget Bundle' and create a new widget bundle.
Create a new widget of type 'Latest values'.
Here we have CSS/HTML section and a Javascript section.
HTML section:
<div class="my-data-table">
</div>
Javascript section:
self.defaultList = [
{
'id': 1,
'name': 'name 1',
'grade': 123,
'description': 'This is a description'
},
{
'id': 2,
'name': 'name 2',
'grade': 456,
'description': 'More description'
},
{
'id': 3,
'name': 'name 3',
'grade': 789,
'description': 'Even more description'
}
];
self.createTable = function(data) {
const columnNames = Object.keys(data[0]);
let tableHeadContent = $('<tr></tr>');
columnNames.forEach((columName) => {
tableHeadContent.append('<td>' + columName + '</td>');
});
let tableHead = $('<thead></thead>').append(tableHeadContent);
let tableBody = $('<tbody></tbody>');
data.forEach((currentElement, index) => {
const vals = Object.values(currentElement);
let currentRow = $('<tr></tr>');
vals.forEach((val) => {
currentRow.append('<td>' + val + '</td>');
});
tableBody.append(currentRow);
});
return $('<table></table>').append(tableHead).append(tableBody);
}
self.onInit = function() {
let currentList = [...self.defaultList];
if(self.ctx.defaultSubscription.data[0].data.length !== 0) {
currentList = JSON.parse(self.ctx.defaultSubscription.data[0].data[0][1]);
}
let currentTable = self.createTable(currentList);
$('.my-data-table', self.ctx.$container).append(currentTable);
}
self.onDataUpdated = function() {
self.ctx.detectChanges();
}
What you need to pay attention to and understand is self.ctx.defaultSubscription.data, when you visualize your data with a certain widget you subscribe the data to the widget. self.ctx.defaultSubscription.data give you access to the data, you can console.log() it to see how it is structured.
The self.defaultList is for the preview and when you set this widget to a specific data it will use that data.
There may be other way to do this but this is how I did it.

Is there a way to make api call when expanding table to show nested table?

In Ant Nested table - When expanding a row, I want to make an api call and get the data to show the nested table.
The function expandedRowRender, expects to return the nested table, it does not accept a promise.
How can I show a nested Ant table using ajax call?
I have tried to recreate the scenario for reference.
import ReactDOM from "react-dom";
import "antd/dist/antd.css";
import "./index.css";
import { Table } from "antd";
import reqwest from "reqwest";
const nestedColumns = [
{
title: "Name",
dataIndex: "name",
sorter: true,
render: name => `${name.first} ${name.last}`,
width: "20%"
},
{
title: "Gender",
dataIndex: "gender",
filters: [
{ text: "Male", value: "male" },
{ text: "Female", value: "female" }
],
width: "20%"
},
{
title: "Email",
dataIndex: "email"
}
];
class App extends React.Component {
state = {
data: []
};
fetch = (params = {}) => {
console.log("params:", params);
reqwest({
url: "https://randomuser.me/api",
method: "get",
data: {
results: 10,
...params
},
type: "json"
}).then(data => {
return (
<Table
columns={nestedColumns}
dataSource={data.results}
pagination={false}
/>
);
// this.setState({
// data: data.results
// });
});
};
expandedRowRender = () => {
this.fetch();
return <table columns={nestedColumns} dataSource={this.state.data} />;
};
render() {
const columns = [
{ title: "Name", dataIndex: "name", key: "name" },
{ title: "Platform", dataIndex: "platform", key: "platform" },
{ title: "Version", dataIndex: "version", key: "version" }
];
const data = [
{
key: 1,
name: "Screem",
platform: "iOS",
version: "10.3.4.5654"
}
];
return (
<Table
columns={columns}
dataSource={data}
pagination={false}
expandedRowRender={this.expandedRowRender}
/>
);
}
}
ReactDOM.render(<App />, document.getElementById("container"));
I try my level best to answer your question. Here is the reduced type of code and you can get an idea of how to do that.
In state,
state = {
data: null,
loading: false,
};
Here is your function to make API call,
fetch = (expanded, record) => {
axios.get(`put your api to load nested table`)
.then(res => {
const data = res.data;
this.setState({
...this.state.data,
data,
loading: true
})
}).catch(error => {
console.log(error, "error")
})
}
After that,
expandedRowRender=() => {
if(this.state.loading){
const nestedTableData = this.state.data.map(row => ({
key: row.id,
Id: row.id,
name: 'test',
gender: 'gender',
}))
const nestedColumns = [
{ title: "Name", dataIndex: "name", key: "name" },
{ title: "Gender", dataIndex: "gender", key: "gender" },
];
return <Table columns={nestedColumns} dataSource={nestedTableData } pagination={false} />
}
};
And put following code below return
<Table
className="components-table-demo-nested"
columns={columns}
dataSource={tableData}
expandable={{
expandedRowRender: this.expandedRowRender,
rowExpandable: record => true,
onExpand: this.fetch
}}
/>
I hope it may help you and let me know if it does. :)

Access nested JSON property in jspdf autotable plugin

I have just started using jsPDF and the AutoTable plugin, and it is almost perfect for what we are using it for. One question...
Is it possible to assign a dataKey in the columns definition to a nested property within the JSON that is being mapped to the table?
We have a JSON structure that looks like this:
"Primary_Key": "12345",
"Site_Name": {
"Address_Name": "Address 1"
},
"Default_Screen_Name": "Bob",
"Full_Name": "Bob Smith"
If we use the following columns:
var columns = [
{ title: "ID", dataKey: "Primary_Key" },
{ title: "Screen Name", dataKey: "Default_Screen_Name" },
{ title: "Full Name", dataKey: "Full_Name" }];
Everything works perfectly. However, we would also like to do something like the following:
var columns = [
{ title: "ID", dataKey: "Primary_Key" },
{ title: "Iterations", dataKey: "Iterations" },
{ title: "Screen Name", dataKey: "Default_Screen_Name" },
{ title: "Site Name", dataKey: "Site_Name.Address_Name" }];
Where we are using Site_Name.Address_Name to index into the nested JSON object to retrieve the value.
Is something like this possible?
Not at the moment. You can follow that feature request here. Your options are currently to either flatten the data before passing it to autotable or use the hooks to extract the specific text you want. That can be done like this:
var columns = [
{title: "ID", dataKey: "id"},
{title: "Name", dataKey: "name"},
{title: "Country", dataKey: "address"}
];
var rows = [
{id: 1, name: "Shaw", address: {country: "Tanzania"}},
{id: 2, name: "Nelson", address: {country: "Kazakhstan"}},
{id: 3, name: "Garcia", address: {country: "Madagascar"}}
];
var doc = jsPDF();
doc.autoTable(columns, rows, {
didParseCell: function(data) {
if (data.column.dataKey === 'address') {
data.cell.text = data.cell.raw.country;
}
}
});
doc.save('table.pdf');
<script src="https://unpkg.com/jspdf#1.3.3/dist/jspdf.min.js"></script>
<script src="https://unpkg.com/jspdf-autotable#2.3.1/dist/jspdf.plugin.autotable.js"></script>
Update for additional question in comments:
var columns = [
{title: "Country", dataKey: "address", displayProperty: "country"},
...
];
var rows = [...];
...
didParseCell: function(data) {
if (data.column.dataKey === 'address') {
var prop = data.column.raw.displayProperty;
data.cell.text = data.cell.raw[prop];
}
}

Bind results from search

I cannot bind results from search in kendo grid. I've tried many times, I'm in trouble four days, I don't know what is wrong here,
When i debug action everything is working perfect,data is OK, return grid result are OK, but results aren't shown in kendo.
Here is my code:
<script>
$(function() {
$("a.k-button").on('click', function (e) {
debugger;
e.preventDefault();
var dataObj = serializeByFieldsWrap(".invoiceForm");
var dataUrl = $(this).data('url');
// dataObj.ToolboxId = toolboxId;
$('body').css('cursor', 'wait');
var result = $.ajax({
type: "POST",
url: dataUrl,
dataType: 'json',
data: dataObj,
//complete: $("#invoices-grid").data("kendoGrid").data.read(),
});
result.done(function (data) {
console.log(data);
var grid = $('#invoices-grid').data("kendoGrid");
grid.dataSource.data(data);
});
result.fail(function (error) {
console.log(error);
});
});
});
</script>
Controller:
public ActionResult List(DataSourceRequest command, FinanceListModel model)
{
var searchString = model.SearchJobItemNumber;
var isChecked = model.IsChecked;
var invoices = _invoiceService.GetAllInvoices(searchString, isChecked);
var gridModel = new DataSourceResult
{
Data = invoices.Select(x => {
var jobModel = x.ToModel();
return jobModel;
}),
Total = invoices.TotalCount
};
return Json(gridModel, "application/json", JsonRequestBehavior.AllowGet);
}
Kendo UI Grid:
<script>
$(function() {
$("#invoices-grid").kendoGrid({
dataSource: {
data: #Html.Raw(JsonConvert.SerializeObject(Model.Invoices)),
schema: {
model: {
fields: {
JobNumber: { type: "string" },
CustomerName: { type: "string" },
DepartmentName: { type: "string" },
DateInvoice: { type: "string" },
ValidDays: { type: "number" },
Delivery: { type: "string" },
IsPayed: { type: "boolean" },
Payed: { type: "number" },
Status: { type: "boolean" },
},
error: function(e) {
display_kendoui_grid_error(e);
// Cancel the changes
this.cancelChanges();
},
pageSize: 20,
serverPaging: true,
serverFiltering: true,
serverSorting: true
},
dataBound: function () {
var row = this.element.find('tbody tr:first');
this.select(row);
},
columns: [
#*{
field: "Status",
title: "#T("gp.Jobs.Fields.Status")",
template: '#= Status #'
},*#
{
field: "JobNumber",
title: "#T("gp.Invoice.Fields.JobNumber")",
template: '#= JobNumber #'
},
{
field: "CustomerName",
title: "#T("gp.Invoice.Fields.CustomerName")",
template: '#= CustomerName #'
},
{
field: "DepartmentName",
title: "#T("gp.Invoice.Fields.DepartmentName")",
template: '#= DepartmentName #'
},
{
field: "DateInvoice",
title: "#T("gp.Invoice.Fields.DateInvoice")",
template: '#= DateInvoice #'
},
{
field: "ValidDays",
title: "#T("gp.Invoice.Fields.ValidDays")",
template: '#= ValidDays #'
},
{
field: "Delivery",
title: "#T("gp.Invoice.Fields.Delivery")",
template: '#= Delivery #'
},
{
field: "Payed",
title: "#T("gp.Invoice.Fields.IsPayed")",
template: '#= (Payed == 2) ? "Комп." : ((Payed == 1) ? "ДЕ" : "НЕ") #'
},
{
field: "Id",
title: "#T("Common.Edit")",
width: 100,
template: '#T("Common.Edit")'
}
],
pageable: {
refresh: true,
pageSizes: [5, 10, 20, 50]
},
editable: {
confirmation: false,
mode: "popup"
},
scrollable: false,
selectable: true,
change: function(e) {
var selectedRows = this.select();
var jobId = parseInt($(selectedRows).data('job-id'));
var jobItemId = parseInt($(selectedRows).data('job-item-id'));
var result = $.get("#Url.Action("SideDetails", "Production")/" + jobItemId);
result.done(function(data) {
if (data) {
$(".job-edit .jobItemDetails").html(data);
}
});
},
rowTemplate: kendo.template($("#invoiceRowTemplate").html()),
});
});
</script>
DataSourceResult formats your server response like this:
{
Data: [ {JobNumber: "...", FieldName: "bar", ... } ],
Total: 100
}
In other words, the data items array is assigned to a Data field, and the total items count is assigned to a Total field. The Kendo UI DataSource configuration must take this into account by setting schema.data and schema.total:
http://docs.telerik.com/kendo-ui/framework/datasource/crud#schema
http://docs.telerik.com/kendo-ui/framework/datasource/crud#read-remote
schema: {
data: "Data",
total: "Total"
}

MobileFirst JSONStore working as intended on emulator, but failing on ios device

I have the following lines of code to add some variables to a local collection:
var data = {
name: '123',
brand: '123',
model: '123',
img: 'imgurl',
category: '123',
segment: 'Recreational',
pilotFstName: '123',
pilotLstName: '123',
insuranceNumber: '123',
insNumber2: '123',
extras: '123',
hasCamera: '123',
insuranceDate: '123'
};
var collectionName = 'Drones';
var options = {};
WL.JSONStore.get(collectionName)
.add(data, options)
.then(function(numberOfDocumentsAdded) {
//handle success
alert("Done");
})
.fail(function(errorObject) {
//handle failure
alert(errorObject);
});
This works fine working in a browser, but fails with an INVALID_SEARCH_FIELD error in any iOS physical device. This is the full error stack in Xcode.
[JSONStoreCollection findWithQueryParts:andOptions:error:] in
JSONStoreCollection.m:603 :: Error: JSON_STORE_INVALID_SEARCH_FIELD,
code: 22, collection name: Drones, accessor username: jsonstore,
currentQuery: (null), JSONStoreQueryOptions: [JSONStoreQueryOptions:
sort=( { identifier = desc; } ) filter=(null), limit=1, offset=(null)]
My Collections.js :
function getCollections(){
return {
Account : {
searchFields: {
userName:"string",
password:"string",
frstName:"string",
lstName:"string",
mail:"string"
}
},
Drones : {
searchFields: {
name:"string",
brand:"string",
model:"string",
img:"string",
category:"string",
segment:"string",
pilotFstName:"string",
pilotLstName:"string",
insuranceNumber:"string",
insNumber2:"string",
extras:"string",
hasCamera:"string",
insuranceDate:"string"
}
},
Historial : {
searchFields: {
name:"string",
date:"string",
posXStart:"string",
PosYStart:"string",
PosXFinish:"string",
PosYFinish:"string"
}
}
};
};
(function () {
WL.JSONStore.init(getCollections(), {
// password : 'PleaseChangeThisPassword'
})
.then(function () {
WL.Logger.debug(['All collections were loaded successfully'].join('\n'));
})
.fail(function (errObj) {
WL.Logger.ctx({pretty: true}).error(errObj);
});
}());
I had to create the collection since you did not mention it in your code snippet.
I also had to first initialize the JSONStore.
The following code works for me both in browser and iOS Simulator (that pretty much means also on a physical device in most cases such as this one):
main.js:
var collectionName = 'myCollectionObject';
var collections = {
myCollectionObject : {
searchFields : {
name: 'string',
brand: 'string',
model: 'string',
img: 'string',
category: 'string',
segment: 'string',
pilotFstName: 'string',
pilotLstName: 'string',
insuranceNumber: 'string',
insNumber2: 'string',
extras: 'string',
hasCamera: 'string',
insuranceDate: 'string'
}
}
};
var data = [{
name: '123',
brand: '123',
model: '123',
img: 'imgurl',
category: '123',
segment: 'Recreational',
pilotFstName: '123',
pilotLstName: '123',
insuranceNumber: '123',
insNumber2: '123',
extras: '123',
hasCamera: '123',
insuranceDate: '123'
}];
var options = {};
var addOptions = { };
function wlCommonInit(){
WL.JSONStore.init(collections, options)
.then(function () {
return WL.JSONStore.get(collectionName).add(data, addOptions);
})
.then(function (numberOfDocumentsAdded) {
alert ("success: " + numberOfDocumentsAdded);
})
.fail(function (errorObject) {
alert ("failure: " + errorObject);
});
}

Resources