Skip to content

Retrieving selection

Similarly to the OOB Select2 you can retrieve current selection (with all additional metadata). To do so you need to call .select2('data') function on the id of your lookup with custom _dwcSelect2 postfix.

$(`#${fieldId}_dwcSelect2`).select2('data');

The result will be an array of selected options (as Select2 allows for multi-selection configuration).

[
{
id: '26d38746-0dac-45bb-bff9-057239876571',
text: 'Google',
dwc_name: 'Google',
dwc_address: '1600 Amphitheatre Parkway, Mountain View, California'
dwc_employerid: '26d38746-0dac-45bb-bff9-057239876571',
dwc_industrycode: '864000'
'dwc_industrycode@OData.Community.Display.V1.FormattedValue': 'Technology'
}
]

This can be useful when you need to get additional details and act on them after user makes his selection.

function getEmployerByName(employerName, successHandler, errorHandler) {
const select = `$select=accountid,name,_dwctst_country_value,industrycode&$orderby=name asc`;
const filter = employerName ? `&$filter=startswith(name,'${employerName}')` : "";
const options = select+filter;
webapi.safeAjax({
type: "GET",
url: `/_api/accounts?${options}`,
contentType: "application/json",
headers: {
"Prefer": "odata.include-annotations=*"
},
success: successHandler,
error: errorHandler
});
}
$(document).ready(function(){
$("#dwctst_employer").lookupToSelect({
getData: getEmployerByName,
placeholder: 'Search for an employer',
idFieldName: 'accountid',
textFieldName: 'name',
targetTableLogicalName: 'account'
});
$("#dwctst_employer").on("change", function() {
// get selected employers array
const employerResultArr = $(`#dwctst_employer_dwcSelect2`).select2('data');
// get selected employer object
const employerResult = employerResultArr[0];
const employerCountry = employerResult["_dwctst_country_value@OData.Community.Display.V1.FormattedValue"];
alert(`Selected employer country is ${employerCountry}`);
});
});