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;
},
}
Hi,
Use select2 instead, it has ajax loading option.
@carlozSantiago, I know it's not a direct answer to your question, but have you checked out these issues: #46 #71?
@tabalinas , @heiovsky
I have try it,
but would only work to change items for other field (Dependency Dropdown),
not working when i want change or reload items for select itself,
i just want to change items for select itself not items for other field.
{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){
$("#jsGrid").jsGrid("fieldOption", "prodCatId", "items", data) <-----------------------------
},
error : function(error){alert('error')}
});
});
return $editControl;
},
}
hope it helps
@heiovsky , The code make table reload , i want it no reload ~
Can you explain your case? Why you need this behavior?
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;
},
}
found this fiddle http://jsfiddle.net/tabalinas/31cug9sa/
@heiovsky , yes
Right exactly like that
so we have 1 record, and add new record
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..
I have no idea at the moment, I think, I will face this issue in couple of weeks and maybe then I find a solution