Storing error messages in the form fields

Hi everyone,

I have the following basic form on my page.

<div id="newsletter">
<form action="" method="post" id="newsletter" name="newsletter">
<fieldset>

<p>Sign up to our newsletter.</p>
<div>
<label for="firstname">First Name:</label>
<input id="firstname" name="firstname" type="text" value="First name" onfocus="if (this.value == 'First name') this.value=''" onblur="if (this.value == '') this.value='First name'" /> </div>
<div>
<label for="lastname">Last Name:</label>
<input id="lastname" name="lastname" type="text" value="Last name" onfocus="if (this.value == 'Last name') this.value=''" onblur="if (this.value == '') this.value='Last name'" /> </div>

<div>
<label for="email">Email:</label>
<input id="email" name="email" type="text" value="Email address" onfocus="if (this.value == 'Email address') this.value=''" onblur="if (this.value == '') this.value='Email address'" />
</div>
<div id="submit_button">
<input type="submit" class="submit" value="Subscribe" name="submit" />
</div>

</fieldset>
</form>
</div>

I just applied the server validation that comes with CSS form builder but I wanted the error messages to be displayed within the form fields, ie. instead of:

value="First name"

it would be:

value="First name is required."

I wondered if someone could tell me how I'd go about doing this?

I've also applied an insert record server behaviour to the form and have the "after insert go to" field set to:

index.php?sent=true

In the above form I have the following line:

<p>Sign up to our newsletter.</p>

But after the record is inserted I wanted the contents of the above p tags to be replaced with a confirmation message.

I have the following already:

<?php if(isset($_GET['sent']) && $_GET['sent'] == "true") { ?> <p id="confirm"> <strong>Thank you – your details have been processed. </strong></p><?php } ?>

But this would just show the confirmation text and not actually replace the contents of the previous p tags.

I wondered if I could get some advice on how to do this?

Appreciate any help.

To answer your first question, you can accomplish this by first applying the server side validation show if server behavior to the input field and then taking the php code and place it in the value attribute of the input field, so your input field might look something like this:

<input id="firstname" name="firstname" type="text" value="<?php if($serverside) {echo "invalid";} else echo "First name"; ?>" onfocus="if (this.value == 'First name') this.value=''" onblur="if (this.value == '') this.value='First name'" />

for your second question, you can wrap the p tag with an if else statement:

<?php if(isset($_GET['sent']) && $_GET['sent'] == "true") { ?> <p id="confirm"> <strong>Thank you – your details have been processed. </strong></p><?php } else { ?>
<p>Sign up to our newsletter.</p>
<?php } ?>

Thanks for the reply,

So the validation code for the first field is:

<?php
if (ValidatedField('index_965','index_965')) {
if ((strpos((",".ValidatedField("index_965","index_965").","), "," . "1" . ",") !== false || "1" == "")) {
if (!(false)) {
?>
<span style="color: red"> First name is required </span>
<?php //WAFV_Conditional index.php index_965(1:)
}
}
}?>


Would I need to alter this in order to use it in the input field as you suggested:

<input id="firstname" name="firstname" type="text" value="<?php if($serverside) {echo "invalid";} else echo "First name"; ?>" onfocus="if (this.value == 'First name') this.value=''" onblur="if (this.value == '') this.value='First name'" />

Also I have an onblur event in the input fields so that if someone clicks out of the field without typing something in it, the original label, ie. 'First name' is reinserted into the field. This creates a problem because I've noticed that the form still submits even if a name isn't typed into the field. It's assuming that 'First name' is an entry and therefore isn't validating it correctly. Is there a way around this? I guess it would have to check if the contents of the field was 'First name' and if yes then validation would fail.

Your input field should look something like this:

<input id="firstname" name="firstname" type="text" value="<?php
if (ValidatedField('index_965','index_965')) {
if ((strpos((",".ValidatedField("index_965","index_96 5").","), "," . "1" . ",") !== false || "1" == "")) {
if (!(false)) {
?>First name is required<?php //WAFV_Conditional index.php index_965(1
}
}
}?>" onfocus="if (this.value == 'First name') this.value=''" onblur="if (this.value == '') this.value='First name'" />


