Jump to content


Photo

Clear fields modal box


  • Please log in to reply
4 replies to this topic

#1 smith.james0

smith.james0

    Advanced Member

  • Members
  • PipPipPip
  • 119 posts

Posted 02 May 2014 - 03:09 AM

I am using modal box, the problem I have is that after the form has been submitted, I open it again it displays the "thank you" message. I need to reset the form, after the form has been submitted so it can be used again without refreshing the page.

	function validateEmail(emaila) { 
		var reg = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
		return reg.test(emaila);
	}
	function validateEmail(emailb) { 
		var reg = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
		return reg.test(emailb);
	}

	$(document).ready(function() {
		$(".modalbox").fancybox();
		$("#email").submit(function() { return false; });

		
		$("#sendemail").on("click", function(){
			var plant = document.getElementById('emaillink');
            var pageid = plant.dataset.id; 
            var pagetitle = plant.dataset.title; 
			
			var emailvala  = $("#emaila").val();
			var emailvalb  = $("#emailb").val();
			var msgval    = $("#name").val();
			var msglen    = msgval.length;
			var mailvalida = validateEmail(emailvala);
			var mailvalidb = validateEmail(emailvalb);
			
			if(mailvalida == false) {
				$("#emaila").addClass("error");
			}
			else if(mailvalida == true){
				$("#emaila").removeClass("error");
			}
			if(mailvalidb == false) {
				$("#emailb").addClass("error");
			}
			else if(mailvalidb == true){
				$("#emailb").removeClass("error");
			}
			
			if(msglen < 4) {
				$("#name").addClass("error");
			}
			else if(msglen >= 4){
				$("#name").removeClass("error");
			}
				
			
			if(mailvalida == true && mailvalidb == true && msglen >= 4) {
				// if both validate we attempt to send the e-mail
				// first we hide the submit btn so the user doesnt click twice
				$("#sendemail").replaceWith("<em>sending...</em>");
				
				$.ajax({
					type: 'POST',
					url: 'includes/share/sendmessage.php?pageid=' + pageid +'&title=' + pagetitle +'',
					data: $("#email").serialize(),
					success: function(data) {
						if(data == "true") {
							$("#email").fadeOut("fast", function(){
								$(this).before("<p><strong>Your email have been sent</strong></p>");
								setTimeout("$.fancybox.close()", 1000);
							});
						}
					}
				});
	

			}
		});
	});
	

I have tried using document.forms["#email"].reset(); but I can not get it to work.

 

Can anyone help?

 

James



#2 denno020

denno020

    Advanced Member

  • Members
  • PipPipPip
  • 712 posts
  • LocationAustralia

Posted 02 May 2014 - 05:47 AM

Give this a try

document.getElementById("myForm").reset();


#3 smith.james0

smith.james0

    Advanced Member

  • Members
  • PipPipPip
  • 119 posts

Posted 02 May 2014 - 03:18 PM

Would that go after 

 

setTimeout("$.fancybox.close()", 1000);

 

James



#4 denno020

denno020

    Advanced Member

  • Members
  • PipPipPip
  • 712 posts
  • LocationAustralia

Posted 02 May 2014 - 05:17 PM

You can put it either side of the setTimeout. Putting it after won't delay it from being executed.

#5 smith.james0

smith.james0

    Advanced Member

  • Members
  • PipPipPip
  • 119 posts

Posted 04 May 2014 - 02:02 PM

I have tried this

if(data == "true") {
							$("#email").fadeOut("fast", function(){
								$(this).before("<p><strong>Your email have been sent</strong></p>");
								setTimeout("$.fancybox.close()", 1000);
								document.getElementById("#email").reset();
							});
						}

The script seams slower, but it doesn't reset the fields

 

James






0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

Cheap Linux VPS from $5
SSD Storage, 30 day Guarantee
1 TB of BW, 100% Network Uptime

AlphaBit.com