I have an issue when I'm trying to use a select in a JQM listview.
I have a listview to list a couple of computers and in every listitem the user are able to make some changes to the computers via dropdownlists.
Here is the result:
I'm using knockoutjs to bind viewModels to the view.
Here is my listview:
<div data-role="page" id="page1">
<div data-role="content">
<ul id="editComputerList" data-role="listview" data-inset="true">
<li data-role="list-divider">
<div class="row">
<div class="column">
PC
</div>
<div class="column">
Lokasjon
</div>
<div class="column">
OS
</div>
<div class="column-last">
Språk
</div>
</div>
</li>
<!-- ko foreach: Computers -->
<li>
<div class="row">
<div class="column" data-bind="text: Name">
</div>
<div class="column">
<select data-bind="value: Location, options: $root.Locations, optionsText: 'Name', optionsValue: 'Value'">
</select>
</div>
<div class="column">
<select data-bind="value: OsParameter, options: $root.OsParameters, optionsText: 'Name', optionsValue: 'Value'">
</select>
</div>
<div class="column-last">
<select data-bind="value: Language, options: $root.Languages, optionsText: 'Name', optionsValue: 'Value'">
</select>
</div>
</div>
</li>
<!-- /ko -->
</ul>
</div>
</div>
And here am I binding the model to the view:
var viewModel = new pageViewModel();
ko.applyBindings(viewModel, document.getElementById("page1"));
$("#editComputerList", "#page1").listview("refresh");
$('#editComputerList select').selectmenu();
$('#editComputerList select').selectmenu('refresh', true);
Code can be seen here: http://jsfiddle.net/dankli/7hJ5d/
Does anyone have an idea of what I'm doing wrong or is it a bug in JQM?