Dynamically add Options to Select

  • 8 November 2017
  • 4 replies
  • 5 views

Badge +5

Overview:

We use and external data lookup and in turn populate form elements.

One of the pieces retrieved is added to a Select element on the form. All of that is working just fine.

An inspection of the HTML shows the items have been added, however, when the form is submitted a SharePoint error is thrown and the form submission fails.

If a static Option (not added by jQuery) in the Select is chosen the form submits just fine.

Details:

  1. We are using a REST call via jQuery and retrieving JSON
  2. JSON is well formed
  3. We then loop over the options and append them to the Select

Example:

<select name="ctl00$SPWebPartManager1$g_f3cb44cb_28a3_493f_8344_c409b53f4e86$ctl00$ListForm2$formFiller$FormView$ctl18$f1b815d2_ac95_4bc5_8e56_236efde79a32"
 class="nf-choice-select nf-associated-control"    id="ctl00_SPWebPartManager1_g_f3cb44cb_28a3_493f_8344_c409b53f4e86_ctl00_ListForm2_formFiller_FormView_ctl18_f1b815d2_ac95_4bc5_8e56_236efde79a32"
    formcontrolid="9850bce4-6706-4791-9fbf-837cd4b35932" data-use-attribute-as-value="data-nfChoiceValue">
 <option value="1">Other</option>
 <option value="51363800002">Card - 51363800002</option>
 <option value="20008">Book - 20008</option>
 <option value="10006">Mortgage - Long term - 10006</option>
 <option value="10006">Mortgage - Short term - 10006</option>
</select>

Other is added via the Nintex Form Control
All other options are added via jQuery

Thoughts? happy.png


4 replies

Badge +5

So, did some experimenting.

We added a Choice Control to the form and did not bind it to the List.

We then added a Textbox and wrote some client side JavaScript to populate the Textbox on change of the Choice Control (Select).

Same outcome. When we submit the form we get a SharePoint error with a correlation ID. Nothing note worthy in the logs.

Since the additional Options are being added post page load, do we need to bind them to an object, say a Nintex object?

Validation doesn't throw an error.

It's like the Browser knows the choices are there and legitimate, but the form submission mechanism does not.

Ramblings done happy.png

Thanks in advance

Userlevel 5
Badge +14

have a look on this - https://community.nintex.com/message/35151?commentID=35151#comment-35151 

Badge +5

I marked your reply as Answered, Thanks!, but would like to show how I simplified the solution you pointed to. Simplified in my own way of thinking anyway happy.png

    NWF$('#' + member_accounts).change(function (e) {
        NWF$('#' + member_account_to_use).val( NWF$('#' + member_accounts + ' option:selected').val() );
    });

    NWF$('input[value="Save"]').click(function () {
        // alert('Save?');
        NWF$('#' + member_accounts).prop('disabled', true);
    });

First binding places the selected value from a specific dropdown into a textbox that is connected to the SharePoint list.

Second binding then disables the dropdown prior to submission to the SharePoint list.

In the thread you pointed me to, he disables all dropdowns. Not an option for me and that is why I only disabled a named instance of a dropdown.

It works. I am not a fan. At all.

Seems there should be a mechanism to tell Nintex that there are new (legitimate) options in the select. My best guess is it is in the Validation step that is triggered by the submit button.

What the heck happy.png It works!

Thank you Marian!!

Badge +5

Follow up

Be sure to add a click handler for the Cancel button too :)

Reply