You are viewing limited content. For full access, please sign in.

Question

Question

Is there a way update pagination tab text dynamically

asked on March 1, 2021

Is there a way to updated the pagination tab text dynamically. For example one tab starts out saying 'Day 1', and then after the user inters data a field in that tab it would append what they typed to the tab name. For example it would then say 'Day 1 Done'. 

 

I was able to set up so the tab value is  'Day 1 {/dataset/my_page_title}' and after the form is submitted the value does show up, but not when the field is filled out but before submit.

0 0

Answer

SELECTED ANSWER
replied on March 1, 2021

You can do this kind of stuff with Javascript.  Here's a simple script that watches for changes to a single line field with the ID of q1 and if there is a value in the field, it'll update the label for the pagination tab with ID of q0 to show Page 1 DONE.

$(document).ready(function () {
  
  //This section works on the live version of the form to update the pagination label when the single line field changes.
  $('#q1 input').change(function(){
    if ($(this).val() != '')
    {
      $('[page="q0"]').text('Page 1 DONE');
    }
    else
    {
      $('[page="q0"]').text('Page 1');
    }
  });
  
  //This section works on the archive/read-only version of the form to update the pagination label based on completion of the single line field.
  //NOTE THAT I'M FAIRLY CERTAIN THIS WILL WORK BASED ON OTHER FORMS, BUT I HAVEN'T SPECIFICALLY TESTING THIS CODE ON THIS FORM.
  $('#q1 .cf-field').each(function(){
    if ($(this).text() != '')
    {
      $('[page="q0"]').text('Page 1 DONE');
    }
    else
    {
      $('[page="q0"]').text('Page 1');
    }
  });
  
});

1 0
replied on March 1, 2021

Thanks so much this is what I was looking for!

1 0
replied on March 1, 2021

You're quite welcome.  Have a wonderful day!

1 0

Replies

You are not allowed to reply in this post.
You are not allowed to follow up in this post.

Sign in to reply to this post.