Skip to main content

Good day! I tried adding a repeating section within a repeating section. What I do here is that the inner repeating section gets information based on what the user selected on a list-lookup. I've done the javascript part. However, two problems arise from this.

1) The form's controls go down too much.

Example:

Initial

216446_pastedImage_1.png

Once items are selected

216447_pastedImage_2.png

The space between the outcome and the repeating section is too large.

The second problem comes in when adding a new row on the parent/outer repeating section

216448_pastedImage_3.png

The second row inner repeating section already has the same amount as the previous one. It should go back to one.

Do you have any custom code written for the inner repeating section? It looks like you have a custom add new row button. 

Add items is a label button for the list lookup since button cannot be added directly to repeated section.

The inner repeating section does not have add new row, but rather, whatever was selected on the list lookup, will be passed to the inner repeated section.

Example:

I chose test1,test2, and test3 on the list lookup. The inner repeated section will input these three items on three different rows respectively.

Alright. Well then can you please provide that code?

Any custom code that populates the repeating section is relevant. 

NWF$(".hostname-repeater").find('.nf-repeater-addrow').css("visibility","hidden"); 
NWF$(".vtMyRepeatingSection").find('.nf-repeater-addrow').css("visibility","hidden");

NWF$(document).ready(function(){
NWF$(".labelButton").click(function(){
let selectedItems = NWF$("#"+calculatedSelection).val();
let arrayItems;
let result = selectedItems.slice(1,-1);
let newString = """;
arrayItems = result.split(',');
for(let i = 0; i < arrayItems.length; i++){
let itemString = arrayItems.split(" -");
newString = newString + itemStringg0].trim();
newString = newString + ",";
NWF$('.hostname-repeater .nf-repeater-row:not(.nf-repeater-row-hidden):last .hostname input').val(itemStringg0].trim());
NWF$(".hostname-repeater").find('a').click();
}
newString = newString + "]";  
});

NWF$(".addNewRow").click(function(){
NWF$(".vtMyRepeatingSection").find('a').click();
});

});

Here's the code. I actually changed the layout so I created my own add new row button, thinking that I can find a way to fix the problem. No luck on that one, it actually gave out another bug.

Anyway, hostname-repeater is the inner repeated section, and vtMyRepeatingSection is the parent/outer repeated section.

It seems to me that the problem is that when I add new row for the parent repeated section, the inner repeated section does not restart itself back to 0. Rather, it's just a continuous repeated section so when I add new row, the rows from the previous row are already there but blank.

Yeah... there are certainly some peculiar things about your custom code. 

Notably, you don't seem to be specifying a context for when you are targeting specific inner Repeating Sections

The line of code here: 

NWF$(".hostname-repeater").find('a').click()‍;‍

will fire the add-row for ANY repeating section that has a parent class of ".hostname-repeater". 

This would be problematic as you probably do not wish to actually add a row to every single one of those repeating sections Form-Wide. 

Later on I will try to do some experiments on my own, but in the meantime, consider changing your code so that you're only targeting the parent correct internal repeating section that your label button is a sibling to. 

It's my first time doing javascript/jquery honestly. If that's the case, is it possible to apply a different css class for each row. If possible, I also need to know how to get the number of parent rows as I have to do a loop in the nintex workflow when parsing the whole xml as well.

Reply


View our Community Site Map

Nintex Community Sitemap
Terms & ConditionsCookie settings