Redirect Notice
As of April 12th, you must go to Progress SupportLink to create new support cases or to access existing cases. Please, bookmark the SupportLink URL and use the new portal to contact the support team.
How can we help you today?
How to set picker to get data from a collection
Hello Ellis,
To fetch data to a drop-down menu from a different collection, you need to write a bit of custom code. Below, you can find a very basic example on how to achieve this. In addition to making the changes to the code, you need to add the variable (in my example that's transactionType) that holds the fetched data in the Items field of the Picker in the INSPECTOR (the field is visible in the image you have provided, it's located under the id and hint fields).
import { Inject, Injector } from '@angular/core';
import { TransactionsListFormViewBaseComponent } from '@src/app/modules/transactions/transactions-list-form/transactions-list-form.base.component';
import { Kinvey, DataStoreType } from 'kinvey-nativescript-sdk';
export class TransactionsListFormViewComponent extends TransactionsListFormViewBaseComponent {
public transactionType = [];
public dataStore;
constructor(@Inject(Injector) injector: Injector) {
super(injector);
this.dataStore = Kinvey.DataStore.collection('TransactionType', DataStoreType.Network);
this.getTransactionTypes();
}
getTransactionTypes() {
this.dataStore.find().toPromise().then((data) => {
data.forEach(element => {
this.transactionType.push(element.type);
});
})
}
}We are aware that the scenario you are trying to achieve is quite common and we are working on making this possible directly through Kinvey Studio.
I hope this helps.
Regards,
Garo
Hi, I've tried this way but without success. this is the code:
import { Inject, Injector } from '@angular/core';
import { OperazioniFormViewBaseComponent } from '@src/app/modules/money-manager/operazioni-form/operazioni-form.base.component';
import { Kinvey, DataStoreType } from 'kinvey-nativescript-sdk';
export class OperazioniFormViewComponent extends OperazioniFormViewBaseComponent {
public transactionsType = [];
public dataStore;
constructor(@Inject(Injector) injector: Injector) {
super(injector);
this.dataStore = Kinvey.DataStore.collection('TransactionsTypes', DataStoreType.Network);
this.getTransactionsTypes();
}
getTransactionsTypes() {
this.dataStore.find().toPromise().then((data) => {
data.forEach(element => {
this.transactionsType.push(element.title);
});
})
}
}
I've set the "Items" property as: transactionsType
app starts but no item in the list...
There is a way to debug or "print" somewhere the value of a variable?
I've tried to set transactionsType = ['1', '2'], comment the code fill it, but the list is always empty...
thank you
Ellis
Initially, I also couldn't get it to work - so I tried populating the array in the ts code manually and this worked (now commented out in my example below). I then when back to connecting to Kinvey backend, added the catch(error) statement, and also checked that I had the name of my collection correct - and I think that was my initial problem - a typo. So for me - the name in the Items field of the designer is the variable to hold the return data, and the code connect to the collection should hold the name of the collection, not the variable name you have added to the Items field in the designer, (unless you are naming your collection in the database the same as the variable)
Anyway - the following retrieves a list of locations from a collection in the backend called pantryLocations. Hope this helps Ellis!
// Write your custom logic for LeftoversListMobilFormViewComponent here.
// Changes to this file are preserved when the app regenerates.
// Find more information on https://devcenter.kinvey.com/guides/studio-extension-points.
//-------------------------------------------------------------------------
import { Inject, Injector } from '@angular/core';
import { LeftoversListMobilFormViewBaseComponent } from '@src/app/modules/leftovers/leftovers-list-mobil-form/leftovers-list-mobil-form.base.component';
import { Component, OnInit } from "@angular/core";
import { ObservableArray } from "tns-core-modules/data/observable-array";
import { TokenModel, RadAutoCompleteTextView } from "nativescript-ui-autocomplete";
import { Kinvey, DataStoreType } from 'kinvey-nativescript-sdk';
let currentLocation: string ="";
let locationList = ["freezerLocal", "pantryLocal", "refrigeratorLocal"];
export class LeftoversListMobilFormViewComponent extends LeftoversListMobilFormViewBaseComponent {
public locations: Array<string> = [];
public dataStore;
autocompleteLocations: ObservableArray<TokenModel>;
constructor(@Inject(Injector) injector: Injector) {
super(injector);
this.dataStore = Kinvey.DataStore.collection('pantryLocations');
console.log("in constructor");
this.getLocations();
}
getLocations() {
console.log("getting locations");
this.dataStore.find().toPromise().then(
(data) => {
console.log("data has a result");
console.log(data);
data.forEach(element => {
console.log(element.location);
this.locations.push(element.location);
});
}).catch((error) => {
console.log(error);
});
/* test local population of locations list
for (let locn of locationList) {
this.locations.push(locn);
} */
}
}
Hi Ellis - is the name of your collection in the Kinvey Backend "TransactionTypes" - that is, make sure that the code to connect to your collection is:
this.dataStore = Kinvey.DataStore.collection('NAME_OF_YOUR_COLLECTION_GOES_HERE', DataStoreType.Network);
The code worked for me!
Cheers Janine
Hi Janine,
It was exactly a typo error in the collection name.
When I start the app on test on my iphone, this morning, with the same code I've wrote 2 days ago, It show 2 items in list '1' and '2'.
Saturday I've tried to close kinvey preview on my device but I have always an empty list.
I think I've found a bug in kinvey studio, not related to this task. Do you prefer I post in forum to check if it's really a bug, or open directly a ticket?
Thank you
Ellis
Hi Ellis
I'm just exploring Kinvey Studio myself, and really wanted this functionality - so I guess if you have a bug keep posting here!
I know I've also had some weird things happen with the code loaded into the Kinvey Preview reverting to an earlier version of my code. Then I shut down both the preview and scanner apps, and then reload my app, and the new code appears. I'm also having a problem that sometimes the scanner completely stops working - that is, it won't scan the QR Code in the Kinvey Studio Sidekick app - does this ever happen to you?
J
Cheers
Janine
Hi Janine
No the scanner seems to work fine, for me (I'm playing with KS at the moment and I don't have much working hours yet)
What I'm experiencing is the preview stop update (i change the style and it wont reload it)
Usually after a modify I change the layout style to confirm che preview is correctly updated. If it not update I close it and re-scan the code.
Sometimes it take a lot of time to update after the scan start. When it start it show the last "valid" state of the app you have in the preview, then after 30-60 secons, it reload the new one
Ellis
I am also having the experience that the app doesn't alway refresh, requiring a restart, however I can exactly figure out the pattern as yet. I'm not sure what is causing the scanner problems also - somedays it will take an hour before I can get it to scan - I think I have found that by going to another project, and trying to scan it (even if it fails) and then I return to my current project, and wait a while, then the scanner starts working. I'm still trying to work out what is going on before I report it!
Ellis Fantuzzi
I'm trying to learn how app development works in Kinvey Studio, for windows.
I've created 2 Collection: Transactions (with relative view and form) and TransactionsType (no view no form). In Transactions Form I've change some controls like picker, date picker, ecc instead default textbox.
One of this Picker I would like to connect to TransactionsType data, so the user could select one of them. I've added a new data service point on TransactionsType data, but when I try to set the picker properties, the Data Connection panel is readonly and set on Transactions data.
I don't understand if I'm wronging something, or if there is an error/limit in the environment, or if it is simply not yet implemented, and I have to code to do this.
Thank you
Ellis
1 person has this question