Question

Pagination (Tabs) On Sections With Variables

Forms

Updated October 20, 2015

asked on October 15, 2015

I have been working on a form with multiple sections that I am using pagination for. There are 6 sections tabs and my paginations works for all of them except for two. The only difference between the four that work and the two that don't is that the two that do not work have variables. Do I need to do anything with the java script for these two sections because they have variables?

This is the HTML for the tabs

<div class="navbar">
<div class="navitem portfolio">Portfolio Summary</div>
<div class="navitem Client">Know Your Client</div>
<div class="navitem Beneficial">Beneficial Owner Summary</div>
<div class="navitem Investment">Investment Vehicle</div>
<div class="navitem Entities">For Entities That SOL is not Correspondent</div>
<div class="navitem Review">Review Approval</div></div>

This is the java script

//pagination

$('.navitem').on('touchstart click', function () {

$('.sections,.Submit').hide();

$('.navbar').find('.navitem').removeClass('selected');

if ($(this).hasClass('portfolio')) {

$('.section1').show();

$('.navbar').find('.portfolio').addClass('selected');

}

else if ($(this).hasClass('Client')) {

$('.section2').show();

$('.navbar').find('.Client').addClass('selected');

}

else if ($(this).hasClass('Beneficial')) {

$('.section3').show();

$('.navbar').find('.Beneficial').addClass('selected');

}

else if ($(this).hasClass('Investment')) {

$('.section4').show();

$('.navbar').find('.Investment').addClass('selected');

}

else if ($(this).hasClass('Entities')) {

$('.section5').show();

$('.navbar').find('.Entities').addClass('selected');

}

else if ($(this).hasClass('Review')) {

$(".section6, .Submit").show();

$('.navbar').find('.Review').addClass('Review');

}

})

$('.navitem.portfolio').trigger('click');

//end pagination

Let me know if there is any other information needed to help with this issue.

0 0

Replies

replied on October 16, 2015

That is really strange, I've set mine up the same way and it still works fine for me.

Did you paste all of your JS code above or just the part concerned with the pagination? I was just wondering if there was any other part of the script that could be interferring with the two tabs that don't work.

I suppose you could also try using sections rather than collections to split up the page? Sections cannot have variables set on them so this would test whether or not the variables are the problem here. Not that it should really make a difference but you never know

Hope you get this sorted!

Dan

1 0

replied on October 16, 2015 • Show version history

Your code seems to work fine for me when you say two sections "have variables" what do you mean by this?

Cheers! Dan.

0 0

replied on October 16, 2015

Here is a sample section with a variable.

This section and the other section with a variable generate nothing when I click on the corresponding tab on the top of the screen. I have the css class following the same pattern for this as I do the others that work.

0 0

replied on October 20, 2015

I changed my form and put the collection inside of a section and also added the css class to the section instead of the collection and now the pagination works! Thanks for all your assistance!

0 0

You are not allowed to follow up in this post.

Question

Question

Pagination (Tabs) On Sections With Variables

Replies

Sign in to reply to this post.