In regard to your second question, you probably could do it as you said. But Another way you can do it is in javascript. So on the submit event of of the form, create a function that checks if the value is First Name then return false, otherwise return true.

Ok thanks for that - I'll look into it.

Originally Said By: Dani Chankhour

  In regard to your second question, you probably could do it as you said. But Another way you can do it is in javascript. So on the submit event of of the form, create a function that checks if the value is First Name then return false, otherwise return true.  

Sorry to come back to this issue but I'm still having trouble solving it. Just to recap, the following code has a javascript onblur event in the input fields so that if someone clicks out of the field without typing something in it, the original label, eg. 'First name' is reinserted into the field. The field is also being validated by some php code, however the onblur event creates a problem because the form still submits even if a name isn't typed into the field. It's assuming that 'First name' or 'Last name' are entries and therefore isn't validating it correctly.

<div> 
          <label for="firstname">First Name:</label> 
          <input id="firstname" name="firstname" type="text" value="First name" onfocus="if (this.value == 'First name') this.value=''" onblur="if (this.value == '') this.value='First name'" />           
                    <?php 
if (ValidatedField('index_965','index_965'))  { 
  if ((strpos((",".ValidatedField("index_965","index_965").","), "," . "1" . ",") !== false || "1" == ""))  { 
    if (!(false))  { 
?> 
            <span style="color: red"> First name is required </span> 
            <?php 
    } 
  } 
}?> 
        </div> 
        <div> 
          <label for="lastname">Last Name:</label> 
          <input id="lastname" name="lastname" type="text" value="Last name" onfocus="if (this.value == 'Last name') this.value=''" onblur="if (this.value == '') this.value='Last name'" />    </div>
        <?php 
if (ValidatedField('index_965','index_965'))  { 
  if ((strpos((",".ValidatedField("index_965","index_965").","), "," . "2" . ",") !== false || "2" == ""))  { 
    if (!(false))  { 
?> 
          <span style="color: red"> Last name is required </span> 
          <?php 
    } 
  } 
}?> 
<div>

Since I'm only using server side validation for the fields and the errors are output to spans, I didn't want to go the javascript way as you suggested. To do it the php way, I'm guessing I would have to alter the ValidatedField() function so that it returns false on blank or "First name", or "Last Name", and if yes then validation would fail and so the span with the error text "First name is required" would show, then the same with the second field.

<?php 
if (!session_id())  { 
  session_start(); 
} 
function ValidatedField($page,$field)  { 
  $theFields= ""; 
  $retVal = ""; 
  if (isset($_SESSION["WAVT_".$page."_Errors"]))  { 
    $theFields = "&".$_SESSION["WAVT_".$page."_Errors"]; 
  } 
  if (strpos($theFields,"&WAVT_".$field."=") !== false)  { 
    $retVal = substr($theFields,strpos($theFields,"&WAVT_".$field."=")+strlen("&WAVT_".$field."=")); 
  } 
  if (strpos($retVal,"&WAVT_") !== false)  { 
    $retVal = substr($retVal,0,strpos($retVal,"&WAVT_")); 
  } 
  if ($retVal == "" && $page == $field) { 
    $retVal = ValidatedField($page,$field."_Errors"); 
  } 
  return $retVal; 
} 

?>

As I'm not really sure how the above function works, can I get some help in revising it if this is the way to solve this? I understand though if this is beyond the scope of help in these forums.

I wouldn't mess with that function. Instead change the value that you are validating from inside the server validation server behavior directly.

Right now you are probably using:
<?php echo((isset($_POST['firstname']))?$_POST['firstname']:""); ?>

instead make it:
<?php echo((isset($_POST['firstname']) && $_POST['firstname'] != "First Name")?$_POST['firstname']:""); ?>

