Reputation: 386
Some advice please I have setup a fiddle here:
http://jsfiddle.net/tonymaloney1971/cagnL1o1/6/
var data = [{ PostCodeStart: "", PostCodeEnd: "", Mileage: "", Notes: "" }];//[{ PostCodeStart: "PO200QW", PostCodeEnd: "SE1 9FD", Mileage: "127", Notes:"Hello World" }];
var viewModel = {
journeyList: ko.observableArray(data),
journeyListNotBound: [],
add: function (data) {
if (data.PostCodeStart === "" || data.PostCodeEnd === "" || data.Mileage === "") {
alert("empty field");
}
else {
//Do I need this journeyListNotBound
viewModel.journeyListNotBound.push({ PostCodeStart: data.PostCodeStart, PostCodeEnd: data.PostCodeEnd, Mileage: data.Mileage, Notes: data.Notes });
viewModel.journeyList.push({ PostCodeStart: postCodeStart, PostCodeEnd: postCodeEnd, Mileage: mileage, Notes: notes });
}
},
remove: function (data) {
viewModel.journeyList.remove(data);
}
};
Now, each time the user presses the + button I would like to have Start Post code, End Post code, and Mileage and notes all start with an empty string. I have achieved this( with the help of ROY ) but with the use of a normal Javascript array ( journeyListNotBound ) so we have a KO array and Javascript array is there no way we can do this with only a KO array ?
Thanks
Upvotes: 0
Views: 31
Reputation: 10015
See if http://jsfiddle.net/kjv07wrg/ is more like you wanted.
I made a custom class JourneyStep
and assigned an object with empty properties for each new step. Also, the viewModel
which now is a function was called with new viewModel()
. I changed the Plus button to appear only once in the UI, and every step kept its remove button.
Upvotes: 1