cancel
Showing results for 
Search instead for 
Did you mean: 
Workflow Hero

Displaying list lookups as a repeating section or other?

Jump to solution

List lookup controls (currently) only allow for display as either a drop down list, or option buttons. But I'd like to return the results of a list lookup (filtered on the value of another control) into a repeating section via a button. The repeating section will then allow the user to modify contents before submission. If it's not possible as a repeating section, then a multiple line text box might be acceptable.

How can this be achieved?

Labels: (1)
Tags (1)
0 Kudos
Reply
14 Replies
Workflow Hero

Re: Displaying list lookups as a repeating section or other?

Jump to solution

So are you wanting the value of the lookup to be a text field in a repeating row?

This takes the options of a choice field and creates a repeating row then sets the value for a single line text box for each option:

testChoice is the Client ID JavaScript variable name for the choice

textbox is the client id JavaScript variable name for the single line text box in the repeating section

.myrepclass is the css class of the repeating section

I added a JavaScript button the runs the function test()

var choice = NWF$('#' + testChoice);
function test() {
var x = choice.children('option');

for(i=2; i <x.length; i++){
    
     NWF$(".myrepclass").find('a').click();
}
var j=0;
NWF$(".myrepclass .nf-repeater-row:not('.nf-repeater-row-hidden')").each(function(){
j++;
var $row = NWF$(this);
$row.find(".textBox input").val(x.text);
});
  }

Reply
Workflow Hero

Re: Displaying list lookups as a repeating section or other?

Jump to solution

Hi Parker,

Thanks for your reply, but it's not quite what I need so let me try to clarify with some images. I have the following SharePoint lists:

SharePoint Lists.PNG

And I'm trying to design the following Nintex Form:

Nintex Form.PNG

The main elements on the form are:

  1. Select State: achieved via a List Lookup control, using the States list as the source.
  2. Show Stores: this button, when clicked, will query the Stores list filtering on the selected State in step 1. The results of the query are then shown in...
  3. Available Stores: a Repeating Section control that (initially) contains one Single Line Textbox control.

Essentially, I'd like to see if it's possible to query the SharePoint list via JavaScript and return each result as a row in the repeating section.

Cheers,

Michael

Reply
Workflow Hero

Re: Displaying list lookups as a repeating section or other?

Jump to solution

Ah, so will you need to be able to add a new row if you hit show stores again?  I don't think you will be able to dynamically add text boxes into the repeating section.  It could be a multiline text box, or you could try nested repeating sections.

Reply
Workflow Hero

Re: Displaying list lookups as a repeating section or other?

Jump to solution

Parker Petty wrote:

Ah, so will you need to be able to add a new row if you hit show stores again?

Not quite. If the user wants to add a new row, they simply click on the "Add new row" link underneath the repeating section.

Pressing the button would only be used to populate the repeating section. Subsequent presses should reset all the values in the repeating section (in the event, say, they want to change the selected "State").

You mention that it can be done with a multi-line text box instead of a repeating section? Could you share the JavaScript that could achieve that?

Reply
Workflow Hero

Re: Displaying list lookups as a repeating section or other?

Jump to solution

//function ran on button click
function test() {

//set var as choice field

var choice = NWF$('#' + testChoice);


var x = choice.children('option');

var locations = x[1].text + "\n";

for (i=2; i < x.length; i++) {
  //add newline after every option
  locations = locations + x.text + "\n";
}
//set multiline textbox value
NWF$('#' + multiBox).val(locations);

}

Reply
Workflow Hero

Re: Displaying list lookups as a repeating section or other?

Jump to solution

Hi Parker,

I'm not sure my previous response was clear, but I don't want the button to grab the values of an existing lookup and display them elsewhere. I think this is what your examples are doing.

I actually want the button to perform the lookup, and then display the results for further manipulation. In any case, I think I have found a solution which I'll share shortly.

Cheers,

Mike

0 Kudos
Reply
Workflow Hero

Re: Displaying list lookups as a repeating section or other?

Jump to solution

Here's the solution I came up with, borrowing some ideas from Parker's post in how to manipulate the repeating section control. The purpose of this was to use JavaScript to query a SharePoint list based on a selection made on the form, and then to present the results of the query in a repeating section control. The example I'm sharing below also populates a Multi Line textbox for good measure.

To recap, I have the following two SharePoint lists:

SharePoint Column Lookup.PNG

The form is as follows:

Nintex Form - Final.PNG

Form Configuration

I've configured the main elements on the form as follows:

  1. Select State: I'm using a List Lookup control with the States SP list as the source, and the Client ID JavaScript variable name to selState.
  2. Get Stores: Set the Button action to JavaScript, and under Advanced set Client click to retrieveListItems(). The actual JavaScript code is explained in the Form JavaScript section below.
  3. Multi Line Text Box: Under the Advanced properties, set the Client ID JavaScript variable name to multiBox.
  4. Repeating Section: Under the Formatting properties, set the CSS class to repStores.
    • For the Single Line Textbox control inside this section, set it's Formatting property CSS class to repStoreTitle.

Form JavaScript

Under the general form Settings, the following JavaScript code is used:

function retrieveListItems() {

    var clientContext = new SP.ClientContext();
    var oList = clientContext.get_web().get_lists().getByTitle('Stores');
       
    var camlQuery = new SP.CamlQuery();
    var strState = NWF$("#" + selState + " option:selected").text();
   
    camlQuery.set_viewXml('<View><Query><Where><Eq><FieldRef Name=\'State\'/>' +
        '<Value Type=\'Text\'>' + strState +'</Value></Eq></Where>' +
        '<OrderBy><FieldRef Name=\'Title\'/></OrderBy></Query></View>');
    this.collListItem = oList.getItems(camlQuery);
       
    clientContext.load(collListItem);
       
    clientContext.executeQueryAsync(
        Function.createDelegate(this, this.onQuerySucceeded),
        Function.createDelegate(this, this.onQueryFailed)
    );       
       
}

function onQuerySucceeded(sender, args) {

    var listItemInfo = '';

    var listItemEnumerator = collListItem.getEnumerator();
       
    while (listItemEnumerator.moveNext()) {
        var oListItem = listItemEnumerator.get_current();
        listItemInfo += oListItem.get_item('Title') + '\n';
       
        NWF$(".repStores .nf-repeater-row:last").find('.repStoreTitle input').val(oListItem.get_item('Title'));
        NWF$(".repStores").find('a').click();

    }

    NWF$("#" + multiBox).val(listItemInfo);
   
}

function onQueryFailed(sender, args) {

    alert('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
}

I won't go into the details behind the JS, but the key elements were constructing the CAML query to retrieve the list items, then iterating through the list collection while populating the target controls of the Multi Line text box and Repeating Section.

References

Hope this helps!

Reply
Workflow Hero

Re: Displaying list lookups as a repeating section or other?

Jump to solution

very nice!...I see what you wanted now.  I should have said to add you lookup field and filter it by the control then set the css property of the lookup to display none.  However...i'm copying your JS and will probably use it in the future.

Thanks!

0 Kudos
Reply
Workflow Hero

Re: Displaying list lookups as a repeating section or other?

Jump to solution

I suppose by having a "hidden" list lookup control, you remove the need to perform the query within JavaScript, and simply read off it's values. But I think the JavaScript approach allows you more flexibility in that you retrieve all fields from the query, whereas the "hidden" list lookup control is limited to a single field.

Still, good to know both approaches!

Reply