Sometimes during data collection it is required for the values of one pick-list to change based on the selection of another pick-list. For instance, if we have primary pick list with following values:
- Electric
- Water
The secondary pick-list would have different values depends on selection of primary pick-list.
If Electric is selected in primary pick list, the secondary pick-list shall have values:
- Main
- Primary
- Secondary
If Water is selected, the secondary pick-list shall have values:
- Distribution
- Interceptor
To achieve this behavior we need to create two pick-lists in the schema editor with integer values.
Primary:
Secondary
The mobile forms will be generated automatically. We just need to add some logic to control the content of the secondary pick-list. Following is an example of Javascript code to do that. This code shall be added to the mobile Edit and Create forms.
<script>
$(document).ready(function () {
setTimeout(function () {
var primaryPickList = $('#picklist-primary');
var secondaryPickList = $('#picklist-secondary');
updateSecondaryPicklist( primaryPickList, secondaryPickList );
primaryPickList.change(function () {
updateSecondaryPicklist( primaryPickList, secondaryPickList );
});
}, 500);
});
function updateSecondaryPicklist( pPickList, sPickList ) {
var value = sPickList.val();
sPickList.children().remove();
if (pPickList.val() == 0) {
sPickList.append($('<option value=\"0\">Main</option>'))
sPickList.append($('<option value=\"1\">Primary</option>'))
sPickList.append($('<option value=\"2\">Secondary</option>'))
} else if (pPickList.val() == 1) {
sPickList.append($('<option value=\"3\">Distribution</option>'))
sPickList.append($('<option value=\"4\">Interceptor</option>'))
}
sPickList.val( value );
}
</script>
Comments
0 comments
Please sign in to leave a comment.