# Other Languages > jQuery >  [RESOLVED] Rebinding Problem with Jquery knockout.js with MVC

## vuyiswamb

Good Day Guys 

This is an MVC , JQuery, KNockout.js Question. 

i have a Controller Action that is being Defined like this 




```
 [HttpGet]
        public JsonResult SearchCars(string searchString)
        {

            string[] searchTerms = (searchString).ToUpper().Split(new char[] { ' ' }, StringSplitOptions.RemoveEmptyEntries);

            string[] searchTermSounds = new string[searchTerms.Length];
 
            var list = (from r in Cache.CarSearchItems
                       select new Lightstone.UI.Web.LaceWebUI.Models.CarItem(r, searchTerms, searchTermSounds)).ToList();

            var list1 = list.Distinct()
                             .Take(5)
                             .OrderByDescending(l => l.Hits).ToList();

            return Json(list1, JsonRequestBehavior.AllowGet);
        }
```


and i have  a Jquery function that gets fired onkey up event is fired in a textbox like this




```
$(function () {
    $("#txtSearchString").keyup(function () {

        $("#txtSearchString").queue(function 
            () {
            var _this = $(this);
            _this.addClass("newcolor");
            _this.dequeue();
        });


        if ($("#txtSearchString").val().length >= 3) {
            var data = {}
            data.searchString = $("#txtSearchString").val();
            alert("Retrieving Data");
        
            $.getJSON("/Cars/SearchCars", data, function (result) {
                //Autocomplete binding
                var viewModel = null;

                viewModel =
                 { 
                     SearchOptions: ko.observableArray(result) // These are the initial options 
                 }
                alert("Done Retrieving Data");

                if (viewModel == null || viewModel == undefined) {
                    alert("The ViewModel is null or Undefined");
                 
                    alert("Done with the View Model");
                }
                else {
                    ko.applyBindings(viewModel);
                    alert("THe View Model is no Null");
                }
              


            });

        }

    })
});
```

dont mind my alerts i use them  to check the code reaches the place that i want it to reach. I can get the Jason the first time and this is the order of my alerts 



```
  alert("Retrieving Data");
  alert("Done Retrieving Data");
 alert("THe View Model is no Null");
```

and then i bind the data to my HTML view as depicted below 




```
<table  id="tblsearchresults"  data-bind="foreach:SearchOptions"  class="auto-style1">
        <tr>
            <td rowspan="5">
                <img data-bind="attr: {src: Url}" class="" />
            </td>
            <td>Make:</td>
            <td>
                <div data-bind="text: Make">
                </div>
            </td>
            <td>&nbsp;</td>
        </tr>
        <tr>
            <td>Model:</td>
            <td>
                <div data-bind="text: Model">
                </div>
            </td>
            <td>&nbsp;</td>
        </tr>
        <tr>
            <td>Year:</td>
            <td>
                <div data-bind="text: Year">
                </div>
            </td>
            <td> <a data-bind="attr: { href: UrlRedirect }">
                View Report</a>

            </td>
        </tr>
        <tr>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
        </tr>
        <tr>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
        </tr>
    </table>
```


and i see the data when i search for the first time and the images appears nicely and then the Problem start when i change my search string lets say i now type "FORD"



```
     <input id="txtSearchString" name="txtSearchString" class="searchText" />
```


and it does not return results, when i look at the F12 debugging tool in chrome it point to my JavaScript  in the following line 



```
  ko.applyBindings(viewModel);
```

and in my 



```
Uncaught Error: NOT_FOUND_ERR: DOM Exception 8 knockout-2.1.0.js:46
a.e.Fa knockout-2.1.0.js:46
a.a.Oa knockout-2.1.0.js:81
a.Fb.a.h.disposeWhenNodeIsRemoved knockout-2.1.0.js:75
e knockout-2.1.0.js:34
a.h knockout-2.1.0.js:36
a.Fb knockout-2.1.0.js:75
a.c.template.update knockout-2.1.0.js:76
a.c.foreach.update knockout-2.1.0.js:66
a.h.disposeWhenNodeIsRemoved knockout-2.1.0.js:51
e knockout-2.1.0.js:34
a.h knockout-2.1.0.js:36
d knockout-2.1.0.js:49
c knockout-2.1.0.js:49
b knockout-2.1.0.js:49
c knockout-2.1.0.js:49
b knockout-2.1.0.js:49
c knockout-2.1.0.js:49
b knockout-2.1.0.js:49
c knockout-2.1.0.js:49
b knockout-2.1.0.js:49
c knockout-2.1.0.js:49
b knockout-2.1.0.js:49
c knockout-2.1.0.js:49
a.xa knockout-2.1.0.js:52
(anonymous function) AutoCompleteResults.js:33
jQuery.Callbacks.fire jquery-1.7.2.js:1075
jQuery.Callbacks.self.fireWith jquery-1.7.2.js:1193
done jquery-1.7.2.js:7538
jQuery.ajaxTransport.send.callback jquery-1.7.2.js:8324
```

So everytime i do my search for the first time it works but for the second time  it does not. 

One other solution that i need is to delay the call of the keypress for 250 milliseconds. 

Thanks

----------


## szlamany

You are trying to visit the server with an AJAX call for each and every keyup event?

Have you had success doing something that heavy?

----------


## vuyiswamb

what i do i go once into the database and store the data in a server Catche and go and query that catch if the catch has data. 

Except keyup which other event for the textbox can you suggest and in this situation how can i implement the delay Jquery function and clear the que so that the request cannot be fired every keyup.

----------


## szlamany

I've had really good experiences with downloading entire "search lists" in a single call to the server - and kept that local in the client and then used jQuery autocomplete type widgets to work the data.

Very fast experience for the user.

----------


## vuyiswamb

That is exactly what i am doing , but is the Keydown a good event to handle this ?

----------


## vuyiswamb

The Problem happens when Knockout tries to Bind the ViewModel to the same node multiple times. seting the viewmodel to null will not work , so to resolve this i explicidly binded the tablelement, and after that i clear the node before i bind a Viewmodel




```
 

ko.cleanNode(document.getElementById("tblsearchresults"));
```

----------

