activiti dynamic table reset content - alfresco

Question

Good day to all.
I created a dynamic table on the forms area.
I would like to reset the content of the table if i selected an item in the dropdown list that will trigger the resetting of the contents (via javascript).
A sample and snippet would be appreciated.
Thank you.

Answer 1

you can refer this example or you can use your custom ftl
<#include "/org/alfresco/components/form/controls/common/utils.inc.ftl" />
<#if field.control.params.optionSeparator??>
<#assign optionSeparator=field.control.params.optionSeparator>
<#else>
<#assign optionSeparator=",">
</#if>
<#if field.control.params.labelSeparator??>
<#assign labelSeparator=field.control.params.labelSeparator>
<#else>
<#assign labelSeparator="|">
</#if>
<#assign fieldValue=field.value>
<#if fieldValue?string == "" && field.control.params.defaultValueContextProperty??>
<#if context.properties[field.control.params.defaultValueContextProperty]??>
<#assign fieldValue = context.properties[field.control.params.defaultValueContextProperty]>
<#elseif args[field.control.params.defaultValueContextProperty]??>
<#assign fieldValue = args[field.control.params.defaultValueContextProperty]>
</#if>
</#if>
<div class="form-field">
<#if form.mode == "view">
<div class="viewmode-field">
<#if field.mandatory && !(fieldValue?is_number) && fieldValue?string == "">
<span class="incomplete-warning"><img src="${url.context}/res/components/form/images/warning-16.png" title="${msg("form.field.incomplete")}" /><span>
</#if>
<span class="viewmode-label">${field.label?html}:</span>
<#if fieldValue?string == "">
<#assign valueToShow=msg("form.control.novalue")>
<#else>
<#assign valueToShow=fieldValue>
<#if field.control.params.options?? && field.control.params.options != "">
<#list field.control.params.options?split(optionSeparator) as nameValue>
<#if nameValue?index_of(labelSeparator) == -1>
<#if nameValue == fieldValue?string || (fieldValue?is_number && fieldValue?c == nameValue)>
<#assign valueToShow=nameValue>
<#break>
</#if>
<#else>
<#assign choice=nameValue?split(labelSeparator)>
<#if choice[0] == fieldValue?string || (fieldValue?is_number && fieldValue?c == choice[0])>
<#assign valueToShow=msgValue(choice[1])>
<#break>
</#if>
</#if>
</#list>
</#if>
</#if>
<span class="viewmode-value">${valueToShow?html}</span>
</div>
<#else>
<label for="${fieldHtmlId}">${field.label?html}:<#if field.mandatory><span class="mandatory-indicator">${msg("form.required.fields.marker")}</span></#if></label>
<#if field.control.params.options?? && field.control.params.options != "">
<select id="${fieldHtmlId}" name="${field.name}" tabindex="0"
<#if field.description??>title="${field.description}"</#if>
<#if field.indexTokenisationMode??>class="non-tokenised"</#if>
<#if field.control.params.size??>size="${field.control.params.size}"</#if>
<#if field.control.params.styleClass??>class="${field.control.params.styleClass}"</#if>
<#if field.control.params.style??>style="${field.control.params.style}"</#if>
<#if field.disabled && !(field.control.params.forceEditable?? && field.control.params.forceEditable == "true")>disabled="true"</#if>>
<#list field.control.params.options?split(optionSeparator) as nameValue>
<#if nameValue?index_of(labelSeparator) == -1>
<option value="${nameValue?html}"<#if nameValue == fieldValue?string || (fieldValue?is_number && fieldValue?c == nameValue)> selected="selected"</#if>>${nameValue?html}</option>
<#else>
<#assign choice=nameValue?split(labelSeparator)>
<option value="${choice[0]?html}" <#if choice[0] == fieldValue?string || (fieldValue?is_number && ((fieldValue - choice[0]?number)?string == "0"))> selected="selected"</#if>>${msgValue(choice[1])?html}</option>
</#if>
</#list>
</select>
<#formLib.renderFieldHelp field=field />
<#else>
<select id="${fieldHtmlId}" name="${field.name}" tabindex="0"
<#if field.description??>title="${field.description}"</#if>
<#if field.indexTokenisationMode??>class="non-tokenised"</#if>
<#if field.control.params.size??>size="${field.control.params.size}"</#if>
<#if field.control.params.styleClass??>class="${field.control.params.styleClass}"</#if>
<#if field.control.params.style??>style="${field.control.params.style}"</#if>
<#if field.disabled && !(field.control.params.forceEditable?? && field.control.params.forceEditable == "true")>disabled="true"</#if>>
</select>
<#formLib.renderFieldHelp field=field />
<!-- <div id="${fieldHtmlId}" class="missing-options">Hello ${msg("form.control.selectone.missing-options")}</div> -->
</#if>
</#if>
</div>
<script type="text/javascript">//<![CDATA[
//var abcd =
YAHOO.util.Event.onContentReady("${fieldHtmlId}", function ()
{
console.log("type name "+"${fieldHtmlId}");
Alfresco.util.Ajax.jsonGet({
url: encodeURI(Alfresco.constants.PROXY_URI + 'url'),
successCallback:
{
fn: function loadWebscript_successCallback(response, config)
{
var obj = eval('(' + response.serverResponse.responseText + ')');
var allResults = obj.values;
function sorting(json_object, key_to_sort_by) {
function sortByKey(a, b) {
var x = a[key_to_sort_by];
var y = b[key_to_sort_by];
return ((x < y) ? -1 : ((x > y) ? 1 : 0));
}
json_object.sort(sortByKey);
}
if (obj)
{
sorting(allResults, 'value');
for (i = 0; i < allResults.length; i++) {
var newOption = document.createElement('option');
newOption.value = allResults[i].value;
newOption.text = (allResults[i].desc == "")?allResults[i].value:allResults[i].value +" - "+ allResults[i].desc;
YAHOO.util.Dom.get("${fieldHtmlId}").options.add(newOption);
}
if("${fieldValue}" != null && "${fieldValue}" != "" && "${fieldValue}" != undefined){
YAHOO.util.Dom.get("${fieldHtmlId}").value = "${fieldValue}";
}
}
}
}
});
}, this);
</script>
This is simple select ftl to get dynamic data from repository.
Based on value selection you can execute your js code on onChange event.

Answer 2

Good day guys.
I just found the answer.
I'm using activiti 6.0 community.
There is also a condition resetting the required columns to false and also a visibility condition.
I'll show the snippet after cleaning and organizing the script.
Thanks for your effort.