value & display attribute is not working in dropdown.

[priyangamani]

How to get the value and display in dropdown dynamically.But it's not working. This is my Js code.. var nativescript_drop_down_1= require("nativescript-drop-down") var pageData = new Observable(); var items=nativescript_drop_down_1.ValueList(); for (var loop = 0; loop < 200; loop++) { items.push({ value: "I" + loop, display: "Item " + loop }); } pageData.set("items", items); page.bindingContext = pageData;

[PeterStaev]

Hey @priyangamani , from your code I do not see where you try to extract the value/display members. Also please refer to the demo apps where this scenario is already shown.

[priyangamani]

@PeterStaev ,I tried your sample code also.I won't work i trying to convert ts file in to js.

var nativescript_drop_down_1= require("nativescript-drop-down") //Plugin var items=nativescript_drop_down_1.ValueList();

for (var loop = 0; loop < 200; loop++) { items.push({ value: "I" + loop, display: "Item " + loop }); // Here iam trying to extract the value. } var pageData = new Observable(); pageData.set("items", items); //I tried to bind the value through xml page.bindingContext = pageData;

[PeterStaev]

@priyangamani , you are mistaken something. The code you highlighted does not extract the value, but pushes items that are bound to the drop down list. The extraction of the selected value happens here: https://github.com/PeterStaev/NativeScript-Drop-Down/blob/master/demo/app/main-page.ts#L43 and more specifically this expression viewModel.get("items").getValue(args.newIndex)

[priyangamani]

@PeterStaev,Why it does not extract the value.I'm calling Syntax is correct or not? What is the problem i don't know exactly.Is there any version problem.

var nativescript_drop_down_1= require("nativescript-drop-down") //Plugin var items=nativescript_drop_down_1.ValueList();//Is it correct?

for (var loop = 0; loop < 200; loop++) { items.push({ value: "I" + loop, display: "Item " + loop }); // Here iam trying to extract the value. } var pageData = new Observable(); pageData.set("items", items); //I tried to bind the value through xml page.bindingContext = pageData;

//XML FILE

[PeterStaev]

So with "extract" seems you mean to fill in the drop down. Your code seems ok. So not sure where is the problem. Have you imported the Observable class from the core modules? You can create a playground with your problem, this would help figuring out what is wrong.

[PeterStaev]

No further response so closing this one for now. In case you still have problems, please provide more details.

[venkateshsj]

My Environment:

nativescript - 3.4.3 - Up to date
tns-core-modules - 3.4.1 - Up to date
tns-android - 3.4.2 - Up to date
tns-ios - 3.4.1 - Not installed

OPTION-1: I tried the code given by @priyangamani above, it gives error as, Failed to find module: "nativescript-drop-down" https://play.nativescript.org/?template=play-js&id=Ofx4Vl&v=8

OPTION-2: I tried your code given here. It simply displays '0' and '1' as two items. https://play.nativescript.org/?template=play-js&id=3MVHxC&v=2

Can't understand what is going wrong in either case. Please help!

[PeterStaev]

Hey @venkateshsj , the imports in the playground MUST be relative. And you haven't instantiated your items variable. the ValueList is a class so you need to use the new keyword. Here is a working playground (tested under iOS, but it should work for android as well): https://play.nativescript.org/?template=play-js&id=Ofx4Vl&v=11

[venkateshsj]

Thanks a ton, buddy! It worked like a breeze.....:smiley::clap::thumbsup:

Such a silly mistake and I couldn't even see it...

[Topksk]

Hello !

I have this question too. Could you example for correct code to push value and display ? Please,

[Topksk]

xml: `<Page class="page" navigatingTo="onNavigatingTo"
xmlns:nsDrawer="nativescript-pro-ui/sidedrawer" xmlns:myDrawer="shared/my-drawer" xmlns="http://www.nativescript.org/tns.xsd" xmlns="http://schemas.nativescript.org/tns.xsd" xmlns:dd="nativescript-drop-down" xmlns:CheckBox="nativescript-checkbox" loaded="pageLoaded"

`

JS: const observableModule = require("data/observable"); const observableArrayModule = require("data/observable-array"); const ValueList = require("nativescript-drop-down");

var viewModel = new observableModule.Observable();

function pageLoaded(args) { var page = args.object; items = new observableArrayModule.ObservableArray(); for (var i = 0; i < 2; i++) { items.push({value: "id"+i, display: "text"+i}); } viewModel.set("items", items); page.bindingContext = viewModel; }

Result is list: [object Object] [object Object]

[Topksk]

Sorry, found mistake

const ns_drop_down = require("nativescript-drop-down"); var items = new ns_drop_down.ValueList();

[Xatta-Trone]

can anyone tell me how to use this feature in vuejs ?