Dirty check for combo box - extjs

Question

I have a popup in which I have a dropdown. When I change the value of the dropdown to some other value it shows the orange triangle of the dirty check, but if I change the value of the drop down back to the previous value, the dirty check mark is still shown.
If the value is changed back to the original value in the dropdown, I want the dropdown to not show the dirty check mark.
Sharing my code
columns: {
defaults: {
align: 'left',
flex: 2
},
items: [{
xtype: 'actioncolumn',
localized: {
text: 'commonTranslations.function'
},
items: [{
iconCls: 'iwp-icon-gen_edit',
handler: 'onEditClick',
getTip: function() {
return I18n.get('commonIconTranslations.penReleaseConcepts')
}
}],
align: 'center',
flex: 1
},
{
localized: {
text: 'commonTranslations.description'
},
dataIndex: 'title',
renderer: CommonRendererUtils.htmlEncode
},
{
localized: {
text: 'commonTranslations.fileName'
},
dataIndex: 'filename',
renderer: CommonRendererUtils.htmlEncode
},
{
xtype: 'actioncolumn',
localized: {
text: 'commonTranslations.file'
},
items: [{
getClass: function(v, metadata, r) {
if (!r.get('filename')) {
return 'x-hidden'
} else {
return 'iwp-icon-zeb_folder'
}
},
getTip: function() {
return I18n.get('commonIconTranslations.halfOpenFolder')
},
handler: 'onDownloadClick'
}],
align: 'center',
flex: 1
},
{
localized: {
text: 'commonTranslations.source'
},
dataIndex: 'source',
flex: 1
},
{
localized: {
text: 'details.tabview.scope.contents.release.main.uploadDate'
},
dataIndex: 'changeDate',
xtype: 'dynamicTimestampColumn'
},
{
localized: {
text: 'details.tabview.scope.contents.release.main.uploadBy'
},
dataIndex: 'changeUser',
xtype: 'usercolumn'
},
{
localized: {
text: 'commonTranslations.status'
},
/*-----facing issue for the column*/
dataIndex: 'status',
renderer: function(value) {
return value.germanDescription;
}
},
{
localized: {
text: 'commonTranslations.changeReason'
},
dataIndex: 'changeReason',
renderer: CommonRendererUtils.htmlEncode
},
{
localized: {
text: 'commonTranslations.modulOrg'
},
dataIndex: 'modulOrgs',
renderer: function(value, metaData, record) {
if (record.isModified(metaData.column.dataIndex)) {
console.log("modified 9999999" + record.isModified(metaData.column.dataIndex));
metaData.tdCls += 'x-grid-dirty-cell';
}
var formattedValue = "";
if (value) {
value.forEach(function(modulOrg) {
formattedValue += modulOrg.modulOrg + ", ";
});
}
return formattedValue.substring(0, formattedValue.length - 2);
},
flex: 1
},
{
localized: {
text: 'details.tabview.scope.contents.release.main.historyIndex'
},
dataIndex: 'historyIndex',
flex: 1
}
]
}

Answer 1

I think you have too much code for this. Anyways there is a change event listener that you can add to your dropdown as follows:
listeners:{
change:'combochange'
}
Now you can write this combochange function inside your controller or you can defined this function inside your view only.
combochange:function(field,newValue,oldValue,e){
// Inside this function you will get both the values of the dropdown of
yours where newValue is the value currently selected and oldValue is the
previous value. So inside this function according to your conditions you
can put a check that if the old and newvalue matches then not to show the
orange triangle.
}
Let me know if any issue. Happy Learning :)