CODEWITHSUNDEEP
jqueryjquery-mobileknockout.jsknockout-mvc
ExCode
ExCode

Reputation: 444

Bind a Model Object with multiple pages in jQuery Mobile with Knockout.js

I have knockout js Model, I want to bind that to two pages in jQuery mobile, the first page only contains read only attributes of the model and other page contains elements with which the user can update fields.

function ModelViewObject(){
    this.id = "1001";
    this.firstName = ko.observable("First Name"); 
    this.lastName = ko.observable("Last Name");
}

//This page only contains read only values
<div data-role="page" id="pageOne">
    <h1>Id : <span data-bind="text: id()</h1>
</div>

//This page can edit
<div data-role="page" id="pageTwo">
   <p>First name: <input data-bind="value: firstName" /></p>
    <p>Last name: <input data-bind="value: lastName" /></p>
</div>

I could bind it first page or second page at a time.I want to bind the model with two pages, I would really appreciate if some one can help me to solve this.

Thank you.

Upvotes: 0

Views: 218

Answers (1)

Andy
Andy

Reputation: 342

You can bind this way

ko.applyBindings(new ModelViewObject(), document.getElementById("pageOne"));
ko.applyBindings(new ModelViewObject(), document.getElementById("pageTwo"));

Upvotes: 1

Related Questions