Populate menu select item from local variable array

[Brian6028327]

Hi, sorry if you've already answered this somewhere else, but I could not find it...

Via JS, how might I populate a menu select item with a local array variable which has multiple records consisting of two fields equivelant to the menu select's 'label' and 'value' ?

-thanks

[Oleg Danchenkov]

Hi, Brian.
If your localstorage variable looks like
precode[{"label" : "l1", "value" : "v1"}, {"label" : "l2", "value" : "v2"}]/code/pre
(I mean it's correct JSON)
Try this code
precode
var data;
try {
data = JSON.parse(localStorage.getItem("localstorageVarName"));
if ({}.toString.call(data) !== "[object Array]") {
data = [];
}
} catch ( e ) {
data = [];
}
var dropDown = Appery("mobileselectmenuName");
dropDown.empty();
$.each(data, function(index, option) {
dropDown.append(
$('<option value="' + option["value"] + '">' + option["label"] + '<&#47;option>')
);
});
dropDown&#46;selectmenu("refresh");/code/pre

[Brian6028327]

Thanks for the quick response Oleg! I'll try it shortly.

[Kevin6209373]

Oleg,

I got your example above working for a dropdown list, but I am struggling to do something very similar with a simple list.

• I would like to append my data to a List, instead of to a select Menu.
  How can I do that? - append does not append the data to a list

  I want to load my data to a list, but from a local variable array.
  I would like it to look like the sample app (where the data is bound to the database).

  Thanks Greatly!
  Kevin

[Kevin6209373]

I realize that this topic is marked as answered. I will repost this as a new question.

Thanks,
Kevin

[Maryna Brodina]

Hi, no need to do that. We're working on your question.

[Maryna Brodina]

To add one element to the List use:
codeAppery('mobileList')&#46;append('<li><a>New Element Text<&#47;a><&#47;li>')&#46;listview('refresh');/code
to add a few elements:
codevar data = ["New item 1", "New item 2", "New item 3"];

var listComponent = Appery("mobileList");
$&#46;each(data, function(index, value) {
listComponent&#46;append(
$('<li><a>' + value + '<&#47;a><&#47;li>')
);
});
listComponent&#46;listView("refresh");/code

[Kevin6209373]

That doesn't quite do it.
When I try this code, I get the items added at the bottom of the list.
I adjust your code to make the data items stand out
var data = ["Localstorage item 1", "Localstorage item 2", "Localstorage item 3"];

[Kevin6209373]

I also tried referencing the listitem instead of the list (in case I had misunderstood)..
But this is what I got..

Thanks!

[Maryna Brodina]

Could you clarify what JS you're running? If we understand correctly you changed JS I posted above?