6

I have a scenario where I am defining the mutators below and when I edit the cell it does not work where common mutators are used? I guess this is a bug or is there any other way to do it?

 var diffMutator_FEcontacted = function (value, data, type, params, component) {
    var start = moment(data.incident_start, 'DD/MM/YYYY HH:mm')                   
    var end = moment(data.First_expert_contacted_by_SE, 'DD/MM/YYYY HH:mm')       //common feild
    var new_value = end.diff(start, 'minutes');
    if (type == "edit") {
      console.log('edit');
      component.getRow().getCell("time_to_contact_first_exp_calc").setValue(new_value);
      return value;
    } else {
      return new_value
    }
  }

  var diffMutator_REcontacted = function (value, data, type, params, component) {
    var start = moment(data.incident_start, 'DD/MM/YYYY HH:mm')
    var end = moment(data.Right_expert_found_at, 'DD/MM/YYYY HH:mm') //common feild
    var new_value = end.diff(start, 'minutes');
    if (type == "edit") {
      console.log('edit');
      component.getRow().getCell("Time_to_find_right_exp_calc").setValue(new_value);
      return value;
    } else {
      return new_value
    }
  }

  var diffMutator_FEREdiff = function (value, data, type, params, component) {
    var start = moment(data.First_expert_contacted_by_SE, 'DD/MM/YYYY HH:mm')    //common feild in another fucntion
    var end = moment(data.Right_expert_found_at, 'DD/MM/YYYY HH:mm') //common feild in another function
    var new_value = end.diff(start, 'minutes');
    if (type == "edit") {
      console.log('edit');
      component.getRow().getCell("time_diff_FE_RE").setValue(new_value);
      return value;
    } else {
      return new_value
    }
  }

Rather, I would explain this as mutator is not working on common fields. Here is the fiddle explained with this above use case:

jqueryHtmlCSS
  • 1,587
  • 2
  • 12
  • 20
John
  • 117
  • 9
  • 1
    Please post a link to a JS fiddle that shows ur code in action. Without seeing your table setup and how you have bond the mutator to your columns it is impossible to offer the correct advice – Oli Folkerd Nov 28 '20 at 17:25
  • 1
    @OliFolkerd I have created a dummy model of the same of what I want to achieve, here is the [fiddle](https://jsfiddle.net/ohzeyvga/22/) – John Nov 29 '20 at 07:47

1 Answers1

0

This is happening because the mutator functions are called only when their field is updated, each individual function is not aware if it depends on any other fields in the table.

I would suggest that in the cellEdited callback for the edited column, you include a row.update to trigger the updates on dependent columns.

so for example the "TimeDiff" column is depended on the "TimeStart" column, so in the definition for the TimeStart column you should include the following:

{title: "Start Time", field: "TimeStart", cellEdited:function(cell){
    cell.getRow().update({TimeDiff:true});
}},

This will then trigger the mutation of the dependent TimeDiff mutator when TimeStart is edited

Oli Folkerd
  • 5,658
  • 1
  • 19
  • 35
  • can you please demonstrate the same in this [link] (https://jsfiddle.net/ohzeyvga/22/) , I tried the same but seems it doesn't works as expected and moreover it would help others finding the same solution. – John Jan 05 '21 at 06:27