I am attempting to set the "Title" attribute of a List Lookup control set to display as a "multi select" list of options.
Can someone provide me with a method to select these options? I can't be sure, but this specific control is really the only one I have had difficulty with.
Solved! Go to Solution.
could clarify, resp. post an example what you exactly with setting a Title for a option of multiselect list lookup control?
is it an additional text you want to see next option text itself?
or is it HTML node attribute?
Thanks for the reply!
When attemption to query the <options> of this control, I am not getting back the actual control itself. Rather, I get some hidden text box on the form. I determined this by looking at the "id" attribute and logging it. I get:
Here is the SELECT control I expected to be referencing (taken from Google's dev tools):
<select id="ctl00_m_g_bcb77a39_377b_424c_91cb_f4a022fbad10_ctl00_ListForm2_formFiller_FormView_ctl42_ctl20_481826e8_f072_426d_ba56_1dde5537e679_1" name="3d19fb8e-06d7-418d-b481-2154298312ae$1" formcontrolid="3d19fb8e-06d7-418d-b481-2154298312ae" multiple="multiple" class="allOptions" data-type="select"></select>
And here is the item that ACTUALLY is selected (note the ID):
<input name="ctl00$m$g_bcb77a39_377b_424c_91cb_f4a022fbad10$ctl00$ListForm2$formFiller$FormView$ctl42$ctl20$481826e8_f072_426d_ba56_1dde5537e679_hid" type="text" id="ctl00_m_g_bcb77a39_377b_424c_91cb_f4a022fbad10_ctl00_ListForm2_formFiller_FormView_ctl42_ctl20_481826e8_f072_426d_ba56_1dde5537e679_hid" class=" nf-multiselect nf-associated-control" style="display:none;" formcontrolid="3d19fb8e-06d7-418d-b481-2154298312ae">
Note the ID's are different. The control that is actually selected from JQuery using the "varPeripheralList" variable is actually some hidden text field - not the SELECT control! A simply JQuery statement will show you the ID that 'varPeripheralList' is referencing:
var objPeripheralList = NWF$('#'+varPeripheralList);
How can I select the OPTIONS from the SELECT control and change their TITLE attribute?
I am using Nintex Forms 2010 in a SharePoint 2010 environment with latest updates applied.
yes, you're right. js variable points to a html node that holds current value. usually it's an input node. sometimes it might be hidden, especially for more complex controls
to change title attribute of an option in left panel you might use selectors like
NWF$('#'+varPeripheralList).siblings('table.nf-lookup').find('select.allOptions option').setAttribute('title','title left')
and in right panel then selectors like
NWF$('#'+varPeripheralList).siblings('table.nf-lookup').find('select.nf-client-control option').setAttribute('title','title right')
if you see it simpler, you might define a custom CSS class for lookup control, and build the selector using the class like
NWF$('.PeripheralListClass table.nf-lookup select.allOptions option').setAttribute('title','title left')
(Note: I've tested it on NF2013, but I guess for 2010 it should be the same)
After many attempts, I figured out my issue.
I needed to place my JQuery selector inside of the NWF.FormFiller.Events.RegisterAfterReady() function as the table and select control I was attempting to grab wasn't ready after document.ready() - it was only available after NWF.FormFiller.Events.RegisterAfterReady().
After realizing this, the rest of the selector (and the code I wished to manipulate) was easy enough.