Databases
StackOverflow2013
Postsdbo
POHow to Initialize Select/Combobox using Knockout for CRUD Page - jQuery Mobile
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POHow to Initialize Select/Combobox using Knockout for CRUD Page - jQuery Mobile
    primarykey
    data
    text
    <p>UPDATE: As nemesv says below, the code works fine with native knockout. As soon as I add JQM 1.20, the select does not initialize. Here is the fiddle <a href="http://jsfiddle.net/woodsman/fYPW4/1/" rel="nofollow">http://jsfiddle.net/woodsman/fYPW4/1/</a> If you check the JQM 1.2 box and rerun, you will see that the select doesn't initialize. Do I need to refresh the select similar to a jqm listview?</p> <p>ORIGINAL POST: I'm trying to simulate a simple CRUD page using Knockout to bind a combo box/select element. The idea is to load myCar and edit the model of car using the combobox/select element to update the foreign key id which could be then be saved back to the database. I have the following very simple view/viewModel to simulate the data: </p> <pre><code>var ViewModel = function () { self.myCar = { owner: ko.observable('Joe'), modelId: ko.observable(3) }; self.models = ko.observableArray( [{id:1, name:'Ford'}, {id:2, name:'Toyota'}, {id:3, name:'Audi'}, {id:4, name:'BMW'}] ); }; $(document).one("wijappviewpageinit", function () { var vm = new ViewModel(); ko.applyBindings(vm); }); &lt;div data-role="appviewpage" &gt; &lt;div data-role="content"&gt; &lt;select data-bind="options: models, optionsText: 'name', value: myCar.modelId, optionsValue: 'id'"&gt;&lt;/select&gt; &lt;label&gt;Owner from myCar.owner&lt;/label&gt; &lt;h2 data-bind="text: myCar.owner"&gt;&lt;/h2&gt; &lt;label&gt;Id from Select&lt;/label&gt; &lt;h2 data-bind="text: myCar.modelId"&gt;&lt;/h2&gt; &lt;label&gt;Input To verify 2-Way binding&lt;/label&gt; &lt;input type="number" data-bind="value: myCar.modelId"/&gt; &lt;/div&gt; &lt;script src="../../js/wijcombotest.js"&gt;&lt;/script&gt; </code></pre> <p></p> <p>The bindings for events after the load work fine. If I make a selection, the modelId in myCar updates. If I update the id in the input, the select updates. The only problem I have is on initial load, the select does not show the initial value of the myCar.modelId. </p> <p>What do I need to add to the viewModel and/or markup in order to have the select show the initial value loaded from myCar?</p> <p>FYI, I don't think it matters but I am implementing in JQueryMobile and the Wijmo Appview.</p> <p>Thanks for your help</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USWoods
    1. USWoods
    plurals
    1. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. COBut it seems that your issue is connected to your other libraries because the plain Knockout solution works just fine http://jsfiddle.net/fYPW4/
      singulars
      1. POHow to Initialize Select/Combobox using Knockout for CRUD Page - jQuery Mobile
      1. USnemesv
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload