php - Handle jquery .ajax results and display validation status for individual fields next to them -

validating field on client side , try display warning each 1 next field not problem:

<div class="formblock">     <label class="screen-reader-text">email</label>     <input type="text" name="email" {if $smarty.session.email} value={$smarty.session.email} disabled {/if} id="email" class="txt requiredfield email" placeholder="email:"/> </div>  <div class="formblock">     <label class="screen-reader-text">message</label>     <textarea name="comments" id="commentstext" class="txtarea requiredfield"       placeholder="message:"></textarea> </div> 

e.g check empty use .each , check every field , append span next it.

$('.requiredfield').each(function () {     if ($.trim($(this).val()) == '') {         var labeltext = $(this).prev('label').text();         $(this).parent().append('<span class="error">you forgot enter ' + labeltext + '.</span>');         $(this).addclass('inputerror');         haserror = true;      } }); 

however on server side way things perform validation each field , append error message var ($errortext in case) echo in end , display after ajax success on top of form.

$errortext .= " <li> name has contain more 2 characters </li> ";  if ($error) { echo $errortext;  } 

how can per field (similar on client side) , return span next them ? presume instead of returning 1 var echo have return maybe json result , handle ?

yourfile.php

header('cache-control: no-cache, must-revalidate'); header('expires: mon, 26 jul 1997 05:00:00 gmt'); header('content-type: application/json');  $validationdata = json_decode($_post['validationdata'], true);  //do validation stuff here //$validationdata associative array containing validation data //sent client's ajax call  $data = array('error' => 'my errormessage'); //serializing dummy data client echo json_encode($data); 

how convert form data json: convert form data javascript object jquery

someotherfile.htm

$.ajax({     url: 'yourfile.php',     data: { validationdata: json.stringify(yourformdataobject) },     success: function(data){         console.log(data.error); //'my errormessage'     } }); 

the parsed object, data, recieved server contain id property match element, , message show next it.