Question

i have ajax call which is returning data to me .

Say i have ajax returning data

$.ajax({
            url : "quoteSearch",
            dataType : "json",
            data : $("#searchCriteria").serialize(),
            success : function(data) {
                populateTable(data);

            },
            error : function(data) {
                console.log(data);
            }
        });

Now i want to use this table data to update the UI.

Say if i add 10 to input box. and click go button it should add 10 to all quotes of the column.

How should i do this.

Answer 1

You seem to be asking how to use the data returned by the ajax call from another part of your code at a non-specific time depending on when the user clicks a button. If so, you can save data in a variable with scope outside the ajax call, then access it from other parts of your code:

var ajaxData;

$.ajax({
   url : "quoteSearch",
   dataType : "json",
   data : $("#searchCriteria").serialize(),
   success : function(data) {
      ajaxData = data;
      populateTable(data);
   },
   error : function(data) {
      console.log(data);
   }
});

$("#yourbutton").click(function(){
   // do something with ajaxData
   if (typeof ajaxData != "undefined") {
      var valueToAdd = $("#yourinput").val();
      // your processing here
   }
});

The undefined test is to allow for if you click the button before the ajax call has finished at which point ajaxData would (obviously) not yet have a value.

You may want to update your populateTable() function so that it takes a parameter with the value to add. Then inside your ajax success you set that parameter to 0, but inside your button click handler you set that parameter to the value of your input. Presumably your populateTable() function already knows how to retrieve the values from data, so you can do the extra addition within that functionality. I really can’t advise anything more specific without seeing the rest of your code.