Change Not binded Cell Text in QueryCellInfo process

Question

Hi,

I have a cell which is NOT binded to any data from json, this cell is the result of some rules I execute in QueryCellInfo process, this will show OK or ERROR.

My problem is I dont know how can I change this value when some of the binded cells dont pass the rule, because this special cells is not binded.

Example:

if (args.column.field === price) 
{
     let value = args.data[price];
     if (value<100)
     {
       //here change the text of the cell to "ERROR". Currently im working in the column price
     }

     return;
}

....Other rules for differen column.fields

Many thanks!!!

Many thanks!

Thiyagu Subramani · Accepted Answer

Hi Carlos,  

Thanks for contacting Syncfusion support.  

Based on your shared information we suspect that you want to change text value when some of the binded cells. According this we have updated the text for a particular cell using the queryCellInfo event using below code. Please refer it. 





querCellInfo: function (args) { 
      if (args.column.field === "Freight") { 
        let value = args.data["Freight"]; 
        if (value < 45) { 
          args.cell.textContent = 'Error'; 
        } 
        else { 
          args.cell.textContent = 'OK'; 
       } 
        return; 
      } 
    }, 


Sample link: https://codesandbox.io/s/vue-template-forked-q26eu 

Please get back to us, if you need any further assistance. 

Regards, 
Thiyagu S

Carlos Alarcon · Answer

Yes that works if I want to change the text of current cell, but in my case the text I want to change is located in another cell. textContext has the value of the current cell.

In short how can I change the text of cell2 when Im visiting cell1.?? NOTE: cell2 is not a binded cell.

Something like

ID | Name | Value | Status (not binded column)

1 | Jhon | 40 | ERROR

2 | Julia | 60 | OK

Thiyagu Subramani · Answer

Hi Carlos, 

Thanks for your update. 

Based on your shared information we would like to inform by default queryCellInfo event will triggers every time a request is made to access cell information, element, or data. This will be triggered before the cell element is appended to the Grid element. So using this we can’t to change the text value of not binded cell (next cell form previous cell). Its default behavior of current Grid architecture. For this we suggest to use rowDataBound event to achieve your requirement.  





rowDataBound: function (args) { 
      if (args.data["CustomerID"] === "VINET") { 
        args.row.getElementsByTagName("td")[2].textContent = "Error"; 
      } else { 
        args.row.getElementsByTagName("td")[2].textContent = "Ok"; 
      } 
    }, 


Sample link: https://codesandbox.io/s/vue-template-forked-3duqk?file=/src/App.vue 

If we still not fulfil your exact requirement, please share purpose of this requirement to us. 

Regards, 
Thiyagu S