Select Field : is it possible to reload via ajax on editTemplate?

Is it possible to reload select field items on it field self when editTemplate is called? I try to do like this but not running sorry my English is not good

 {title:"Category",type:"select", name:"prodCatId", items:dataCategory,valueField:"prodCatId",textField:"prodCatDesc",
  editTemplate : function(){
   var sbuField = this._grid.fields[0];
   var $editControl = jsGrid.fields.select.prototype.editTemplate.call(this,arguments);
    
    $editControl.on("change", function(){
     var selectedSbuId = sbuField.editControl[0].value;
     var selectedprodCatId = $(this).val();
     $.ajax({
      type: "POST",
       url: "./getDataCategoryList",
       data:{"sbuId":selectedSbuId,"prodCatId":selectedprodCatId},
       success: function(data){
        dataCategory =  data
       },
       error : function(error){alert('error')}
      }); 
    });
    return $editControl;
 },
}

[carlozSantiago]

@heiovsky , yes Right exactly like that

1. select country canada
2. select state A2
3. add

so we have 1 record, and add new record

1. select country United States
2. select state A1
3. add

now we have 2 different record, then click on Canada record, state field is empty. . how do i showed the data and choice ??

in my case, country and state items in deferent source. and state items have dynamic value depend on selected country. Sorry my English is not good…

[carlozSantiago]

I have 3 dependency dropdown, categoryA, categoryB, categoryC. the items of categoryC(items:dataCategory) depends on what i chose in the categoryA and categoryB, i use ajax to hit server and get list, it works and items for categoryC is change,

The problem when i chose dropdown on the other row into editing mode where the value(valueField:“prodCatId”) of the dropdown was not found in list(dataCategory) which i got before, so the dropdown showing empty,

ex:

i try to reload just items (items:dataCategory) on $editControl, i use ajax again to hit server . In the hope of items(items:dataCategory) will be load again based on value of categoryA and categoryB in that row…

{title:"Category",type:"select", name:"prodCatId", items:dataCategory,valueField:"prodCatId",textField:"prodCatDesc",
  editTemplate : function(){
   var sbuField = this._grid.fields[0];
   var $editControl = jsGrid.fields.select.prototype.editTemplate.call(this,arguments);
    
    $editControl.on("change", function(){
     var selectedSbuId = sbuField.editControl[0].value;
     var selectedprodCatId = $(this).val();
     $.ajax({
      type: "POST",
       url: "./getDataCategoryList",
       data:{"sbuId":selectedSbuId,"prodCatId":selectedprodCatId},
       success: function(data){
        dataCategory =  data
       },
       error : function(error){alert('error')}
      }); 
    });
    return $editControl;
 },
}