Űrlap+ php + üres mező

Űrlap+ php + üres mező
2015-02-05T11:59:14+01:00
2015-02-05T15:29:41+01:00
2022-08-09T09:45:30+02:00
Nyusszancs
Sziasztok!

Adott  egy html űrlap, php-vel feldolgozom, email címre elküldi az adatokat, átirányít másik oldalra, ha minden adatot megadtunk. 
Azonban, üres mezőknél nem figyelmeztet a kitöltetlen mezőkre.

Script:

<script type="text/javascript">
function validate()
{
var is_error = false;
var name = document.getElementByName('name');
if ( name.value=="" )
{
document.getElementById("errorSpan1").style.display="block";
is_error = true;
}
else
{
document.getElementById("errorSpan1").style.display="none";
}
return ( !is_error );
}
var is_error = false;
var email = document.getElementByName('email');
if ( email.value=="" )
{
document.getElementById("errorSpan2").style.display="block";
is_error = true;
}
else
{
document.getElementById("errorSpan2").style.display="none";
}
return ( !is_error );
}
var is_error = false;
var subject = document.getElementByName('subject');
if ( subject.value=="" )
{
document.getElementById("errorSpan3").style.display="block";
is_error = true;
}
else
{
document.getElementById("errorSpan3").style.display="none";
}
return ( !is_error );
}
var is_error = false;
var uzenet = document.getElementByName('uzenet');
if ( uzenet.value=="" )
{
document.getElementById("errorSpan4").style.display="block";
is_error = true;
}
else
{
document.getElementById("errorSpan4").style.display="none";
}
return ( !is_error );
}
</script>

Űrlap:

<form name="kapcsolat" action="kapcskuld.php" method="post">
<span class="aes-error"><strong>Kérjük, az összes mezőt töltse ki!<br>
</strong></span><br><input type="text" name="name" placeholder="Név" size="40" maxlength="30" style="font-size: 18px; padding: 5px;"><span id="errorSpan1" style="display:none;background:#FF0000">Nem adott meg nevet!</span>
<br>
<br><input type="text" name="email" placeholder="E-mail cím" size="40" maxlength="30" style="font-size: 18px; padding: 5px;"><span id="errorSpan2" style="display:none;background:#FF0000">Nem adott meg email címet!</span>
<br>
<br><input type="text" name="subject" placeholder="Üzenet tárgya" size="40" maxlength="50" style="font-size: 18px; padding: 5px;"><span id="errorSpan3" style="display:none;background:#FF0000">Nem adott meg tárgyat!</span>
<br>

<br><textarea name="uzenet" placeholder="Üzenet" rows="8" cols="40" style="font-size: 18px; padding: 5px;"></textarea><br><span id="errorSpan4" style="display:none;background:#FF0000">Nem írt be üzenetet!</span>

<br>
<br>
<input onclick="return(validate());" type="submit" class="aes-button" value="Üzenet küldése" style="font-size: 18px; padding: 5px;">
<input type="reset" class="aes-button" value="Mégsem" style="font-size: 18px; padding: 5px;">


</form>


PHP:

<?php
if($_POST['name'] && $_POST['email'] && $_POST['subject'] && $_POST['uzenet']!= "" ){
$name=trim($_POST['name']);
$email=trim($_POST['email']);
$subject=trim($_POST['subject']);
$uzenet=trim($_POST['uzenet']);


$to = "yxs@domain.hu";
$subject = "Kapcsolat űrlap érkezett";
$thankyou = "sikeres-uzenet-tovabbitas.html";


$message = "Kedves xy!<br/>"; $message .= "Az alábbi adatokat küldték a weboldalról:<br/>"; $message .= "Name:$name <br/>"; $message .= "Email:$email <br/>"; $message .= "Subject:$subject<br/>";
$message .= "Üzenet:$uzenet<br/>";

mail($to, $subject, $message, "From: " . $_POST['email'] . "\r\nReply-to: " . $_POST['email'] . "\r\n");
?>
<meta http-equiv="refresh" content="0; url=<?echo $thankyou;?>"">
<?php
}
?>


