We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Hi All,
I have a grid that has an autocomplete component in one of the columns.
Everithing is working fine, but i wanted for some columns of the grid to be updated after the field with autocomplete is changed. Please see the code bellow:
function write(args) {
autoCompleteEle = new ej.dropdowns.AutoComplete({
allowCustom: true,
value: args.rowData[args.column.field],
dataSource: @Html.Raw(Json.Serialize(ViewBag.ItemCode)),
fields: { value: 'Artigo', text: 'Artigo' },
popupWidth: '900px',
headerTemplate:
'<div class="row">' +
'<div class="col-md-3">Item Code</div> ' +
'<div class="col-md-9">Item Name</div></div>',
itemTemplate:
'<div class="row">' +
'<div class="col-md-3">${Artigo}</div>' +
'<div class="col-md-9">${Descricao}</div></div>',
change: (e) => {
I want to change the field ItemName to the value of ${ Descricao }
}
});
What i want to implement is that after the field ItemCode is updated the filed ItemName is also updated.
Thanks in advance for your help on this.
Kind regards
Hi Nuno,
Greetings from
Syncfusion support.
Based on your query,
you want to update the value of other columns based on the value of an edited
column. We have already discussed about this in the below documentation. Please
refer the below documentation.
Regards,
Joseph I.
Hi Joseph,
Thanks for the reply above. Its a workaround, but it was not exactly what i wanted.
What i was asking is similar to multiple columns in EJ1. A way to access other fields from the autocomplete list directly on the change event.
If you see my code, the autocomple is for data Artigo Artigo but the menu also shows the field descricao. What i wanted to know if its possible is to access the value of descricao on the change event.
I can always to a ajax call and return an object and update the grid, but i was wondering if there's a simpler way to access that data since i have it on the list for the autocomplete.
Kind regards
Nuno,
Before proceeding to the solution, please share the below details so that we will be able to validate further.
Hi,
Thanks for the assistance. I actually have done this a few weeks ago but forgot to reply to you.
I ended up doing like this and it works fine. If you have any suggestions on how to improve feel free.
autoCompleteEle = new ej.dropdowns.AutoComplete({
placeholder: 'Artigo',
floatLabelType: 'Always',
allowCustom: true,
value: args.rowData[args.column.field],
dataSource: @Html.Raw(Json.Serialize(ViewBag.ItemCode)),
fields: { value: 'Artigo', text: 'Artigo' },
popupWidth: '900px',
headerTemplate:
'<div class="row">' +
'<div class="col-md-3">Item Code</div> ' +
'<div class="col-md-9">Item Name</div></div>',
itemTemplate:
'<div class="row">' +
'<div class="col-md-3">${Artigo}</div>' +
'<div class="col-md-9">${Descricao}</div></div>',
change: (e) => {
$.ajax({
type: "POST",
url: "/PurchaseOrders/GetItemData",
data: {
itemCode: e.value,
__RequestVerificationToken: document.getElementsByName("__RequestVerificationToken")[0].value
},
dataType: "json",
success: function (data) {
document.querySelector("#GridItemName").value = data[0].Descricao;
document.querySelector("#GridUnit").value = data[0].UnidadeBase;
if (data[0].MovStock === "S") {
$("#GridWharehouse").prop('readonly', false);
} else {
document.querySelector("#GridWharehouse").value = "";
$("#GridWharehouse").prop('readonly', true);
}
},
error: function (result) {
alert("The operation resulted in an error");
}
});
Thanks for the
Hi Nuno,
We are glad that you were able to find the solution for your query.
