Change default editorType or override default properties

[gwque]

I've searched the docs and forums but have not found an answer I was hoping you could help with.

I'd like all TextItems to default to characterCasing: 'upper'. I tried setting the defaults on the type as follows:

isc.TextItem.addProperties({
browserSpellCheck: false,
maskPromptChar: "",
characterCasing: 'upper'
});

This works, but it causes problems for a ComboBoxItems with filterLocally: true and addUnknownValues:false. When entering search text into a ComboBox after setting the above, the combobox appears to throw out all entered text except the last character entered. This is in Firefox developer v80.0b and in MS Edge. As an example, replace the js code on your masked edit sample page (https://www.smartclient.com/smartcli...maskedTextItem) with this:

isc.TextItem.addProperties({
browserSpellCheck: false,
maskPromptChar: "",
characterCasing: 'upper'
});

isc.DynamicForm.create({
ID: "contactForm",
width: 400,
wrapHintText: false,
fields: [
{ name: "firstName", title: "First name", editorType: "TextItem",
hint: "<nobr>&gt;?&lt;??????????????</nobr>"},
{ name: "lastName", title: "Last name", editorType: "TextItem",
hint: "<nobr>&gt;?&lt;??????????????</nobr>"},
{ name: "state", title: "State", editorType: "ComboBoxItem",
valueMap: {'AL':'Alabama','AR':'Arkansas','AK':'Alaska','FL':'Florida','LA':'Louisiana'},
filterLocally: true, addUnknownValues: false},
{ name: "phoneNo", title: "Phone No.", editorType: "TextItem",
mask: "##########", hint: "(###) ###-####", showHintInField: true},
{ name: "dateItem", title: "Date", editorType: "DateItem",
useTextField: true, useMask: true},
{ name: "dateTimeItem", title: "Date Time", editorType: "DateTimeItem",
useTextField: true, useMask: true},
{ name: "timeItem", title: "Time", editorType: "TimeItem",
useMask: true}
]
});

Viewing the above, when you type, say 'AL' into the state field, only 'L' shows up and the search goes to Louisiana instead of Alabama.

a) is there a better way to default all text input fields to uppercase (with the ability to override on individual components)?
b) can I create a custom version of TextItem (with characterCasing as desired) and make that the default editorType for all text fields?
c) is this a bug related to this setting (and since ComboBoxItem is based on TextItem)?

Thank you.

[Isomorphic]

Because TextItem is reused in dozens of places within the framework itself, this behavior change is an invalid customization.

Instead, just create your own subclass of TextItem and use it pervasively.

If it's common for you to have entire forms where every TextItem should force upper case, you could just implement that as an override of setItems() that sticks your custom editorType on all fields where it should apply.

[gwque]

Thanks for the feedback. I'm going with the TextItem subclass used pervasively as suggested. Keep us posted if y'all ever come up with a global override/default approach to set input case.

[gwque]

Hi Isomorphic,

I now have a related question to trying to get defaults attributes to inherit...

I thought I might like to use a simple "combination" RDS that combines the field layouts of several individual structures so that I have one object definition that I can exchange with the server without having to make a separate fetch/post on each one (single server round trips). It basically works, but the combination RDS does not carry over the field attributes from the individual field definitions. Taking the following example, the "rdsCombo" does not respect the field-level attributes of the "rdsSt" definition: title, editorType, validators. If I put them directly on the grid items for country, it works. I'd rather have these on the source fields rather than on the grid/dynamic form. Is there a setting I'm missing to make this work?

isc.defineClass("CapsText", "TextItem").addProperties({
characterCasing: 'upper'
});
isc.RestDataSource.create({
ID: 'rdsCtry',
fields: [
{ name: 'id', type: 'integer', primaryKey: true, hidden: true },
{ name: 'cd', type: 'text', length: 2 },
{ name: 'nme', type: 'text', length: 50 }
],
clientOnly: true,
cacheData: [{ id: 1, cd: ' ', nme: '' }, { id: 2, cd: 'CA', nme: 'CANADA' }, { id: 3, cd: 'US', nme: 'UNITED STATES' }]
});
isc.RestDataSource.create({
ID: 'rdsSt',
fields: [
{ name: 'id', type: 'integer', primaryKey: true, hidden: true },
{ name: 'cd', type: 'text', length: 2, title:'St Cd' },
{ name: 'nme', type: 'text', length: 10, title:'St Name', editorType: 'CapsText', editorType: 'CapsText', validators: [{ type: 'required' }] }
],
clientOnly: true,
cacheData: [{ id: 1, cd: ' ', nme: '' }, { id: 2, cd: 'AL', nme: 'ALABAMA' }, { id: 3, cd: 'TX', nme: 'TEXAS' }, { id: 5, cd: 'ON', nme: 'ONTARIO' }]
});
isc.RestDataSource.create({
ID: 'rdsCombo',
fields: [
{ name: 'st', type: 'rdsSt' },
{ name: 'ctry', type: 'rdsCtry' }
],
clientOnly: true,
cacheData: [{ st: { id: 2, cd: 'AL', nme: 'ALABAMA' }, ctry: { id: 3, cd: 'US', nme: 'UNITED STATES' }},
{ st: { id: 5, cd: 'ON', nme: 'ONTARIO' }, ctry: { id: 2, cd: 'CA', nme: 'CANADA' }}]
});

isc.ListGrid.create({
ID: "stCtry",
width:550, height:224, alternateRecordStyles:true,
dataSource: rdsCombo,
fields:[
{name:"st.cd", canEdit:false},
{name:"st.nme"},
{name:"ctry.cd", title: 'Ctry Cd', canEdit:false},
{name:"ctry.nme", title: 'Ctry Name', editorType: 'CapsText', validators: [{ type: 'required' }]}
],
autoFetchData: true,
canEdit: true,
editEvent: "click"
})

[Isomorphic]

Field names cannot have dots.

Nested structures like this can be either transformed flat (valueXPath) or represented as nested DataSources if they are truly separate entities - see the DataPaths docs to understand why other styles of nested data are considered an anti-pattern.

Only the properties listed on DataSourceField are valid on DataSourceField. Other component-specific properties are not allowed as they have different meaning in different components. If you have a recurring behavior you want for binding components to DataSources, subclass the component in question and implement that.

[gwque]

Thanks for the quick reply. I realized later and was hoping to retract, but didn't see a delete option. It dawned on me to check for a separate path property (vs. "dot" notation) and that property is "dataPath". Setting that appears to solve it:

fields:[
{name:"st.cd", dataPath: "st/cd", canEdit:false},
{name:"st.nme", dataPath:"st/nme"},
{name:"ctry.cd", dataPath: "ctry/cd", title: 'Ctry Cd', canEdit:false},
{name:"ctry.nme", dataPath: "ctry/nme", title: 'Ctry Name', editorType: 'CapsText', validators: [{ type: 'required' }]}
],

Too much screen time...

[Isomorphic]

So again, please heed the gigantic warning in the DataPath docs. We strongly recommend against this approach. The feature is present for legacy systems only.