Form valid. Lite annorlunda

7 svar · 1 799 visningar · startad av SGuncel 24 jan. 2011

SGuncelMedlem sedan jan. 2007217 inlägg

Frågan24 jan. 2011 21:51#1

Hej!

Jag håller på att koda gästbok och försöker fixa form valid.
Nu för tiden så använder människor pop-up valid eller bara text. Jag undrar hur man går så att fältet blir röd när man har missat att skriva in eller om det inte stämmer med bokstäver.

Just nu ser min form kod så här:

<form class="form" action="?new=post" method="post">

 <p class="name">
  <label>Name</label>
   <br />
  <input type="text" name="postName" />
 </p>
    
 <p class="text">
  <label for="post">Inlägg</label>
   <br />
  <textarea name="post"></textarea>
 </p>

 <p class="submit">
  <input type="submit" value="Send" />
 </p>
 
</form>

Bifogar två bilder hur jag vill ha och hur min form ser ut just nu.

voigtann1Medlem sedan juni 20019 519 inlägg

24 jan. 2011 21:52#2

Var är koden som gör gör som att den visar felmeddelandet? Har du satt CSS klass specifikt på input:en ? Du måste bifoga mer kod för att få ett vettigare svar, för det du har postat just nu säger inget om valideringen.

SGuncelMedlem sedan jan. 2007217 inlägg

24 jan. 2011 22:34#3

Har inte riktigt börjat än. Googlat lite om jag kunde hitta men hittade inget som jag är ute efter.

Så här ser min CSS kod ut:

input,textarea, sumbit { 
padding: 6px;
border-bottom: 3px solid #ee55b5;
border-left: 0px;
border-top: 0px;
border-right: 0px;
background-color: transparent;

margin-bottom: 10px;
width: 150px;

font-family: Tahoma, "Trebuchet MS", Verdana, Georgia;
font-size: 11px;
color: #fff;
}

textarea { 
width: 400px;
max-width: 400px;
height: 100px;
line-height: 150%;
}

.form label { 
padding: 5px;
border-bottom: 3px solid #ee55b5;
font-size: 11px;
font-family: Tahoma, "Trebuchet MS", Verdana, Georgia;
color: #fff;
width: 300px;
}

Danne VMedlem sedan aug. 20068 090 inlägg

24 jan. 2011 22:55#4

Ta och titta runt lite och se vad som finns därute.
http://www.google.se/search?q=php+formmail+with+validation&ie=utf-8&oe=utf-8&aq=t&rls=org.mozilla:en-US:official&client=firefox-a

SGuncelMedlem sedan jan. 2007217 inlägg

24 jan. 2011 23:13#5

Glömde att skriva. Jag kodar med ASP (=

Fredde MannenMedlem sedan nov. 20014 054 inlägg

25 jan. 2011 07:01#6

vet inte om du löst ditt problem ännu, men för att göra inputfälten ex en annan färg om man inte fyllt i dem så behövs tre delar:

Kontrollera med hjälp av ex. javascript, med fördel använd ett ramverk som jQuery, om fältet är tomt vid submit. Är fältet tomt lägg en klass på fältet.

ex. .error.

.error { background: #FFD0D0; border: 1px dotted #ff0000;}

<form class="form" action="?new=post" method="post">
 <p class="name">
  <label>Name</label>
   <br />
  <input type="text" name="postName" />
 </p>
 <p class="text">
  <label for="post">Inlägg</label>
   <br />
  <textarea name="post"></textarea>
 </p>
 <p class="submit">
  <input type="submit" value="Send" id="submit-form" />
 </p>
</form>

Finns givetvis färdiga plugins till jQuery för validering också. :)

voigtann1Medlem sedan juni 20019 519 inlägg

25 jan. 2011 07:11#7

sen skall du inte vara beroende av javascript att den validera din kod, skall även ske på server sidan.

SGuncelMedlem sedan jan. 2007217 inlägg

25 jan. 2011 10:29#8

Tack för all svar gott folk =)
Har löst med denna sidans script/artikel http://bassistance.de/jquery-plugins/jquery-plugin-validation/