Can I apply a filter dynamically to List lookup on Nintex Forms 2013?

Question

I have a requirement wherein I need to filter the List lookup dynamically. My list has a column called category that can either contain value 'A' or 'B'. Then there is a field -'Selection' on the Content type that can either take value 'A' or 'B' or 'All' . If its 'A' I need the List lookup to take rows where category = 'A' , same goes for'B'. However if the 'Selection' is - 'All' then I need to display all the items from the list.

I was thinking of filtering the List lookup for the column - 'Category' . But the problem is as I am on a content type form , I do not have any variables that can be set dynamically.

I can not use the Filter by control mapped to 'Selection' as the it does not work when the selection is 'All' (There is no value called 'All' under category in the list).

I tried using a calculated value that operates on a formula and tried using it in Filter by specific value in List lookup , but the filter doesn't work as the list lookup loads before the calculated value on form load and hence the calculated value is always empty for the filtering.

Is there any way I can achieve this functionality.

Thanks in advance

Answer 1

I have thought of two solutions to this problem.

1. Have 3 separate list lookup controls that are laid over top of each other. Filter one by A, one by B, and let one have no filter. Then create rules to show the one with the filter you want to show, and hide the others. To save the value, you'd have to use JavaScript to copy the value from the list lookup to a hidden text box when one of the controls changes value. This solution isn't great and gets worse if you have more options...but it works.

2. You can use JavaScript to filter the list based off the Selection. This is a little more tricky, but you wouldn't need more lookup controls for more options. You would need only 2 list lookups no mater how many options you have for Category/Selection. You need one that shows the info that you want the user to chose from (unfiltered) and the other is from the same list, and same view, but the column should be the Category column ( you can hide this lookup with javascript). This is the code I used to get what you are describing.

   //get the original html to 'reset' the dropdown after a change  
   var originalTitle = NWF$("#" + title).html();
   
   //when the selection changes
   NWF$("#" + selection).change(function () {
   
   //put the original html in the dropdown to check all the options
   NWF$("#" + title).html(originalTitle);
   
   //get the new value of the selection
   var choice = NWF$("#" + selection + " :checked")[0].value
   
   //if choice is all then we are done because the original html is in the dropdown again with all the options
   if (choice == "All") {
       return;
   }
   
   //create the array where you will store the ids of the options that match the choice
   var filteredIds = [];
   
   //for each option in the category drop down, see if the text matches the choice (this is your filtering)
   NWF$("#" + categoryDD + " option").each(function (i, n) {
   
       //if the text of the option matches the choice add the id to the array. 
       if (n.text == choice) {
           filteredIds.push(n.value);
       }
   });
   
   //initialize string of html
   var filteredTitlesHTML = ""
   
   //for each of the ids in the list, get the option html with that id from the title dropdown and add it to the resulting HTML string
   NWF$(filteredIds).each(function (i, n) {
       filteredTitlesHTML += NWF$("#" + title + " option[value = '" + n + "']")[0].outerHTML
   })
   
   //put the html in the dropdown to show only filtered values
       NWF$("#" + title).html(filteredTitlesHTML);
   })
   

   

You can see in the picture the javascript variable names I gave the controls to use the javascript I have provided.