I need to create a combo box in order to set some field.
The field can be required or not required. if it's not required I want to display the "Not set" value as first in the store and separate it from the rest of the values.
It will enable the user to select the "Not set" value from the drop down list and do not assign any value to the field.
if the field is required user must set a value from the store but cannot select the "Not set" value.
the store consist of large number of values and instead of using two different stores I added some logic to add/remove the so called "Not set" ModelData from the store accorrding to the field required property.
Also added XTemplate condition for the separator. only when "Not set" value is displayed the separator is displayed. the "Not set" ModeData has separated value set to true

private native String getCellTemplate() /*-{
return [
'<tpl for=".">',
'<div class="x-combo-list-item" style="font-size: 12px">',
'<tpl if="values[&quot;separated&quot;] == true"><hr /></tpl>',

when first opening required field and then not required field everything is ok. but then the separator (<hr/>) is always displayed or always hidden regardless the "separated" value
Any idea what can cause this issue?