Setting maximum repeater items in JetFormBuilder

Setting maximum repeater items in JetFormBuilder

Short Intro:

Unfortunately, Jetformbuilder has no option at the moment to set maximum items in repeater field (group). However, we can do an alternative solution to fix the issue by adding the script below. You can add this using HTML widget in the page where the form is being used or through functions/enqueueing script.

Problem:

Maximum items in repeater field.

The solution can be found below. To set maximum items, we've declare a variable max_repeater_items where you can set maximum repeater items. For the extra feature notice message, you can set the message there as well when repeater reach its maximum repeater items by setting notice_message. You can then style it by using the id #notice container.

Solution:

<script>
jQuery(function($){
var max_repeater_items = 3
var notice_message = 'The maximum repeater field has been reached!'
$(document).on('click', 'button.jet-form-builder-repeater__new', checkRepeaterItems)

$(document).on('click', 'button.jet-form-builder-repeater__remove', checkRepeaterItems)
function checkRepeaterItems(){
var count_repeater_items = $(document).find('.jet-form-builder-row.field-type-repeater-field .jet-form-builder-repeater__items .jet-form-builder-repeater__row').length;
if(count_repeater_items == max_repeater_items){
$('button.jet-form-builder-repeater__new').attr('disabled', 'disabled').hide();
$('.jet-form-builder-repeater__actions').append('<p id="”notice-container”">'+notice_message+'</p>');
}
else{
$('button.jet-form-builder-repeater__new').removeAttr('disabled').show();
$(document).find('#notice-container').remove();
}
}
})
</script>

Contact details

More solutions

by ilias

You're using JetFormBuilder and want to make sure users are at least 18 years old based on their birthday input.

by ilias

Roweij Spices wanted to have a filter that can choose number of products display per pagination

by ilias

This article will show you how to add dynamic code to your templates using the Elementor Shortcode widget and custom PHP code.