Displaying php validation results through javascript

[letom]

My Question is little complicated,
I have the following code in Jquery which submits a form and display the validation result from the destination page.


submitHandler : function(form) {
if($('#login').submit(function(){return false;}))
{
$.ajax
({
type: 'POST',
url: $('#login').attr('action'),
data: $('#login').serialize(),
success: function(data)
{
$('#results').html(data);
}
});
}
return false;
},

The destination page is in php. The content displayed in #results is php processed validation results

My Issue is - Iam getting some alpha numeric strings with the validation result as follows

{"output":"","status":-1,"error_messages":{"error":["please enter your name."],"success":[]}}

This is because i have a php file called message.php this validation results should be come through message.php. it is exactly processing and stripping the unwanted characters and displays the error message properly.

Is there any way to do this in the above JavaScript(Jquery)that the the validation results should come through message.php instead of direct displaying to avoid putting unwanted characters in validation results (only validation result should be displayed)..

Or any other suggestions you have ?

Looking forward for a favorable action..
I don't think i will get a accurate support about this issue from this forum... but may be ...

Regards TOM

[traq]

{"output":"","status":-1,"error_messages":{"error":["please enter your name."],"success":[]}}

This is what you're getting in PHP, or this is what you're getting as your response from PHP?

This is a JSON string. If this is on the PHP side, you can turn it into an associative array like so:
$myArray = json_decode( '{"output":"","status":-1,"error_messages":{"error":["please enter your name."],"success":[]}}',true );

similarly, you can use JSON.parse (https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/JSON/parse) (or jQuery's $.parseJSON (http://api.jquery.com/jQuery.parseJSON/) for better cross-browser compatibility) to turn the string into a JS object on the client side.

[letom]

This is what you're getting in PHP, or this is what you're getting as your response from PHP?
getting as response from php..
Adrain
Thanks.. i had spend my one day time by working over JSON, not getting the correct result.. but i will try again after checking your post..
I conquered the matter by using slice() by stripping out characters up to [" from left to right and right to left, then it will display only the error message "please enter your name" , Is it professional and ethical ?

[traq]

It's not a matter of ethics at all - your "solution" may work in this one case, but it is likely to break if the structure of the response ever changes. It's better to treat the response like what it actually is, JSON.

For example, since you're already using jQuery:
/* here's the json string you get in your ajax response */
var ajax_response_json = '{"output":"","status":-1,"error_messages":{"error":["please enter your name."],"success":[]}}';

/* parse it; you'll get a regular javascript object in return */
var ajax_response_object = $.parseJSON( ajax_response_json );

/* this way, you don't ruin the response, and you can access its properties normally */

/* for example, this alerts "please enter your name." */
alert( ajax_response_object.error_messages.error[0] );

[letom]

Thanks..Your coding is working fine, but in my case i have to display more that one..

But it would be nice if u have a look at this, it will not change if we slice it '{"output":"","status":-1,"error_messages":{"error":["please enter your name."],"success":[]}}'; only error message "please enter your name" is changing., remaining characters are at same position with same length...

approximately
slice(50, -19);

Ethics i mean .. There is a ethics in every thing..In programming also.. If it is ethical all working environment will feasible to afford that, should be fine.

[traq]

it will not change if we slice it '{"output":"","status":-1,"error_messages":{"error":["please enter your name."],"success":[]}}'; only error message "please enter your name" is changing., remaining characters are at same position with same length...
If you need to display the message several times, you can assign it its own var:
var ajax_response_json = '{"output":"","status":-1,"error_messages":{"error":["please enter your name."],"success":[]}}';
var ajax_response_object = $.parseJSON( ajax_response_json );

/* instead of alert()ing the value, assign a var */
var error_message = ajax_response_object.error_messages.error[0];

/* use (as often) as desired */
alert( error_message );
alert( error_message );
alert( error_message );

But if you're happy with slicing it instead, that's fine, of course.



Ethics i mean .. There is a ethics in every thing..In programming also.. If it is ethical all working environment will feasible to afford that, should be fine.
Of course - I understand that there are ethics in programming. What I was saying is that, in this case, choosing one method over the other does not have any "ethical" impact on anything.

[letom]

Noted the contents

[letom]

var error_message = ajax_response_object.error_messages.error[0];

Adrian
can u explain the red colored part... when iam using $.parseJSON iam getting a null result.

[traq]

before jQuery 1.9, $.parseJSON returns null if the JSON string is malformed (after 1.9, it throws an error).

Can you show the complete code you are using? and is the actual string you're using the same as the example you posted?

[letom]

Thanks..

following is the ajax coding to get the result


submitHandler : function(form) {
if($('#login').submit(function(){return false;}))
{
$.ajax
({
type: 'POST',
url: $('#login').attr('action'),
data: $('#login').serialize(),
success: function(data)
{
$('#results').html(data);
}
});
}
return false;
},

following is the php code, while this validation messages passes through this php code, it produce the correct error message "please enter your name"from the following
{"output":"","status":-1,"error_messages":{"error":["please enter your name."],"success":[]}}

But when we submitting it through ajax it is not going to the below coding , that is the problem iam getting some more results with the error message


if (isset($vars['object']) && is_array($vars['object']) && sizeof($vars['object']) > 0) {
foreach ($vars['object'] as $type => $list ) {
foreach ($list as $message) {
echo '<div id="error-msg">'.$message.'</div>';
}
}
}



<?php echo $messages; ?> //displays the error message

[traq]

with your ajax call, you're trying to treat the return value as html. If you specify that you're expecting json, you can use it like json:

$.ajax({
type: 'POST',
url: $('#login').attr('action'),
data: $('#login').serialize(),
dataType: 'json',
success: function( data ){
var errMsg = data.error_messages.error[0];
$('#results').html( '<p>The error message is: <b>'+errMsg+'</b>' );
}
});


But when we submitting it through ajax it is not going to the below coding , that is the problem iam getting some more results with the error message

I'm not sure what you mean by this.

[letom]

with your ajax call, you're trying to treat the return value as html. If you specify that you're expecting json, you can use it like json:

$.ajax({
type: 'POST',
url: $('#login').attr('action'),
data: $('#login').serialize(),
dataType: 'json',
success: function( data ){
var errMsg = data.error_messages.error[0];
$('#results').html( '<p>The error message is: <b>'+errMsg+'</b>' );
}
});



But when we submitting it through ajax it is not going to the below coding , that is the problem iam getting some more results with the error message
I'm not sure what you mean by this.

That is FYI only, to understand the php coding / i mean putting some more equal code like that in javascript will produce correct result.
Eg .. foreach provides a way to iterate over arrays in php / $.each is some more similar in java script

I will let you know here the result.... But i tried previously some more related to that, but not producing the accurate one

[traq]

typo in my code. This is the correct version:

$.ajax({
type: 'POST',
url: $('#login').attr('action'),
data: $('#login').serialize(),
dataType: 'json',
success: function( data ){
var errMsg = data.error_messages.error[0];
$('#results').html( '<p>The error message is: <b>'+errMsg+'</b>' );
}
});

[letom]

Yes .. I am going to notify that...
but not a fruitful one ..