I did make all the fields required, but since I am working with three pages, I do not want the users to reach to the submission button before realizing that they have missed a field in the first or second page. This is why I used the above code, so that the Next button only appears after they have entered all required fields in a page.

Despite this, the signature field gets missed. The signature field is on the second page and it is marked as required. The form will not get submitted if the signature is not added on the second page, but I do not want users to realize this by the time they reach the submission button. 

For some reason, the validation code does not see the signature field. Here is where I need the help. Thank you.

I see well thanks for providing the additional context. So I added the following line to trigger a validation check on the sign button click in the signature modal window and with the rest of your code that seemed to work for me. Let me know if that helped.

Just added the line below to your function.

$('#form-signature-dlg button.signSignatureBtn').click(validate);

Where should I add this line in the code snippet? Thanks.

Try This:

$(document).ready(function(){
  $("#form1").change(validate);
  validate();
  $('.cf-next-btn').click(validate);
  $('.cf-prev-btn').click(validate);
  $('#form-signature-dlg button.signSignatureBtn').click(validate);
  function validate() {
    if ($("#form1").parsley({excluded:":hidden"}).isValid()) {
      $('.cf-next-btn').show();
    }
    else {
      $('.cf-next-btn').hide();
    }
  }
})