How to display RadDataForm Valueproviders with key value pair - vue.js

I resolve most of my problem only few left out of which this one is preventing me to submit the form. I am using Nativescript + vue and without Typescript. how to display the Valueproviders with array list? Here is the code
https://play.nativescript.org/?template=play-vue&id=2oWObE

There was the problem with your data type. As per the documentation Array should have key and label properties. But still if you want id and name then you should try like below.
'valuesProvider': {
key: 'id',
label: 'name',
items: [
{ id: 1121, name: 'Shanghai' },
{ id: 3651, name: 'Lagos' },
{ id: 5213, name: 'Moscow' },
{ id: 6214, name: 'São Paulo' },
{ id: 6985, name: 'Sydney' }
]
};
https://docs.nativescript.org/vuejs/ns-ui/DataForm/dataform-editors-providers
Anyway, I tried that and that was not working for me either then searched for it and relaised that there is an open feature request to support the valuesProvider for picker from JSON metadata. You can vote to support the same feature.
https://github.com/NativeScript/nativescript-ui-feedback/issues/369

Solution
Just get you cityList out of vue data and map your data
https://play.nativescript.org/?template=play-vue&id=2oWObE&v=6
more detailed version with groups
https://play.nativescript.org/?template=play-vue&id=rqK7wO&v=3

Related

Replace Objects with the corresponding ObjectId with Mongoose if found in the MongoDB

I have a MEAN-Stack setup in which i have Devices and Servicecases saved in the MongoDB-Database.
Devices can be the content of a Servicecase
If a new Case should be created, my Frontend will deliver the following form data:
content: [
{
"device": 012345678909876,
"errorDesc": "lorem"
},
{
"device": 012345678909876,
"errorDesc": "ipsum"
}
]
There could be a device document with the submitted device number in the Database. If yes, the received doc should be populated with its ObjectId to look like this:
content: [
{
device: { type: Schema.Types.ObjectId, ref: 'Device' },
errorDesc: String
},
...
]
If not, it should stay as it is
I could iterate through each device of the array and use the findOne() query and, if a doc was found, replace it, but is there a more efficient way to use the populate() transformation?

How can I retrieve nested values in Keystone 5 for my list

