Lege velden rood kleuren

Status
Niet open voor verdere reacties.
P

papauha

Gebruiker
Lid geworden
19 dec 2012
Berichten
18
Goede avond,

Ik zit al een tijdje met een vraag, ik heb een simpel form gemaakt met een invoer vakje, nu wil ik als er niks is ingevuld en er op verzonden wordt geklikt het veld wat niet is ingevuld laten opkleuren.

tot dus ver heb ik dit:


PHP: 
<?php 

$errors = array();
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
    if (empty($_POST['naam'])) {
        $errors['naam'] = true;
    }
}
?>



HTML: 
<style type="text/css">        
        .fout {
            color: #FF0000;
        }
    </style>


<form method="post" action="">
<label for="invoer" class="<?php if(!empty($errors['naam']) echo "fout";?>"></label>
Invoer<input type='text' name="name"/>
<input type='submit' name='verstuur'>
</form>


Enkel zit er ergens een fout in.. hij voert het niet uit in de browser!

Alvast bedankt voor jullie hulp!
 
Inplaats van

if (!empty

Moet het zijn

if (empty

Bij het weergeven van de class fout
 
bedankt voor de snelle reactie klaaspeter,
enkel nadat ik het heb aangepast werkt het nog niet..
 
je name van het input veld heet name en in de $_POST['naam'] die moeten wel matchen.
je moet dan dit doen:
PHP: 
<?php 
 
$errors = array();
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
    if (empty($_POST['name'])) 
    {
        $errors['naam'] = true;
    }
}
?>
<style type="text/css">        
        .fout {
            color: #FF0000;
        }
    </style>
 
 
<form method="post" action="">
<label for="invoer" class="<?php if(empty($errors['naam']) echo "fout";?>"></label>
Invoer<input type='text' name="name"/>
<input type='submit' name='verstuur'>
</form>
overigens vind ik dit echt iets voor javascript:
PHP: 
<?php 
 
$errors = array();
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
    if (empty($_POST['name'])) 
    {
        $errors['naam'] = true;
    }
}
?>
<html><head><style type="text/css">        
        .fout {
            color: #FF0000;
        }
    </style>
 <script type="text/javascript">
function controleEmpty()
{
var cItem = document.getElementById('name');
if(cItem.value=="")
{
alert("Vul het veld in!!!!!!!!!");
return false;
}
}
</script>
 </head><body>
<form method="post">
<label for="invoer" id="redlabel" class=""></label>
Invoer<input type='text' id="name" name="name"/>
<input type='submit' name='verstuur' onclick="controleEmpty();">
</form></body></html>
 
ik heb ook nog eventjes haakjes om het if statement gezet zodat er geen errors meer zijn.. en de pagina wordt uitgevoerd.. alleen kleur de label naam nog steeds niet mee als er niks wordt ingevuld..

HTML: 
<?php 
 
$errors = array();
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
    if (empty($_POST['name'])) 
    {
        $errors['naam'] = true;
    }
}
?>
<style type="text/css">        
        .fout {
            color: #FF0000;
        }
    </style>
 
 
<form method="post" action="">
<label for="invoer" class="<?php if(empty($errors['naam'])){ echo "fout";}?>"></label>
Invoer<input type='text' name="name"/>
<input type='submit' name='verstuur'>
</form>
 
Hoi papauha,
Ik zie binnen het <label></label> element helemaal geen tekst staan, dus kan deze ook niet rood worden met een class="fout".
Dan zou je het label een tekst mee moeten geven, bv.: <label ...>In te vullen:</label>

Of als het om het aanwijzen van het lege veld zelf gaat, zou je de class aan het text-inputveld kunnen verbinden, en dan de background-color of de border-color ervan rood kunnen laten worden bij niets invullen.
Want bij niet-ingevulde tekst in het invoerveld kan die niet-bestaande tekst ook niet rood worden. ;)

Met vriendelijke groet,
CSShunter
__________
O, het for="..." attribuut van het label moet slaan op de id="..." of name="..." van het element waar het label op slaat; dus hier zou het for="name" moeten worden.
 
Laatst bewerkt:
Het is inmiddels gelukt! Bedankt voor de reactie CSShunter, ik heb hem uiteindelijk aan de border van het input veld gekoppeld:

HTML: 
<?php 
 
$errors = array();
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
    if (empty($_POST['name'])) 
    {
        $errors['naam'] = true;
    }
}
?>
<style type="text/css">        
        .fout {
			border: solid 1px red;
            color: #FF0000;
        }
    </style>
 
 
<form method="post" action="">
<label for="invoer">Invoer</label>
<input type='text' class="<?php if(!empty($errors['naam'])){ echo "fout";}?>" name="name"/>
<input type='submit' name='verstuur'>
</form>
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan