Form Submit Problem

When my form is filled out, and submit/send is hit the page flicks then returns back to the form page, with the form styles all incorrect. I’d like the form once complete to load another page or ID telling the user the message has been sent. (link)

Hi,

Not sure what you meant by the style is incorrect, I can’t see a change on FF.

As for displaying a message, you can do something like this:


<?php
if (count($_POST['submit'])>0) {
 echo "Form submitted";
}
?>
<form action="page.php" method="POST">
etc

One thing I noticed is that you didn’t close the script tag for “jquery.cycle.all.min.js” before or after submission.

Then I ran your code through WinMerge to compare the code before and after. I attached the results. There are a number of differences…

Flowforce - I’m not following was I suppose to load the PHP file in a browser, because I did that and just a bunch of jargon came up !?!?!?

Auth1 - there is a PHP file already, I would think it has it’s own message upon sending, but instead the page goes wonky.

It’s not a PHP file. It’s an HTML file. Orange is where the code is different, which may be why your fields lose some of their styling.

auth’s approach is probably best, since the user probably won’t need to re-visit the form after submission.

Hint: you can submit to the same page–you don’t have to submit to a separate page. That way, you won’t have to maintain two sets of the same code, which seems to be where some of your problems may be surfacing.

I renamed it to a HTML/HTM file this is all I see:

PK����¦v>~ fp#-��s����differences.htmì]{SÛFÿ»™Éw¸Š>ÀE’m°˜iÒ¦íLß%Óé_³t¶”È’qh†ïÞ½“„!ñIöž… ™Ö{o÷÷Û{ì½VÏ>ýæ&#8212;Wýú-ùþê§ɯ¯&#382;ÿøà b&#732;¶ýçÑ Ûþæê&#8250;ì&#402;c«Ý!W S&#376;ûQHÛþögãé&#8220;O óxÛ³ÙÌšYQ2¶¯~·=> Ží ŠRf¹Ü5.Ÿ>y&Þ“¯ŒºâuÂ8%BÚdÿLýë ãErróê&fq²¿. ÎÞrYà9q<š¤Œ_¼ºzižÊB¹Ïvù§þÄ’1#/ý€‘Ñ$¦ #¿³8Jø3[~G|9å7ð1‡âóR4•¥|jšOŸp÷{äÝôš©ÿ/eN7æç·OŸXAHÞ “þ8Ä{üœ ©ófœDÓÐ5(ˆ’ Äaã„ÝH1©˜¼Ë?›y>g÷ ƒ)¼Íî;4(tð(–…¤££a÷®½¶ü¹¯˜½‘ü9’…TOIûh.Õ9Veh›.ŠõÕÄ:¬KÝB¬_ ››¯€¬?ì)I-#ë2%±Ù\¬¯&¶„ìdÕgkÉZ7c¢ú@…ˆ‚…‚zJe`?VàWIâ_SR_$IÉGJ:]dé :U©Ù§Ãž’Ô²ÿO¿’XŽ.ÖW[òÿÙ²ÿOÕÚìÙ°§$µŒì )‰åÈæb}5±%dör£UìŽ@¬§$–a›‹8%¹Ü\®¯&·Œ®³ˆ®ß†Jè:Þ’Ø º S’+ÐÍåújrËèºK Nu(±ž’Ø º. S’+ÐÍåújrËèŽVe£„FJ%±tb¨T’[A’ÆJ5¹et½Ja@§W)èôª^µH sR ÝI5t’ѝTDwº„Nu ±ž’Ø :1Ô)É* cšÜ2º³jíî¬Z»;«Øîδ;ÓÓ[NäoÅäe¹7â•Ó!„ø ‚4¦ŽŽ/Œ¶!ÿŽ©ëKù cæ»ÜƒiE»ýù9™ÐdìCœ/lˆ—æ0 Ùy6)ôð$û“8MÓ CN)V ln\Â,Ç»\ó½^Û’LŠï¿ å7\°ÂÈjÄŒ©Ð/‰|™£¼£3!×rþEGqF…[( Bi€{¹ðžœÁÛNä²Ëgàƒpå“/~^bŽ+§µäc“Ú”'¾Ãå¬ö‹1?f ¥`—°@š÷`·àù@ØA* q™SU…‹ª6.JP°#le¬ÜLùÈ<Åu?¢u¨¬ÊžRèØò/TžJéCE

