Display a field on a form based on the value of another field on the sameForm

[AkashMohapatra]

Hello

I am using SmartClient v10.0p_2015-09-03/LGPL Deployment (built 2015-09-03) for my project. I have a dynamic form in which a new field is added. But, I want to display that field if and only the value of another field on the same form has a particular value. I will appreciate if you can guide me on how to do it? I have added a snippet of the Dynamic form code below for reference. Here, I want the field Combustible dust should be visible only if the value of 'Form' field is "POWDER".

general: isc.DynamicForm.create({
numCols: 6,
colWidths: [130, "*", 130, 80, 40, 40],
fields: [
{name: "itemClass", type: "select", width: "*", allowEmptyValue: true, displayField: "description", valueField: "id",
optionDataSource: isc.DataSource.create({
dataFormat: "json",
clientOnly: true,
showPrompt: false,
dataURL: "rawmaterial/itemclasscodes",
fields: [{name: "id", type: "text"}, {name: "description", type: "text"}],
handleError: function(response, request) {isc.warn("Error reading item class codes.");return false;}
}),
validators: [
{type: "requiredIf", expression: "wildware.EditRawMaterialWindow.rawMaterial.itemTypeCode == wildware.EditRawMaterialWindow.ItemType.VENDOR && (wildware.EditRawMaterialWindow.rawMaterial.status == wildware.EditRawMaterialWindow.Status.ACTIVE || wildware.EditRawMaterialWindow.rawMaterial.status == wildware.EditRawMaterialWindow.Status.PENDING || wildware.EditRawMaterialWindow.rawMaterial.status == wildware.EditRawMaterialWindow.Status.WAITING || wildware.EditRawMaterialWindow.header.getValue('submit'))"}
]
},
{name: "form", type: "select", width: "*", colSpan: 3, allowEmptyValue: true, displayField: "description", valueField: "id",
optionDataSource: isc.DataSource.create({
dataFormat: "json",
clientOnly: true,
showPrompt: false,
dataURL: "rawmaterial/formcodes",
fields: [{name: "id", type: "text"}, {name: "description", type: "text"}],
handleError: function(response, request) {isc.warn("Error reading form codes.");return false;}
}),
validators: [
{type: "requiredIf", expression: "wildware.EditRawMaterialWindow.rawMaterial.itemTypeCode == wildware.EditRawMaterialWindow.ItemType.VENDOR && (wildware.EditRawMaterialWindow.rawMaterial.status == wildware.EditRawMaterialWindow.Status.ACTIVE || wildware.EditRawMaterialWindow.rawMaterial.status == wildware.EditRawMaterialWindow.Status.PENDING || wildware.EditRawMaterialWindow.rawMaterial.status == wildware.EditRawMaterialWindow.Status.WAITING || wildware.EditRawMaterialWindow.header.getValue('submit'))"}
]
},
{name: "microSensitive", type: "select", width: "*", allowEmptyValue: true, displayField: "description", valueField: "id",
optionDataSource: isc.DataSource.create({
dataFormat: "json",
clientOnly: true,
showPrompt: false,
dataURL: "rawmaterial/microsensitivecodes",
fields: [{name: "id", type: "text"}, {name: "description", type: "text"}],
handleError: function(response, request) {isc.warn("Error reading microsensitive codes.");return false;}
}),
validators: [
{type: "requiredIf", expression: "wildware.EditRawMaterialWindow.rawMaterial.itemTypeCode == wildware.EditRawMaterialWindow.ItemType.VENDOR && wildware.EditRawMaterialWindow.rawMaterial.water != true && (wildware.EditRawMaterialWindow.rawMaterial.status == wildware.EditRawMaterialWindow.Status.ACTIVE || wildware.EditRawMaterialWindow.rawMaterial.status == wildware.EditRawMaterialWindow.Status.PENDING || wildware.EditRawMaterialWindow.rawMaterial.status == wildware.EditRawMaterialWindow.Status.WAITING || wildware.EditRawMaterialWindow.header.getValue('submit'))"}
]
},
{name: "msg", type: "radioGroup", defaultValue: "X", vertical: false, colSpan: 3, valueMap: {X: "Unknown", N: "No", Y: "Yes"}},
{name: "alcohol", type: "radioGroup", defaultValue: "X", vertical: false, colSpan: 3, valueMap: {X: "Unknown", N: "No", Y: "Yes"}},
{name: "hvp", type: "radioGroup", defaultValue: "X", vertical: false, colSpan: 3, valueMap: {X: "Unknown", N: "No", Y: "Yes"}},
{name: "aye", type: "radioGroup", defaultValue: "X", vertical: false, colSpan: 3, valueMap: {X: "Unknown", N: "No", Y: "Yes"}},

{name: "combustibleDust", type: "radioGroup", defaultValue: "X", endRow: true, vertical: false, valueMap: {X: "Unknown", N: "No", Y: "Yes"}
})


Thanks
Akash

[Isomorphic]

There are several ways to do this including formItem.showIf and formItem.visibleWhen, or just putting code into a formItem.changed() handler to show and hide another field.

Also, another reminder that you should never be doing new development against a version that is so far behind on patches. Issues reported for badly out of date builds will be ignored, for obvious reasons.