I'm adding a list called 'tourlocation' to my Keystone 5 project. In my mongo database my tourlocations collection has an object called 'coordinates', with two values: 'lat' and 'long'. Example:
"coordinates" : {
"lat" : 53.343761,
"long" : -6.24953
},
In the previous version of keystone, I could define my tourlocation list coordinates object like this:
coordinates: {
lat: {
type: Number,
noedit: true
},
long: {
type: Number,
noedit: true
}
Now unfortunately, when I try to define the list this way it gives the error: The 'tourlocation.coordinates' field doesn't specify a valid type. (tourlocation.coordinates.type is undefined)'
Is there any way to represent objects in keystone 5?
#Alex Hughes I believe your error says "type" which you may need to add it like this
keystone.createList('User', {
fields: {
name: { type: Text }, // Look at the type "Text" even in the MongoDB you can choose the type but it will be better to choose it here from the beginning.
email: { type: Text },
},
});
Note that noedit: true is not supported in version 5 of KeystoneJS.
For more info look at this page https://www.keystonejs.com/blog/field-types#core-field-types

ReferenceArrayInput usage with relationships on React Admin

I have followed the doc for the ReferenceArrayInput (https://marmelab.com/react-admin/Inputs.html#common-input-props) but it does not seem to be working with relationship fields.
For example, I have this many-to-many relation for my Users (serialized version) :
Coming from (raw response from my API):
I have setup the ReferenceArrayInput as followed :
<ReferenceArrayInput source="profiles" reference="profiles" >
<SelectArrayInput optionText="label" />
</ReferenceArrayInput>
I think it's making the appropriate calls :
But here is my result :
Any idea what I'm doing wrong ?
Thanks in advance for your help !
On docs, ReferenceArrayInput is said to expect a source prop pointing to an array os ids, array of primitive types, and not array of objects with id. Looks like you are already transforming your raw response from api, so if you could transform a bit more, mapping [{id}] to [id], it could work.
If other parts of your app expects profiles to be an array of objects, just create a new object entry like profilesIds or _profiles.
As gstvg said, ReferenceArrayInput expects an array of primitive type, not array of objects.
If your current record is like below:
{
"id": 1,
"tags": [
{ id: 'programming', name: 'Programming' },
{ id: 'lifestyle', name: 'Lifestyle' }
]
}
And you have a resource /tags, which returns all tags like:
[
{ id: 'programming', name: 'Programming' },
{ id: 'lifestyle', name: 'Lifestyle' },
{ id: 'photography', name: 'Photography' }
]
Then you can do something like this (it will select the tags of current record)
<ReferenceArrayInput
reference="tags"
source="tags"
parse={(value) => value && value.map((v) => ({ id: v }))}
format={(value) => value && value.map((v) => v.id)}
>
<AutocompleteArrayInput />
</ReferenceArrayInput>

Add multiple v.slots with a v-for with Bootsrtap-Vue

My table data has nested objects, so I need to use a v-slot to render it correctly on a table. The thing is that the table columns depend on the lenght of another array.
I tried using a v-for outside my v-slot, but then I get an error telling me that the v-slots need to be directly under the root level inside its component.
<div v-for="plant in stockTable.plants" :key="plant.key">
<template v-slot:cell(plant.name)="row">
</template>
</div>
My data looks like this:
{ key: 1, description: 'Stock-1', plants: [{ key: 1, name: 'Plant-1', inventory: [{ type: 'Physical', stock: 875 }, { type: 'Virtual', stock: 1540 }] }, { key: 2, name: 'Plant-2', inventory: [{ type: 'Physical', stock: 458 }, { type: 'Virtual', stock: 525 }] }] }
And the array it depends on it this one:
plants: [{ key: 1, name: 'Plant-1' }, { key: 2, name: 'Plant-2' }]
It has to create columns with the second array, and show the corresponding data of the first one.
Edit: This is a mock up of what I'm trying to do
Found another similar question wich was correctly answered. For what I understand, the issue had to do with some string interpolation.
Here's the answer:
https://stackoverflow.com/a/58143362/11932235

Adding new node to Dijit.Tree at a particular place in the tree

I am running into a strange error while adding a new Tree node to dijit.Tree.
var rawdata = [{
label: 'Date',
id: '1',
children: [{
label: 'Life',
id: '1.1'
}, {
label: 'Liberty',
id: '1.2'
}]
}, {
label: 'Some links (note: the link is <b>not</b> clickable)',
id: '2',
children: [{
id: '2.1',
label: 'Dojo Toolkit'
}, {
id: '2.2',
label: '<img src="http://dojofoundation.org/media/img/dojo.logo.png" alt="greatest ever" height="32px" />'
}, {
id: '2.3',
label: 'my blog'
}]
}];
var store = new dojo.data.ItemFileWriteStore({
data: {
identifier: 'id',
label: 'label',
items: rawdata
}
});
And in order to add item to the tree, I am using the following:
store.newItem({id:'3', label:"New tree node label"});
However, this only seems to work for the first time I add an item to the tree. When trying to add a second item, I get an Error: assertion failed in ItemFileWriteStore ?
Also, currently the node is added at the very first level in the tree. How could I add it in one of the subtree, say the second tree with id:2 ?
Thanks!
The assertion error may be due to having conflicting id values. Is the second item added with a different id than the first?
If you add an item to the store it will be added at top level, unless you add the item to one of the children arrays - the tree has to know where to put the item, if you add it to a store it assumes (correctly) that it is a top level item. If you add the new item as a child of an existing item, then again, the tree knows where it should go.