user142617
user142617

Reputation: 386

Knockout - Is there a better approach to my binding

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

Answers (1)

Niloct
Niloct

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

Related Questions