Our pagination example, which is described in detail here, works by hiding the portions of the form that aren't on the currently selected tab. Because it's hiding items via Javascript, when the form is saved into Laserfiche, everything shows up. How have you set your tabs up? What does the javascript look like?

Hi Zachary,

Here is the code we are using.

Everything is working except for the output as it is only saving the image of one tab of data.

Laserfiche Forms Version 9.1.1.1517

$(document).ready(function () {
var section1 = $('.section1 h1:first').text();
var section2 = $('.section2 h1:first').text();
var section3 = $('.section3 h1:first').text();
var section4 = $('.section4 h1:first').text();
var section5 = $('.section5 h1:first').text();
var section6 = $('.section6 h1:first').text();
var section7 = $('.section7 h1:first').text();

$('<div class="navbar"><div class="navitem S1">' + section1 + '</div><div class="navitem S2">' + section2 + '</div><div class="navitem S3">' + section3 + '</div><div class="navitem S4">' + section4 + '</div><div class="navitem S5">' + section5 + '</div><div class="navitem S6">' + section6 + '</div><div class="navitem S7">' + section7 + '</div></div>').insertBefore('#q1');
$('<input class="navitem S2" value="Next: ' + section2 + '" type="button">').appendTo('.section1');
$('<input class="navitem S1" value="Previous: ' + section1 + '" type="button"> <input class="navitem S3" value="Next: ' + section3 + '" type="button">').appendTo('.section2');
$('<input class="navitem S2" value="Previous: ' + section2 + '" type="button"> <input class="navitem S4" value="Next: ' + section4 + '" type="button">').appendTo('.section3');
$('<input class="navitem S3" value="Previous: ' + section3 + '" type="button"> <input class="navitem S5" value="Next: ' + section5 + '" type="button">').appendTo('.section4');
$('<input class="navitem S4" value="Previous: ' + section4 + '" type="button"> <input class="navitem S6" value="Next: ' + section6 + '" type="button">').appendTo('.section5');
$('<input class="navitem S5" value="Previous: ' + section5 + '" type="button"> <input class="navitem S7" value="Next: ' + section7 + '" type="button">').appendTo('.section6');
$('<input class="navitem S6" value="Previous: ' + section6 + '" type="button">').appendTo('.section7');

  
$('.navitem').on('touchstart click', function () {
$('.section1, .section2, .section3, .section4, .section5, .section6, .section7, .Submit').hide();
$('.navbar').find('.navitem').removeClass('selected');

if ($(this).hasClass('S1')) {
    $('.section1').show();
    $('.navbar').find('.S1').addClass('selected');
}

else if ($(this).hasClass('S2')) {
    $('.section2').show();
    $('.navbar').find('.S2').addClass('selected');
}

else if ($(this).hasClass('S3')) {
    $('.section3').show();
    $('.navbar').find('.S3').addClass('selected');
}

else if ($(this).hasClass('S4')) {
    $('.section4').show();
    $('.navbar').find('.S4').addClass('selected');
}

else if ($(this).hasClass('S5')) {
    $('.section5').show();
    $('.navbar').find('.S5').addClass('selected');
}

else if ($(this).hasClass('S6')) {
    $('.section6').show();
    $('.navbar').find('.S6').addClass('selected');
}

else if ($(this).hasClass('S7')) {
    $(".section7, .Submit").show();
    $('.navbar').find('.S7').addClass('selected');
}
})

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

});

One way to do this is to create a copy of the form without any JavaScript, and then use that form in your Save to Repository service task.

If you want to do it with the same form, you'll need to add some logic to show all the pages at the appropriate step of the process.

Hi Martin, 

If your question has been answered, please let us know by clicking the "This answered my question" button on the response.

If you still need assistance with this matter, just update this thread. Thanks!