How to use a JqxDropDownList

1

Hello,
I never used a Jquery DropDownList in NSB, and I would like to know how to associate to each item listed in the “source” field a value like 0, 1 2,3 and so on.

Also, how the “onselect” event need to be written in NSBasic to obtain the selected item ?
I have tried reading the “.value” property without success.

Thank you
Pietro

2

Aha - I see why you are asking. The sample doesn’t do a good job of dealing with this.

I’m on it.

3

Here is the code in JavaScript

DropDownList2.onselect = function(event) {
  NSB.MsgBox(event.args.item.index + " " + event.args.item.value);
};

and in BASIC

Function DropDownList2_onselect(event)
  NSB.MsgBox event.args.item.index + " " + event.args.item.value
End Function

The sample will be corrected in the next build.

4

Thank you !!
Pietro

5

Sorry, i need just a further explanation.
In the example above you return:

  • item.index: this is the zero-based index of the selected item
  • item.value: this is the value associated to the “valueMember” of the jqxDropDownList

I also need to obtaion the value associated to the “displayMember” of the selected item: howe can I do ’
Thanks

Pietro

6

Could it be item.html that you are looking for?

jqWidgets has excellent documentation on their site. If you scroll down to Events, then click on select, you will see this:

Select
This event is triggered when the user selects an item.

Code example

Bind to the select event by type: jqxDropDownList.

$('#jqxDropDownList').on('select', function (event)
{
    var args = event.args;
    if (args) {
    // index represents the item's index.                
    var index = args.index;
    var item = args.item;
    // get item's label and value.
    var label = item.label;
    var value = item.value;
    var type = args.type; // keyboard, mouse or null depending on how the item was selected.
}                        
});

The item object has the following fields:

  • label - gets item’s label.
  • value - gets the item’s value.
  • disabled - gets whether the item is enabled/disabled.
  • checked - gets whether the item is checked/unchecked.
  • hasThreeStates - determines whether the item’s checkbox supports three states.
  • html - gets the item’s display html. This can be used instead of label.
  • index - gets the item’s index.
  • group - gets the item’s group.

Try it: Bind to the select event by type:jqxDropDownList

7

Oh great, you are right!
thanks a lot

Everything settled!