[Ajax/PHP] Registration - Check for empty textboxs

Sun Dec 25, 2011 4:23 pm

Hi,

I'm doing a registration system and as you can see when i verify the fields, if it's empty it says that the FIELD_1 misses. And what i want is if the field is empty says that and then goes back, but i don't wanto the info already written disappears.

I'm using ajax, i never worked with it, so i'm gonna ask you if i'm doing everything ok:

registration form:

Code::  <link rel="stylesheet" type="text/css" href="style_val.css" /> <script src="ajaxforms.js" type="text/javascript" language="javascript"></script>  <div class="indent"> <h2> Inscrição </h2> <form action="" method="post"> <fieldset> <legend> ALUNO </legend> <br/> <div class="title" class="field"><label>Username*: </label><input type="text" size="30" name = "username" OnChange="CheckField(this)" tabindex="1"/></div> <div id="username" class="message"></div>

ajaxform:

Code:: var AJAXForms = false; var LastField = null; var isIE = false; // on !IE we only have to initialize it once if (window.XMLHttpRequest) { AJAXForms = new XMLHttpRequest(); } function CheckField(field) { if (window.XMLHttpRequest) { // branch for IE/Windows ActiveX version } else if (window.ActiveXObject) { AJAXForms = new ActiveXObject("Microsoft.XMLHTTP"); } AJAXForms.onreadystatechange = processChange; AJAXForms.open("GET", "check.php?op=ajax&field=" +field.name+"&value=" + field.value); LastField = field.name; AJAXForms.send(null); } function processChange() { if (AJAXForms.readyState == 4) { var res = document.getElementById(LastField); res.innerHTML = AJAXForms.responseText; res.style.visibility = "visible"; } }

style:

Code:: body,* { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: 12px; } .ajform { background: #FF7F50; border:1px solid black; padding: 4px; margin: 4px; width: 500px; } .title { width: 60%; background: #FFAF91; padding: 4px; } .field { padding: 4px; background: #FFE691; } .message { background: white; border:1px solid #FF7F50; visibility: hidden; margin: 4px; text-align: center; } .green { color: Green; } .red { color: red; } .category { background: #E0FF91; padding: 4px; }

Please help me.

Thank you,
PF2G