Mivel összeollóztam, nem tudom, hogy a php-be kell e még valami.
Mutasd a teljes hozzászólást!
1. A validate() függvényben az 1. return-nél már vissza is tér a függvény és a kód többi része nem is fut le.

Meg mintha a többi kód nem is a validate() függvényben lenne benne.

2. onclick="return(validate());" helyett onclick="return validate();" Bár én inkább a form onsubmit-jába tenném az ellenőrzést, mert mondjuk IE alatt simán egy enterrel is el lehet küldeni a form-ot és akkor az onclick nem aktiválódik, de az onsubmit igen.

3. Azért a szerver oldalon sem ártana elvégezni az ellenőrzést...
Mutasd a teljes hozzászólást!

  • A js-ben tuti nem kellene minden if else ág után , 

    return ( !is_error );
    mert így már az első if után visszatér és a többi mezőt le sem ellenőrzi
    Mutasd a teljes hozzászólást!
  • 1. A validate() függvényben az 1. return-nél már vissza is tér a függvény és a kód többi része nem is fut le.

    Meg mintha a többi kód nem is a validate() függvényben lenne benne.

    2. onclick="return(validate());" helyett onclick="return validate();" Bár én inkább a form onsubmit-jába tenném az ellenőrzést, mert mondjuk IE alatt simán egy enterrel is el lehet küldeni a form-ot és akkor az onclick nem aktiválódik, de az onsubmit igen.

    3. Azért a szerver oldalon sem ártana elvégezni az ellenőrzést...
    Mutasd a teljes hozzászólást!
  • Ja a <form tagbe betennék még egy

    onsubmit="return validate()"
    részt is és a gomb clickre nem kell a függvényhívás

    Tutorial:
    JavaScript Form Validation
    Mutasd a teljes hozzászólást!
  • Keress rá inkább a jquery validate pluginra. Egyik legjobb, és egyszerű nagyon.
    Mutasd a teljes hozzászólást!
  • És olvasd át Árnyék válaszát, mert a 3-ik pont (is) igen fontos !!!
    Mutasd a teljes hozzászólást!
  • Mutasd a teljes hozzászólást!
  • Ne haragudj, de csana válasza nem teljes, hiszen hiába veszed ki a return-t minden egyes if után, akkor sem fog a néven kívül más ellenőrzés lefutni, lásd a kommenteket a {}-knél:

    function validate() {//1 var is_error = false; var name = document.getElementByName('name'); if ( name.value=="" ) {//2 document.getElementById("errorSpan1").style.display="block"; is_error = true; }//2 else {//3 document.getElementById("errorSpan1").style.display="none"; }//3 return ( !is_error ); }//1 - itt zárod a függvényt, a többi kód nem az onclick hatására fog lefutni, hanem akkor, amikor a böngésző a script tag-hez ér var is_error = false; ...
    Tehát csak a return-ök kivétele nem oldhatta meg a problémádat!

    Még azt is hozzá kell tennem, hogy az ismétlődő
    var is_error = false;
    sorokat is ki kéne venned a kódból, mert úgy meg csak az utolsó mezőben lévő hiba esetén fogja az űrlapküldést letiltani a validate().
    Mutasd a teljes hozzászólást!
  • Megpróbáltam javítani a scriptet:
    <script type="text/javascript">
    function validate()
    {
    var is_error = false;
    var name = document.getElementByName('name');
    if ( name.value=="" )
    {
    document.getElementById("errorSpan1").style.display="block";
    is_error = true;
    }
    else
    {
    document.getElementById("errorSpan1").style.display="none";
    }
    var email = document.getElementByName('email');
    if ( email.value=="" )
    {
    document.getElementById("errorSpan2").style.display="block";
    is_error = true;
    }
    else
    {
    document.getElementById("errorSpan2").style.display="none";
    }
    var subject = document.getElementByName('subject');
    if ( subject.value=="" )
    {
    document.getElementById("errorSpan3").style.display="block";
    is_error = true;
    }
    else
    {
    document.getElementById("errorSpan3").style.display="none";
    }
    var uzenet = document.getElementByName('uzenet');
    if ( uzenet.value=="" )
    {
    document.getElementById("errorSpan4").style.display="block";
    is_error = true;
    }
    else
    {
    document.getElementById("errorSpan4").style.display="none";
    }
    return ( !is_error );
    }
    </script>

    Űrlap:
    <form name="kapcsolat" action="kapcskuld96.php" method="post" onsubmit="return validate();" >
    <span class="aes-error"><strong>Kérjük, az összes mezőt töltse ki!<br>
    </strong></span><br><input type="text" name="name" placeholder="Név" size="40" maxlength="30" style="font-size: 18px; padding: 5px;"><span id="errorSpan1" style="display:none;background:#FF0000">Nem adott meg nevet!</span>
    <br>
    <br><input type="text" name="email" placeholder="E-mail cím" size="40" maxlength="30" style="font-size: 18px; padding: 5px;"><span id="errorSpan2" style="display:none;background:#FF0000">Nem adott meg email címet!</span>
    <br>
    <br><input type="text" name="subject" placeholder="Üzenet tárgya" size="40" maxlength="50" style="font-size: 18px; padding: 5px;"><span id="errorSpan3" style="display:none;background:#FF0000">Nem adott meg tárgyat!</span>
    <br>

    <br><textarea name="uzenet" placeholder="Üzenet" rows="8" cols="40" style="font-size: 18px; padding: 5px;"></textarea><br><span id="errorSpan4" style="display:none;background:#FF0000">Nem írt be üzenetet!</span>

    <br>
    <br>
    <input type="submit" class="aes-button" value="Üzenet küldése" style="font-size: 18px; padding: 5px;">
    <input type="reset" class="aes-button" value="Mégsem" style="font-size: 18px; padding: 5px;">


    </form>

    A php-be, nem tudom mit írjak, hogy ne folyamatos syntax errort írjon  ki.
    Mutasd a teljes hozzászólást!
  • Esetleg ha a js végképpen nem akarna menni akkor alternatív megoldásként használhatod a pattern-t és a required opciót a patternhez kismillió regex van a neten.
    Mutasd a teljes hozzászólást!
  • document.getElementsByName('...')

    hiányzik az s betű a metódusnévből, mert a név tulajdonságnak nem kell egyedinek lennie. A getElementById-nél nincs többesszám, mert ugye az id-nek egyedinek kell lennie. A php-s rész az meg már egy külön kérdés.
    Mutasd a teljes hozzászólást!
  • Esetleg egy bővíthető REGEX-es kliens oldalra, melyet azért nem árt ha követ egy szerver oldali ellenőrzés is...
    <script type="text/javascript"> $(document).ready(function() { function kontroll(inputId) { $("#"+inputId+"").blur(function() { var akt_regex = /[a-z]{35}$/; //alapot lehet módosítani {15,35} teljes névre var username_regex = /^[a-z0-9\_\-\.]{4,10}$/; var jelszo_regex = /^[a-zA-Z0-9]{8,15}$/; var email_regex = /^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i; var melyik = $("#kontainer li").index($(this).parent('li')); var value = $(this).val(); if (inputId == 'fnev') { akt_regex = username_regex; } else if (inputId == 'jnev') { akt_regex = jelszo_regex; } else if (inputId == 'enev') { akt_regex = email_regex; } if(akt_regex.test(value)) { $(this).removeClass("rossz"); $(this).addClass("jo"); } else { $(this).removeClass("jo"); $(this).addClass("rossz"); alert('Hibás kitöltés!'); } }); } kontroll("fnev"); //felhasználónév kontroll("jnev"); //jelszó kontroll("enev"); //email }); </script>
    Mutasd a teljes hozzászólást!
abcd