CODEWITHSUNDEEP
phpjqueryajax
user1844626
user1844626

Reputation: 1868

Send variable as ajax response

I'm posting a form by ajax and printing response in the form page.

Index.php:

<script src="jquery.min.js"></script>
<script src="jquery.form.min.js"></script> 
<script type="text/javascript">
    function a(){alert('ok');
$(function(){ 
    $('#submitForm').ajaxForm(function(result){
                    alert('the form was successfully posted!');
                    document.getElementById('resulte').innerHTML=result;
                }).submit();
         });
         }
</script>
    <body>
    <form id="submitForm" name="submitForm" action="upload.php" method="post" enctype="multipart/form-data" >
    File: <input name="myfile" type="file" />
    <input type="button" id="submitBtn" name="submitBtn" value="Upload" onclick="a();" />
    </form>
    <div id="resulte" name="resulte">a</div>
    <span id="usererr" name="usererr" class="formerror"></span>
    <span id="passerr" name="passerr" class="formerror"></span>
    <span id="passconferr" name="passconferr" class="formerror"></span>
    </body>

upload.php:

<?php 
$result = 0; 
$target_path = 'uploads/' . basename( $_FILES['myfile']['name']); 
if(@move_uploaded_file($_FILES['myfile']['tmp_name'], $target_path)) {
$result = 1;
} 
sleep(1);
echo"good";
$arr=array('username'=>array('isEmpty'=>'required','exists'=>'username exists'),'password'=>array('isEmpty'=>'required'))
?>

I want to send $arr to ‘index.php’ by ajax and show the values in ‘usererr’ and ‘passerr’ spans

OR

echo each line in different spans in ‘index.php’. How can I do that ?

-thanks.

Edit:

I did the following but now no text is printing there in ‘usererr’ span and the alert box not displaying.whats wrong did I do ? (form is posted and file saved successfully, but the problem is about 'response')

Index.php:

<script src="jquery.min.js"></script>
<script src="jquery.form.min.js"></script> 
<script type="text/javascript">
function a(){ 
    $('#submitForm').ajaxForm({
        dataType: 'json',
        success: function(result){        
                    alert('the form was successfully posted!');
              $('#usererr').html(result['username']['isEmpty']);
                }}).submit();
         }</script>

    <body>
    <form id="submitForm" name="submitForm" action="upload.php" method="post" enctype="multipart/form-data" >
    File: <input name="myfile" type="file" />
    <input type="button" id="submitBtn" name="submitBtn" value="Upload" onclick="a();" />
    </form>
    <div id="resulte" name="resulte">a</div>
    <span id="usererr" name="usererr" class="formerror"></span>
    <span id="passerr" name="passerr" class="formerror"></span>
    <span id="passconferr" name="passconferr" class="formerror"></span>
    </body>

upload.php:

<?php 
$result = 0; 
$target_path = 'uploads/' . basename( $_FILES['myfile']['name']); 
if(@move_uploaded_file($_FILES['myfile']['tmp_name'], $target_path)) {
$result = 1;
}
$arr=array('username'=>array('isEmpty'=>'required','exists'=>'username exists'),'password'=>array('isEmpty'=>'required'));
echo json_encode($arr);
?>

Upvotes: 0

Views: 1740

Answers (3)

Pixelmonster
Pixelmonster

Reputation: 394

You have to parse the array as JSON:

json_encode();

Then you can echo the result.

In JavaScript you can decode it. Because you are already using jQuery you can get the data in the array from 'result'. Access it like result.username.isEmpty

Upvotes: 1

Nouphal.M
Nouphal.M

Reputation: 6344

Try echo json_encode($arr); in your upload.php. And in your ajaxForm plugin set the option to json like below

 $('#submitForm').ajaxForm({
                dataType:  'json',
                success:   function(result){
                      $('#usererr').html(result['username']['isEmpty']);   
                      $('#passerr').html(result['password']['isEmpty']);
                },                  
            }).submit();

Upvotes: 1

Sudhir Bastakoti
Sudhir Bastakoti

Reputation: 100175

you could use json as dataType, like:

$('#submitForm').ajaxForm({
   dataType: 'json',
   success: function(result){
       //get the required values from result like result.username.isEmpty
       console.log(result);
   }).submit();
});

and json_encode() the array to be returned in PHP, like:

...
$arr=array('username'=>array('isEmpty'=>'required','exists'=>'username exists'),'password'=>array('isEmpty'=>'required'))
echo json_encode($arr);

See: ajaxForm

Upvotes: 1

Related Questions