显示数组中的数据

Question

In index.php page i have a script that fetches data from demo.php and displays the result in a div.

<div class="leftbox">
    <?php
        echo "<div id='proddisplay'>";
        echo "</div>";
    ?>
</div>

var onSubmit = function(e) {
    var txtbox = $('#txt').val();
    var hiddenTxt = $('#hidden').val();
    $.ajax({
        type: 'post',
        url: 'demo.php',
        data: {
            txt: txtbox,
            hidden: hiddenTxt
        },
        cache: false,
        success: function(returndata) {
            $('#proddisplay').html(returndata);
            console.log(returndata);
        },
        error: function() {
            console.error('Failed to process ajax !');
        }
    });
};

in demo.php script i get the result from

print_r($result);

the result that i get in the div is

Array ( [0] => 1st value [1] => 2nd value [2] => 3rd value [3] => 4th value )

I wish to get individial data from this array so that i can use each data seperately and wherever i want in the index.php page, but i am not able to do so. can anyone tell how can i fetch individual values from array for index page

P.S: i have an option to display the format in demo page in the form of result[0] and so on for every index value and call it as it is in the index page but that bounds me with the css. I wish to use any css in index page and just call the values in index page.

I tried using result[0] in index page but it displayed no result i tried assigning the values of an array to a variable and then call these variables to index page but that also didn't displayed any result

Answer 1

convert your array to json

echo json_encode($result);

in your script

var onSubmit = function(e) {
  var txtbox = $('#txt').val();
  var hiddenTxt = $('#hidden').val();
  $.ajax({
    type: 'post',
    url: 'test2.php',
    dataType: 'json',
    data: {
      txt: txtbox,
      hidden: hiddenTxt
    },
    cache: false,
    success: function(returndata) {
         $('#first').html(returndata[0]);
          $('#second').html(returndata[1]);
           $('#third').html(returndata[2]);
            $('#fourth').html(returndata[3]);
         console.log(returndata[0]);
    },
    error: function() { 
      console.error('Failed to process ajax !');
    }
  });
};

first,second,third,fourth will be the id of the div or the area where you wish to display the result