javascript - KnockoutJS 3.3.0 binding seems to be delayed until I press ENTER -

this weird one.

here view:

<table class="selectedperson">     <tr><td>emp id</td><td><input data-bind="value : empid, event : { keypress : loadjson }" type="text" /></td></tr>     <tr><td>net id</td><td><input data-bind="value : netid, event : { keypress : loadjson }" type="text" /></td></tr>     <tr><td>first name</td><td><input data-bind="value : firstname, event : { keypress : loadjson }" type="text" /></td></tr> </table> 

and results

<table>     <thead>         <tr>             <td>employeeid</td>             <td>netid</td>             <td>firstname</td>             <td>lastname</td>         </tr>     </thead>     <tbody id="personlistviewmodel" data-bind="foreach : people">         <tr>             <td data-bind="text : empid"></td>             <td data-bind="text : netid"></td>             <td data-bind="text : firstname"></td>             <td data-bind="text : lastname"></td>         </tr>     </tbody> </table> 

my viewmodel

    var viewmodel = function (empid, netid, firstname) {         var self = this;         self.empid = ko.observable(empid);         self.netid = ko.observable(netid);         self.firstname = ko.observable(firstname);         self.people = ko.observablearray([]);          self.loadjson = function (data, event) {             var objectify = ko.tojs(self);             console.log(objectify.empid);             if (event.which == 13) {                 var objectify = ko.tojs(self);                 console.log(objectify.empid);                 console.log(ko.tojson(self));                  $.ajax({                     datatype: "json",                     url: '/home/getrecords',                     data: {                         "json": ko.tojson(data)                     },                     success: function (data) {                         self.people(data);                         console.log(data);                     },                     error: function () {                         alert("error");                     }                 });              }              return true;         };     };      var vm = new viewmodel();     ko.applybindings(vm); 

it talks c# method accepts json in parameter , returns results based on enter. bit works fine in isolation.

however here happens: imagine database

[ {"empid":"123", "firstname":"jim"}, {"empid":"124", "firstname":"bob"} ] 

1. type 123 in empid field
2. press enter
3. no results
4. press enter again
5. correct result ie jim displayed in results firstname match
6. change empid 124
7. press enter
8. same result ie jim still displayed in results firstname match
9. press enter again
10. correct result ie bob displayed in results firstname match.

any ideas?

you should using keyup event. reason 1 key behind model hasn't updated.

<table class="selectedperson">     <tr>         <td>emp id</td>         <td>             <input data-bind="value : empid, event : { keyup : loadjson }" type="text" />         </td>     </tr>     <tr>         <td>net id</td>         <td>             <input data-bind="value : netid, event : { keyup : loadjson }" type="text" />         </td>     </tr>     <tr>         <td>first name</td>         <td>             <input data-bind="value : firstname, event : { keyup : loadjson }" type="text" />         </td>     </tr> </table> 

working example: https://jsfiddle.net/w7c596l0/