0

I have radio buttons which are observable and depending on the value i want to trigger a GETJSON method to return my data and then push it to an observable array that i am displaying as a list. The error i am getting is Cannot read property 'push' of undefined. Here is my Fiddle

How do i get this Data to my observable Array after the radio button is clicked triggering the getjson method?

self.currentAnswer = ko.observable();
    self.recipientList = ko.observableArray([]);
self.currentAnswer.subscribe(function (newValue) {
    if (newValue == 'Internal') {
        $.getJSON('GetInfo', function (data) {
            var result = $.parseJSON(data);

            self.recipientList.push(result);


        });
2

2 Answers 2

1

Things to consider:

  • $.getJSON() will parse the JSON for you, you never need to do that yourself. This is also true for $.get(). (*)
  • Knockout observables are functions. You can use them as callbacks. (**)

With this knowledge:

self.recipientList = ko.observableArray();
self.currentAnswer = ko.observable();
self.currentAnswer.subscribe(function (newValue) {
    if (newValue == 'Internal') {
        $.get('GetInfo').done(self.recipientList);
    }
});

(*) If you do not get parsed JSON in your success callback, fix the Content-Type header of your response.

(**) If you call an observable and pass a value as first argument, it will store that value. Coincidentally jQuery calls Ajax success callbacks passing the returned value as the first parameter. Perfect fit.

6
  • Was not aware of that, very neat! Mar 25, 2016 at 15:09
  • 1
    Compare this fiddle with a few improvements (and an actual Ajax request): jsfiddle.net/jsw1ezut/11
    – Tomalak
    Mar 25, 2016 at 15:12
  • that is cool with the ajax call, i am not familiar with the use of params. Also, ultimately what i am trying to accomplish is loading a text area with the JSON data moved into the items observable array and making it selectable to send back to the server. Thank you for this awesome answer! Mar 25, 2016 at 15:23
  • It's always a good idea to set up Viewmodels so that they accept an object and initialize themselves from that object. Makes creating and re-using them much simpler.
    – Tomalak
    Mar 25, 2016 at 15:45
  • 1
    Meditate over the second bullet point in my answer for a moment. :)
    – Tomalak
    Mar 25, 2016 at 15:51
1

I updated your Fiddle so that it works. Basically you need to call self.recipientList.push.apply(self.recipientList, result);

https://jsfiddle.net/jsw1ezut/9/

3
  • This works but it is pushing into the recipient list array, i am trying to get it into the items array. Mar 25, 2016 at 14:55
  • @Leonardo There is no items array in your sample code.
    – Tomalak
    Mar 25, 2016 at 14:56
  • I made an update based on @TSV comment earlier. jsfiddle.net/Domt301/c54x6d14 Mar 25, 2016 at 15:05

Your Answer

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

Not the answer you're looking for? Browse other questions tagged or ask your own question.