CSS to remove input value in form

In the answer to this question:

http://www.experts-exchange.com/Web_Development/Web_Languages-Standards/CSS/Q_23259201.html

Roonaan suggested that a simple alternative to captcha is to have an input with a style of display:none and give it both a name and a value then process the form only if that field is empty.

I have tried his suggestion without success.  The value seems to be passed even when the input style is set to display: none

Am I missing something?
<?php
 
if (!empty($_POST['valid']))
echo $_POST['valid'];
 
?>
 
<form action="formTest.php" method="post">
 <input type="text" name="valid" value="Remove This If You Are a Person" style="display: none" />
 <input type="submit" name="submit" value="Submit" />
</form>

Open in new window

LVL 16
hankknightAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

supertone44Commented:
What is the name/value pair that keeps getting passed? Is it valid=Remove This If You Are a Person?

If so then try this:


<input type="text" name="valid" value="<?php echo $_POST['valid'];?>" style="display:none;" />

Open in new window

ncooCommented:
I think you want the reverse logic of that:

If the field 'valid' is hidden from the user they will not see it, so they will not fill it in.

If they are a spam bot (most anyway) they have no concept of css so will see the field and fill it in.

You then only process the form if valid is empty.

<?php
 
if (empty($_POST['valid']))
echo $_POST['valid'];
 
?>
 
<form action="formTest.php" method="post">
 <input type="text" name="valid" style="display: none" />
 <input type="submit" name="submit" value="Submit" />
</form>

Open in new window

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Ray PaseurCommented:
Hank, you can use a form token to accomplish what you want.  Code below.  It's an easy drop-in.

Best regards, ~Ray
// ALWAYS START A SESSION AT THE TOP OF EVERY PAGE
session_start();
 
 
// HERE ARE THE TOKEN FUNCTIONS
/* ************************************************************************* */
function make_form_token() 
{ // MAKE YOUR OWN VERSIONS OF X AND Y - CONSIDER USING MICROTIME, ETC
	$string = "X" . time() . $_SERVER["SCRIPT_FILENAME"] . "Y";
	$token  = md5($string);
	$_SESSION["_form_token"] = $token;
return $token;
}
 
function check_form_token($token=null) 
{ // EVALUATE THE IDENTITY OF THE TOKEN
	if (empty($token)) { $token = $_POST["_form_token"]; }
	if ($token == $_SESSION["_form_token"]) {
		$_SESSION["_form_token"] = md5($_SESSION["_form_token"]); // MUNG THE TOKEN
return true; 
}
return false;
}
 
function form_token_error() 
{ // IF YOU LIKE YOUR CLIENTS, YOU CAN MAKE THIS FRIENDLY
	die("Server Error F");
}
/* ************************************************************************** */
 
 
// HERE IS THE LINE of HTML IN THE FORM SCRIPT
<input type="hidden" name="_form_token" value="<?=make_form_token();?>" />
 
 
// CHECK FORM TOKEN IN THE ACTION SCRIPT
	if (!check_form_token()) { form_token_error(); }

Open in new window

Big Business Goals? Which KPIs Will Help You

The most successful MSPs rely on metrics – known as key performance indicators (KPIs) – for making informed decisions that help their businesses thrive, rather than just survive. This eBook provides an overview of the most important KPIs used by top MSPs.

Ray PaseurCommented:
@hankknight: Normally, it is a good idea to test the answers before you accept them.  One test you might want to consider on this topic is the test of what happens if a client's browser does not obey the CSS you have employed.  For example, let's say a client has poor eyesight and uses an audio accessibility aid or a  screen reader.  You've tried to be "tricky" but instead you've just bought yourself a thorny accessibility issue.  Depending on who your clients are, that could make for bad publicity.  Just a word to the wise.  Best regards to all, ~Ray
ncooCommented:
You raise a good point with accessibility but if you add a label to the input field and hide that as well using CSS. The label could read: leave this field empty. Screen readers would read this to the user and the user would know to leave the field empty.
Ray PaseurCommented:
@ncoo: That's an excellent idea!  Thanks, ~Ray
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
CSS

From novice to tech pro — start learning today.