title: Difficulty with upload csv to knockout js table (ASP MVC)
body: <p>I've been working with these two tutorials, but am having difficulty merging them together to get an upload csv to populate the table. It most likely is my lack of understanding of the view model.</p>
  
  <p>Here's the tutorial for the knockout js editable table from the knockout js site: <a href="http://knockoutjs.com/examples/gridEditor.html" rel="nofollow noreferrer">KnockoutJS: Editable Grid Table</a></p>
  
  <p>And here's the tutorial for uploading a csv I'm referencing:</p>
  
  <p><a href="http://www.c-sharpcorner.com/article/knockoutjs-upload-csv/" rel="nofollow noreferrer">   KnockoutJS - Upload CSV</a></p>
  
  <p>Here's the javascript code I've been working on to upload a csv to my table.  I keep getting "JavaScript runtime error: Unable to get property 'push' of undefined or null reference" - I marked in comments the problem spot.  As you can see, I'm having trouble with the view model.</p>
  
  <pre><code>&lt;script&gt;
      var UserModel = function (users) {
          var self = this;
          self.users = ko.observableArray(users);
  
          self.addUser = function () {
              self.users.push({
                  id: "",
                  firstName: "",
                  lastName: ""
              });
          };
  
          self.removeUser = function (user) {
              self.users.remove(user);
          };
  
          self.save = function (form) {
  
              sendData = ko.toJSON(self.users);
  
  
              $.ajax({
                  url: '/Users/CreateMultiple',
                  contentType: 'application/json',
                  async: true,
                  type: 'POST',
                  dataType: 'json',
                  data: sendData,
                  error: function (jqXHR, textStatus, errorThrown) {
                      console.log("FAIL: " + errorThrown);
                  },
                  success: function (data, textStatus, jqXHR) {
                      console.log("SUCCESS");
                  }
              });
  
  
          };
      };
  
      var viewModel = new UserModel([
          { id: "", firstName: "", lastName: "" }
      ]);
      ko.applyBindings(viewModel);
  
      // Activate jQuery Validation
      $("form").validate({ submitHandler: viewModel.save });
  
  
      /////
      /////Upload CSV 
      /////
  
  
      $('#lnkUpload').click(function () {
          var FileToRead = document.getElementById('UserFile');
          if (FileToRead.files.length &gt; 0) {
              var reader = new FileReader();
  
              reader.onload = Load_CSVData;
  
              reader.readAsText(FileToRead.files.item(0));
  
          }
      });   
  
      function Load_CSVData(e) {
  
  
          CSVLines = e.target.result.split(/\r\n|\n/);
          $.each(CSVLines, function (i, item) {
  
              var element = item.split(",");
              var csvID = (element[0] == undefined) ? "" : element[0].trim();
              var csvFirstName = (element[1] == undefined) ? "" : element[1].trim();
              var csvLastName = (element[2] == undefined) ? "" : element[2].trim();
  
  
  
              UserModel.users.push(new UserModel()//here's my problem
                  .id(csvID)
                  .firstName(csvFirstName)
                  .lastName(csvLastName)
  
              )
          });
      }  
  
  &lt;/script&gt;
  </code></pre>