Go To first page returns Previously used data in Kendo Grid

[Dimantha]

Dear Kendo Team,

I am using a kendo combobox which displays util codes which belongs to each customer water meter. When user selects one
util code the kendo grid will populate the meter reading belongs to that meter. Now suppose that the user selects one customer 
util code from kendo combobox it is calling a handler HandlerGetUtilsDetails.ashx. 

My first question is the handler get called twice when I choose a util code. This was recognize as a bug in kendo combobox Our developers are still facing this issue.Is there anyway that we can prevent multiple calls to the handler?

The second issue is think that you get some results for a given util code. You should be able to navigate through the grid
using the paging available. Suppose you want to check another util code then the user will again choose the relavent util
code. Now the problem is the user navigates to the end of the result using the page numbers and select go to first page
button in the kendo grid navigation bar. Now instead of showing the first page of the current records it shows previous
result  first page( result belongs to the previous util code details which the user browse little bit earlier).

I am sending my code to you guys to review. A quick solution is highly appreciated because we cannot go down with development.
Cheers!!!

My code block looks like this

<script type="text/javascript">
    
$(document).ready(function () {
   $("#DropDownList1").width(500).kendoComboBox();

var destroyer1;
var destroyer2;

$("#DropDownList1").kendoComboBox({
placeholder: "Select Meter...",
dataTextField: "Display",
dataValueField: "CustCode",

suggest: true,
dataSource: {
serverFiltering: true,
serverPaging: true,
transport: {
read: function (options) {
var persons;
var new_obj;
var done;
destroyer1 = $.ajax({
url: "HandlerGetUtils.ashx",
dataType: "text",
success: function (result) {
// notify the DataSource that the operation is complete
persons = '';
persons = result.split(",");
new_obj = { data: [] };
for (var a = 0; a < persons.length - 1; a++) {
var temp = persons[a].split(":");
for (var b = 0; b < 1; b++) {
    
if (temp[2] == "" && temp[1] != "undefined") {
new_obj.data.push({
CustCode: temp[0] + "," + temp[1],
UtilCode: temp[1],
Display: temp[1] + "-" + temp[3]
});
done = new_obj.data;
result = done;
options.success(result);
}
if (temp[2] != "" && temp[1] != "undefined") {
new_obj.data.push({
CustCode: temp[0] + "," + temp[1],
UtilCode: temp[1],
Display: temp[1] + "-" + temp[2]
});
done = new_obj.data;
result = done;
options.success(result);
}
}
    
}
    
}
});
}
}
}
});
    
var combobox = $("#DropDownList1").data("kendoComboBox");
    
combobox.bind("change", function (e) {
// handle event
 
// bind to the change event
var value1 = combobox.value();
var valueselector = value1.split(",");
var text1 = combobox.text();
var hell = null;

destroyer2 = $.ajax({
url: "HandlerGetUtilsDetails.ashx",
data: { utilcodes: EncodeURIC(valueselector[1]), customercodes: EncodeURIC(valueselector[0]) },
dataType: "json",
   cache:false,
success: function (result) {
   // notify the DataSource that the operation is complete
   if (valueselector[1] != "undefined" && valueselector[1] != null && valueselector[1] != "" ) {
       
       if (result != "" && result != "undefined" && result != null && result != "[]") {
           hell = null;
           hell = result;
           $("#gridMeterReading").kendoGrid({
               dataSource: {
                   data: hell,
                   pageSize: 12,
                   schema: {



                       model: {

                           fields: {
                               ReadDate: { field: "ReadDate", type: "date", format: "{0:dd/MM/yyyy}" },

                           }
                       }
                   }
               },

               pageable:true,
               groupable: true,
               sortable: true,
               scrollable: false,
               filterable: true,
               columns: [
                                    { field: "Meter", title: "Meter" },
                                    { field: "ReadDate", title: "ReadDate", type: "date", format: "{0:dd/MM/yyyy}" },
                                    { field: "Reading", title: "Reading" },
                                    { field: "UtilCode", title: "UtilCode" },
                                    { field: "Actual", title: "Actual" }

               ]








           });
                            
       

           var dataSource = $("#gridMeterReading").data("kendoGrid").dataSource;
           var filters = dataSource.filter();
           var allData = dataSource.data();
           dataSource.cache(false);
           var historyCount = history.length;
           history.go(-historyCount);

       }
       else{

                            
           var data = "";
           var dataSource = new kendo.data.DataSource({
               data: data,
               pageSize: 12
           });
           $("#gridMeterReading").kendoGrid({
               dataSource: dataSource,
               pageable: true,
               groupable: true,
               sortable: true,
               scrollable: false,
               filterable: true,

               columns: [
                                    { field: "Meter", title: "Meter" },
                                    { field: "ReadDate", title: "ReadDate" },
                                    { field: "Reading", title: "Reading" },
                                    { field: "UtilCode", title: "UtilCode" },
                                    { field: "Actual", title: "Actual" }

               ]

           });
       }

      
   }
}
});

});
    
});
</script>

[Daniel]

Hello Dimantha,

The change event is probably triggered twice because it is initialized twice:

$("#DropDownList1").width(500).kendoComboBox();

        var destroyer1;
        var destroyer2;

        $("#DropDownList1").kendoComboBox({
        ....

Check if removing the first initialization resolves the problem. If it persists, I will need a runnable sample to check what exactly goes wrong.
The Grid is also initialized each time the event is triggered. You should just filter the data with the dataSource filter method to show the correct result. If this is not possible in your scenario you should destroy it before creating the new Grid. Regards,
Daniel
the Telerik team