Originally Said By: Ray Borduin

  I wouldn't mess with that function. Instead change the value that you are validating from inside the server validation server behavior directly.

Right now you are probably using:
<?php echo((isset($_POST['firstname']))?$_POST['firstname']:""); ?>

instead make it:
<?php echo((isset($_POST['firstname']) && $_POST['firstname'] != "First Name")?$_POST['firstname']:""); ?>  

I changed the server behaviours so the code now looks like this:

<?php 
if (isset($_POST["submit"]))  {
  $WAFV_Redirect = "";
  $_SESSION['WAVT_index_965_Errors'] = "";
  if ($WAFV_Redirect == "")  {
    $WAFV_Redirect = $_SERVER["PHP_SELF"];
  }
  
  $WAFV_Errors = "";
  $WAFV_Errors .= WAValidateRQ(((isset($_POST['firstname']) && $_POST['firstname'] != "First Name")?$_POST['firstname']:"") . "",false,1);
  $WAFV_Errors .= WAValidateRQ(((isset($_POST['lastname']) && $_POST['lastname'] != "Last Name")?$_POST['lastname']:"") . "",false,2);
  $WAFV_Errors .= WAValidateEM(((isset($_POST["email"]))?$_POST["email"]:"") . "",true,3);

  if ($WAFV_Errors != "")  {
    PostResult($WAFV_Redirect,$WAFV_Errors,"index_965");
  }
}
?>

The form code still looks like this:

<div id="newsletter"> 
    <form action="" method="post" id="newsletter" name="newsletter">   
      <fieldset> 
        <?php if(isset($_GET['sent']) && $_GET['sent'] == "true") { ?> <p id="confirm" style="background-color: red; color: white;"> <strong>Thank you – your details have been processed. </strong></p><?php } else { ?>
<p>Subscribe to our newsletter.</p>
<?php } ?>
        <div> 
          <label for="firstname">First Name:</label> 
          <input id="firstname" name="firstname" type="text" value="First name" onfocus="if (this.value == 'First name') this.value=''" onblur="if (this.value == '') this.value='First name'" />          
                    <?php
if (ValidatedField('index_965','index_965'))  {
  if ((strpos((",".ValidatedField("index_965","index_965").","), "," . "1" . ",") !== false || "1" == ""))  {
    if (!(false))  {
?>
            <span style="color: red"> First name is required </span>
            <?php //WAFV_Conditional index.php index_965(1:)
    }
  }
}?>
        </div> 
        
        <div> 
          <label for="lastname">Last Name:</label> 
          <input id="lastname" name="lastname" type="text" value="Last name" onfocus="if (this.value == 'Last name') this.value=''" onblur="if (this.value == '') this.value='Last name'" />    </div> 
        <?php
if (ValidatedField('index_965','index_965'))  {
  if ((strpos((",".ValidatedField("index_965","index_965").","), "," . "2" . ",") !== false || "2" == ""))  {
    if (!(false))  {
?>
          <span style="color: red"> Last name is required </span>
          <?php //WAFV_Conditional index.php index_965(2:)
    }
  }
}?>
<div> 
  <label for="email">Email:</label> 
          <input id="email" name="email" type="text" value="Email address" onfocus="if (this.value == 'Email address') this.value=''" onblur="if (this.value == '') this.value='Email address'" /> 
          <?php
if (ValidatedField('index_965','index_965'))  {
  if ((strpos((",".ValidatedField("index_965","index_965").","), "," . "3" . ",") !== false || "3" == ""))  {
    if (!(false))  {
?>
            <span style="color: red"> Email is required </span>
            <?php //WAFV_Conditional index.php index_965(3:)
    }
  }
}?>
</div> 
        <div id="submit_button"> 
          <input type="submit" class="submit" value="Subscribe" name="submit" /> 
          </div> 
        
        </fieldset> 
  </form> 
  </div>

But this didn't fix the problem. Any ideas what I did wrong?

Any chance of some further help here?

I have opened a support incident so that someone can work with you directly. I can't seem to identify the problem from here.