1

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: JQM issue

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?

1 Answer 1

1

I fixed this issue by setting data-role="none" on the select.

<select data-role="none" ...></select>

But I don't know if that is the way to go.

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.