knockout.js - Knockout observable array not updating the UI -


i calling web service , json data. after using knockout js binding table.after when user type in text bax filters data , show in ui. not working. please find code below.

 <script src="../../scripts/jquery-1.10.2.min.js"></script> <script src="~/scripts/knockout-3.3.0.js"></script> @{     viewbag.title = "alltasks"; }  <script type="text/javascript">     var viewmodel;     var url = 'http://localhost:22653/api/alltasks';     $(document).ready(function () {         debugger;         var fajobviewmodel = function () {             var self = this;             self.parameters = ko.observablearray();             var alltask = json.parse(readjson(url));             function readjson(file) {                 var request = new xmlhttprequest();                 request.open('get', file, false);                 request.send(null);                 if (request.status == 200)                     return request.responsetext;             };             self.parameters = ko.observablearray(alltask);               self.query = ko.observable('');             self.search = function (value) {                 self.jobidparameters = ko.observablearray();                 debugger;                 (var x in alltask) {                     if (alltask[x].jobnumber.tolowercase().indexof(value.tolowercase()) >= 0) {                         self.jobidparameters.push(alltask[x]);                     }                 }                 self.parameters = self.jobidparameters;              };          }         viewmodel = new fajobviewmodel();         viewmodel.query.subscribe(viewmodel.search);         ko.applybindings(viewmodel, document.getelementbyid("alltask"));     }     );   </script> <div id="alltask" class=" container-fluid" style="margin-top:50px">     <span>jobid</span><input id="txtsearch" placeholder="search…" type="search" data-bind="value: query, valueupdate: 'keyup'" autocomplete="off">     <input type="button" id="btnsearch" value="search" " />     <table border="1">         <thead>             <tr>                 <th>job id</th>                 <th>requestor</th>                 <th>test name</th>                 <th>priority</th>                 <th>createddate</th>             </tr>         </thead>         <tbody data-bind="foreach:parameters" class=" container-fluid">             <tr>                 <td><span data-bind="text:jobnumber"></span></td>                 <td><span data-bind="text:requestor"></span></td>                 <td><span data-bind="text:taskabbreviation"></span></td>                 <td><span data-bind="text:priority"></span></td>                 <td><span data-bind="text:createddate"></span></td>             </tr>         </tbody>     </table> </div> 

issue exists assigning resultant filtered data need avoid using = , use () convention instead keep 2 way binding intact .

viewmodel :

self.original= ko.observablearray(alltask); self.parameters = ko.observablearray(alltask); self.search = function (value) {         if(!value){self.parameters(self.original())}         var arr= [];         ko.utils.arrayforeach(self.original(),function(item){         if (item.jobnumber().tolowercase().indexof(value.tolowercase())>= 0)              {                  arr.push(item);              }         });           self.parameters(arr);     }; 

i made small changes correct functionality . hope helps .


Comments

Popular posts from this blog

javascript - Using jquery append to add option values into a select element not working -

Android soft keyboard reverts to default keyboard on orientation change -

jquery - javascript onscroll fade same class but with different div -