how do I add an item to mobiscroll at runtime

Question

I have a mobiscroll list. I added an extra button called "Add new" I want to click that button and add a new item to the mobiscroll list.

Is that possible? I've been digging through that api to no avail. I can catch the event with a custom handler and I have the mobiscroll instance available there but no way to add to it.
If so, can I add that new item as custom html? I'm thinking an input so that the user can change that newly added item.

Thanks

score 0 · Answer 1 · answered Mar 23 '15 at 20:42

The "pretty" way:

/*Create the new item*/
var newOption = document.createElement("option");
newOption.value = "My Value"
newOption.innerHTML = "My Text"

/*Append the new item*/
HTMLSelectControlID.appendChild(newOption)

/*Recreate the list*/
$("#HTMLSelectControlID").scroller('destroy').scroller($.extend(scrollerConfig["select"], { }));

The "dirty" way:

/*Inject the new item*/
HTMLSelectControlID.innerHTML += "<option value='My Value'>My Text</option>"

/*Recreate the list*/
$("#HTMLSelectControlID").scroller('destroy').scroller($.extend(scrollerConfig["select"], { }));

how do I add an item to mobiscroll at runtime

1 Answers1