SDK 3 - Populate fields with pickerresults

cancel
Showing results for 
Search instead for 
Did you mean: 
Highlighted
Established Member II

SDK 3 - Populate fields with pickerresults

Hi,

i don't find how to fill fields after using pickerresults :

step 1 - select :

step 2 - choice :

step 3 : what i would like to do :

I don't find which files are concerned...

Thx

3 Replies
Highlighted
Established Member II

Re: SDK 3 - Populate fields with pickerresults

Now i can add info (ex: "username") in the Json result but i don't know how to populate the field with this value...

Thank's

Highlighted
Established Member II

Re: SDK 3 - Populate fields with pickerresults

ok, 

so i try to add an "onclick" function on OK button in picker.inc.ftl (bold code) :

<#assign compactMode = field.control.params.compactMode!false>

<#macro renderPickerJS field picker="picker">
<@renderPickerJS field "picker" false/>
</#macro>

<#macro renderPickerJS field picker="picker" cloud=false>
<#if field.control.params.selectedValueContextProperty??>
<#if context.properties[field.control.params.selectedValueContextProperty]??>
<#local renderPickerJSSelectedValue = context.properties[field.control.params.selectedValueContextProperty]>
<#elseif args[field.control.params.selectedValueContextProperty]??>
<#local renderPickerJSSelectedValue = args[field.control.params.selectedValueContextProperty]>
<#elseif context.properties[field.control.params.selectedValueContextProperty]??>
<#local renderPickerJSSelectedValue = context.properties[field.control.params.selectedValueContextProperty]>
</#if>
</#if>

<#if cloud>
var ${picker} = new Alfresco.CloudObjectFinder("${controlId}", "${fieldHtmlId}").setOptions(
<#else>
var ${picker} = new Alfresco.ObjectFinder("${controlId}", "${fieldHtmlId}").setOptions(
</#if>
{
<#if form.mode == "view" || (field.disabled && !(field.control.params.forceEditable?? && field.control.params.forceEditable == "true"))>disabled: true,</#if>
field: "${field.name}",
compactMode: ${compactMode?string},
<#if field.mandatory??>
mandatory: ${field.mandatory?string},
<#elseif field.endpointMandatory??>
mandatory: ${field.endpointMandatory?string},
</#if>
<#if field.control.params.startLocation??>
startLocation: "${field.control.params.startLocation}",
<#if form.mode == "edit" && args.itemId??>currentItem: "${args.itemId?js_string}",</#if>
<#if form.mode == "create" && form.destination?? && form.destination?length &gt; 0>currentItem: "${form.destination?js_string}",</#if>
</#if>
<#if field.control.params.startLocationParams??>
startLocationParams: "${field.control.params.startLocationParams?js_string}",
</#if>
currentValue: "${field.value}",
<#if field.control.params.valueType??>valueType: "${field.control.params.valueType}",</#if>
<#if renderPickerJSSelectedValue??>selectedValue: "${renderPickerJSSelectedValue}",</#if>
<#if field.control.params.selectActionLabelId??>selectActionLabelId: "${field.control.params.selectActionLabelId}",</#if>
selectActionLabel: "${field.control.params.selectActionLabel!msg("button.select")}",
minSearchTermLength: ${field.control.params.minSearchTermLength!'1'},
maxSearchResults: ${field.control.params.maxSearchResults!'1000'}
}).setMessages(
${messages}
);
</#macro>

<#macro renderPickerHTML controlId>
<#assign pickerId = controlId + "-picker">
<div id="${pickerId}" class="picker yui-panel">
<div id="${pickerId}-head" class="hd">${msg("form.control.object-picker.header")}</div>

<div id="${pickerId}-body" class="bd">
<div class="picker-header">
<div id="${pickerId}-folderUpContainer" class="folder-up"><button id="${pickerId}-folderUp"></button></div>
<div id="${pickerId}-navigatorContainer" class="navigator">
<button id="${pickerId}-navigator"></button>
<div id="${pickerId}-navigatorMenu" class="yuimenu">
<div class="bd">
<ul id="${pickerId}-navigatorItems" class="navigator-items-list">
<li> </li>
</ul>
</div>
</div>
</div>
<div id="${pickerId}-searchContainer" class="search">
<input type="text" class="search-input" name="-" id="${pickerId}-searchText" value="" maxlength="256" />
<span class="search-button"><button id="${pickerId}-searchButton">${msg("form.control.object-picker.search")}</button></span>
</div>
</div>
<div class="yui-g">
<div id="${pickerId}-left" class="yui-u first panel-left">
<div id="${pickerId}-results" class="picker-items">
<#nested>
</div>
</div>
<div id="${pickerId}-right" class="yui-u panel-right">
<div id="${pickerId}-selectedItems" class="picker-items"></div>
</div>
</div>
<div class="bdft">
<button id="${controlId}-ok" onclick="MyFunction()" tabindex="0">${msg("button.ok")}</button>
<button id="${controlId}-cancel" tabindex="0">${msg("button.cancel")}</button>
</div>
</div>

</div>

<script type="text/javascript">//<![CDATA[
MyFunction() {
console.log("Hello from OK button");
document.getElementById("page_x002e_data-form_x002e_task-edit_x0023_default_prop_wfvd_idPatient").innerHTML = "Hello World";
document.getElementById("page_x002e_data-form_x002e_task-edit_x0023_default_prop_wfvd_nomPatient").value = "Populate from OK button";
}


//]]></script>
</#macro>

But it doesn't work. moreover the function doesn't appear in field properties :

Thx

Highlighted
Established Member II

Re: SDK 3 - Populate fields with pickerresults

Found :-)

in picker.inc.ftl, only add :

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
<script src="${url.context}/res/components/dyn-populate-field.js"></script>

And in dyn-populate-field.js, add :

// remplissage des champs après sélection d'un patient par le picker Alfresco

$(function () {

$("#page_x002e_data-form_x002e_task-edit_x0023_default_assoc_wfvd_patients-cntrl-ok-button")
.click(function () {
var patSelected = document.getElementById("page_x002e_data-form_x002e_task-edit_x0023_default_assoc_wfvd_patients-cntrl-picker-selectedItems").outerText;
var splits = (patSelected.trim()).split("-");
console.log(splits);
document.getElementById("page_x002e_data-form_x002e_task-edit_x0023_default_prop_wfvd_nomPatient").value = splits[0];
document.getElementById("page_x002e_data-form_x002e_task-edit_x0023_default_prop_wfvd_prenomPatient").value = splits[1];
document.getElementById("page_x002e_data-form_x002e_task-edit_x0023_default_prop_wfvd_dateNaissance").value = splits[2];
});
});

That's all !!