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

Question

Question

Submit Button + Signature Box JavaScript

asked on September 5, 2017

Hey everyone! Had great success here earlier tonight and have a deadline fast approaching... so was hoping to go 2 for 2 on the night!

Basically... I hate how the Submit button displays on the first page of my Form, regardless of it has been filled out or not. It's not a huge deal, more of an annoyance, since it doesn't actually do anything. Once you've filled out my first page, it goes away, and comes back again on the final page (4 of 4). What I would like for it to do is go away entirely from the start of the Form until my Signature Box is filled at the end.

I think I'm close... you can ignore the bit about hiding the Signature Box's other option, as well as the password code below that... what I have here is successfully hiding the Submit button from the start, but now, it won't show up at all, even after the Signature box is filled in the end. My guess is that I have the wrong "if > then" statement to work from there. HELP! 

 

SignatureIssue.PNG
0 0

Answer

SELECTED ANSWER
replied on September 6, 2017
function isCorrectDate(n) {
  	var t = n.getDay();
  	var d = n.getDate();
  	return (t==6);
}
function checkDate(n) {
  	return[isCorrectDate(n),""];
}
function checkField(input, inst) {
  	if ($(input).closest('li').hasClass('weekEnding')) {
    	$(input).datepicker("option", {beforeShowDay: checkDate});
	}
}
function hidebutton() {
   	$('.Submit').addClass('hidden');
}
function showbutton() {
	$('.Submit').removeClass('hidden');
}


$(document).ready(function(){
 	$("#q3 input").attr("type","password");

   	$.datepicker.setDefaults( {beforeShow: checkField} );
   	window.Parsley.addValidator('sat', {
     	validateString: function(value) {
       	return isCorrectDate(new Date(value));
     },
     messages: {
       	en: 'Not valid date.'
     }
   	});
   	$('.weekEnding input').attr('data-parsley-sat','');

   	$("#sigNav a:eq(0)").hide();
  	$("#form-signature-dlg").on("shown.bs.modal", function(){$("#sigNav a:eq(1)").click();});
       
   	hidebutton();
   	$(document).on('click','button.signSignatureBtn',function() {
     	setTimeout(showbutton,0);
   	});
   
   	$(document).on('click','a.form-sig-remove',function() {
     	hidebutton();
   	});
});

I've untangled the code. Can you put that in so we can see if it helps :)

0 0

Replies

replied on September 5, 2017
function hidebutton() {
 $('.Submit').addClass('hidden');
}
function showbutton() {
  $('.Submit').removeClass('hidden');
}

$(document).ready(function () {
  	hidebutton();
    $(document).on('click','button.signSignatureBtn',function() {
      setTimeout(showbutton,0);
    });
  
    $(document).on('click','a.form-sig-remove',function() {
      hidebutton;
    });
});

This should do the trick for you. Just paste it in and off you go :)

1 0
replied on September 5, 2017 Show version history

You're the man! Appreciate the help... only... it didn't work... I'm thinking that's on me and my lack of coding knowledge though! That did hide the button when I initially started the Form... but once I'd entered info into the first field (First Name) it brought it back. I'm thinking I can best show you by you checking out the Form yourself in case I'm missing something... here is that link.

https://lf.sandpointidaho.gov/Forms/timecards

You can notice it from the first page right away after filling in that first field now. To move past that first page, use Deanna for the first name, Benton for the last name, and 1234 for the PIN. That should auto-fill the last two fields and allow you to view the rest of the Form. Don't beat your head against a wall on this one... it's not the end of the world, but certainly would be nice to get rid of / make this Form a little cleaner!

Additionally, here is my JavaScript in it's totality, if it helps... it includes what you provided me at the end! Thanks in advance for your help! It is greatly appreciated.

 

$(document).ready(function(){
$("#q3 input").attr("type","password");

});

$(document).ready(function(){
  function isCorrectDate(n) {
    var t = n.getDay();
    var d = n.getDate();
    return (t==6);
  }
  function checkDate(n) {
    return[isCorrectDate(n),""];
  }
  function checkField(input, inst) {
    if ($(input).closest('li').hasClass('weekEnding')) {
      $(input).datepicker("option", {beforeShowDay: checkDate});
    }
  }
  $.datepicker.setDefaults( {beforeShow: checkField} );
  window.Parsley.addValidator('sat', {
    validateString: function(value) {
      return isCorrectDate(new Date(value));
    },
    messages: {
      en: 'Not valid date.'
    }
  });
  $('.weekEnding input').attr('data-parsley-sat','');
})

$(document).ready(function () {
 //Hide Type Signature tab
  $("#sigNav a:eq(0)").hide();
  $("#form-signature-dlg").on("shown.bs.modal", function(){$("#sigNav a:eq(1)").click();});
      
});

function hidebutton() {
  $('.Submit').addClass('hidden');
 }
function showbutton() {
  $('.Submit').removeClass('hidden');
 }

$(document).ready(function () {
  hidebutton();
  $(document).on('click','button.signSignatureBtn',function() {
    setTimeout(showbutton,0);
  });
  
  $(document).on('click','a.form-sig-remove',function() {
    hidebutton;
  });
});

0 0
replied on September 6, 2017

Hey,

it looks like you have doubled up on the $(document).ready's

Remove my code from inside it and paste it into yours.

Start there ill look over the rest

 

0 0
SELECTED ANSWER
replied on September 6, 2017
function isCorrectDate(n) {
  	var t = n.getDay();
  	var d = n.getDate();
  	return (t==6);
}
function checkDate(n) {
  	return[isCorrectDate(n),""];
}
function checkField(input, inst) {
  	if ($(input).closest('li').hasClass('weekEnding')) {
    	$(input).datepicker("option", {beforeShowDay: checkDate});
	}
}
function hidebutton() {
   	$('.Submit').addClass('hidden');
}
function showbutton() {
	$('.Submit').removeClass('hidden');
}


$(document).ready(function(){
 	$("#q3 input").attr("type","password");

   	$.datepicker.setDefaults( {beforeShow: checkField} );
   	window.Parsley.addValidator('sat', {
     	validateString: function(value) {
       	return isCorrectDate(new Date(value));
     },
     messages: {
       	en: 'Not valid date.'
     }
   	});
   	$('.weekEnding input').attr('data-parsley-sat','');

   	$("#sigNav a:eq(0)").hide();
  	$("#form-signature-dlg").on("shown.bs.modal", function(){$("#sigNav a:eq(1)").click();});
       
   	hidebutton();
   	$(document).on('click','button.signSignatureBtn',function() {
     	setTimeout(showbutton,0);
   	});
   
   	$(document).on('click','a.form-sig-remove',function() {
     	hidebutton();
   	});
});

I've untangled the code. Can you put that in so we can see if it helps :)

0 0
replied on September 6, 2017

Thank you! Worked like a charm.

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

Sign in to reply to this post.