Hint: you can submit to the same page–you don’t have to submit to a separate page. That way, you won’t have to maintain two sets of the same code, which seems to be where some of your problems may be surfacing.

True, but where do I put auth code ?

The HTML file is inside the ZIP file. You don’t need to rename it. If you’re using Windows, there is native support for ZIP files.

I’m not clear on what your question is.

WinMerge is a little difficult to differentiate between the code although nice how it works. FlowForce you mentioned to use Auth1 PHP code, where do I place it ?

Edit:
You’ve highlighted in yellow the changes but most of it is the same !?!?!

Ohhh…Auth1 is another user who posted in this thread. I was referring to his example code.

When I click ‘submit’ on my form the page re-loads and the styles are messed up. It was mentioned in this thread that I could load the ‘sent’ message on the same page, those are the two problems I want to know what is the cause of ? Currently no message is displayed when the ‘submit’ is triggered.

First, you’re using two separate PHP files. It’s not “re-loading” on an individual one. The link you provided is construction_site_G.php, which is submitted to construction_site.php. Is there a reason why you are doing it this way?

The reason I posted a CSS/HTML comparison between those to pages is that one renders correctly, and the other doesn’t, which was your original question. If both pages are identical and one renders correctly, but the other doesn’t, then something has changed between them. The comparison file shows those differences.

I’ll re-check the styles, but on my current display is a little hard to notice between the two, do you have another method, maybe something online that I can distinguish easier ? As for what happens after the submit button is triggered, I’m not following ?

Go ahead and download and compare the generated HTML/CSS source with WinMerge yourself. The file I generated was supposed to make things easy to look at, but you may be able to view things easier through the actual application.

As for your original question, I’ve attached screenshots for what I’m seeing in firefox before and after a submission. Is that what you’re asking about?

As for your original question, I’ve attached screenshots for what I’m seeing in firefox before and after a submission. Is that what you’re asking about?

Yes, this is what I’m talking about. Shouldn’t there be a page that loads that says your message has been sent ?

It depends on what your source code looks like. Go ahead and post it, otherwise we can’t comment on it.

HTML code or PHP, if HTML that is in message 1. If PHP then sure :slight_smile:

I can already see your HTML source by going to view > source.

PHP to see what’s going on with your submission.

And like I said before, you aren’t submitting the page to itself, you’re submitting it to a separate page. It’s usually better for smaller applications to submit to itself.

Form PHP, yes there is HTML code within the PHP I don’t understand !!!

<?php 
$your_email ='yourname@your-website.com';// <<=== update to your email address

session_start();
$errors = '';
$name = '';
$visitor_email = '';
$user_message = '';

if(isset($_POST['submit']))
{
	
	$name = $_POST['name'];
	$visitor_email = $_POST['email'];
	$user_message = $_POST['message'];
	///------------Do Validations-------------
	if(empty($name)||empty($visitor_email))
	{
		$errors .= "\
 Name and Email are required fields. ";	
	}
	if(IsInjected($visitor_email))
	{
		$errors .= "\
 Bad email value!";
	}
	if(empty($_SESSION['6_letters_code'] ) ||
	  strcasecmp($_SESSION['6_letters_code'], $_POST['6_letters_code']) != 0)
	{
	//Note: the captcha code is compared case insensitively.
	//if you want case sensitive match, update the check above to
	// strcmp()
		$errors .= "\
 The captcha code does not match!";
	}
	
	if(empty($errors))
	{
		//send the email
		$to = $your_email;
		$subject="New form submission";
		$from = $your_email;
		$ip = isset($_SERVER['REMOTE_ADDR']) ? $_SERVER['REMOTE_ADDR'] : '';
		
		$body = "A user  $name submitted the contact form:\
".
		"Name: $name\
".
		"Email: $visitor_email \
".
		"Message: \
 ".
		"$user_message\
".
		"IP: $ip\
";	
		
		$headers = "From: $from \\r\
";
		$headers .= "Reply-To: $visitor_email \\r\
";
		
		mail($to, $subject, $body,$headers);
		
		header('Location: thank-you.html');
	}
}

// Function to validate against any email injection attempts
function IsInjected($str)
{
  $injections = array('(\
+)',
              '(\\r+)',
              '(\	+)',
              '(%0A+)',
              '(%0D+)',
              '(%08+)',
              '(%09+)'
              );
  $inject = join('|', $injections);
  $inject = "/$inject/i";
  if(preg_match($inject,$str))
    {
    return true;
  }
  else
    {
    return false;
  }
}
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html>
<head>
	<title>Contact Us</title>
<!-- define some style elements-->
<style>
label,a, body 
{
	font-family : Arial, Helvetica, sans-serif;
	font-size : 12px; 
}
.err
{
	font-family : Verdana, Helvetica, sans-serif;
	font-size : 12px;
	color: red;
}
</style>	
<!-- a helper script for vaidating the form-->
<script language="JavaScript" src="scripts/gen_validatorv31.js" type="text/javascript"></script>	
</head>

<body>
<?php
if(!empty($errors)){
echo "<p class='err'>".nl2br($errors)."</p>";
}
?>
<div id='contact_form_errorloc' class='err'></div>
<form method="POST" name="contact_form" 
action="<?php echo htmlentities($_SERVER['PHP_SELF']); ?>"> 
<p>
<label for='name'>Name: </label><br>
<input type="text" name="name" value='<?php echo htmlentities($name) ?>'>
</p>
<p>
<label for='email'>Email: </label><br>
<input type="text" name="email" value='<?php echo htmlentities($visitor_email) ?>'>
</p>
<p>
<label for='message'>Message:</label> <br>
<textarea name="message" rows=8 cols=30><?php echo htmlentities($user_message) ?></textarea>
</p>
<p>
<img src="captcha_code_file.php?rand=<?php echo rand(); ?>" id='captchaimg' ><br>
<label for='message'>Enter the code above here :</label><br>
<input id="6_letters_code" name="6_letters_code" type="text"><br>
<small>Can't read the image? click <a href='javascript: refreshCaptcha();'>here</a> to refresh</small>
</p>
<input type="submit" value="Submit" name='submit'>
</form>
<script language="JavaScript">
// Code for validating the form
// Visit [JavaScript Form Validation : quick and easy!](http://www.javascript-coder.com/html-form/javascript-form-validation.phtml)
// for details
var frmvalidator  = new Validator("contact_form");
//remove the following two lines if you like error message box popups
frmvalidator.EnableOnPageErrorDisplaySingleBox();
frmvalidator.EnableMsgsTogether();

frmvalidator.addValidation("name","req","Please provide your name"); 
frmvalidator.addValidation("email","req","Please provide your email"); 
frmvalidator.addValidation("email","email","Please enter a valid email address"); 
</script>
<script language='JavaScript' type='text/javascript'>
function refreshCaptcha()
{
	var img = document.images['captchaimg'];
	img.src = img.src.substring(0,img.src.lastIndexOf("?"))+"?rand="+Math.random()*1000;
}
</script>
<noscript>
Code from the <a href='http://www.html-form-guide.com/contact-form/html-contact-form-captcha.html'
>php contact form</a> article.
</noscript>
</body>
</html>

And which file is this?

This is the PHP file that the form uses or supposedly uses.