Question

i have a simple ajax call which returns html codes,

//=======-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-==-=-=-=-=-=-=-==-=-==-=-=-=-=
//SEARCH Submit ===============================================================================
$('.clicked_search').live("click",function() {
var from = $('#from').val();
var to = $('#to').val();
var sel = $('#sel').val();

var BegDT = new Date(from);
var EndDT = new Date(to);
var sum = BegDT - EndDT;
alert (BegDT +" b"+ EndDT +" e"+ sum);
if(sum > 0 | from == "" & to != "" | from != "" & to == ""){
$('.inv_date').show();
}
else{
    $("#app_panel").html('<div id="flash" align="left"  ><img src="img/clientimg/ajax.gif" align="absmiddle">&nbsp;<span class="loading">Loading Request...</span></div>');
    $("#clock").html('<div id="flash2" align="left"  ><img src="img/clientimg/ajax.gif" height="15px" align="absmiddle">&nbsp;<span class="loading"><font size="1">Loading Request...</font></span></div>');
    $.ajax({
        type: "POST",
        url: "database/clientpanel/logs/search_call_log.php",
        data: {
            from: from,
            to: to,
            sel: sel
            },
        cache: false,
        success: function(html){
            $("#flash").hide();
            $('.inv_date').hide();
            $("#app_panel").append(html);
        }
    });
    $.ajax({
        url: "database/clientpanel/logs/search_clock_log.php",
        cache: false,
        success: function(html){
            $("#flash2").hide();
            $('.inv_date').hide();
            $("#clock").append(html);
        }
    });
}   
return false;
});

but i also want it to return values that was produced from the php which the ajax called,

session_start();
include("../../dbinfo.inc.php");

// connect to the database
  $client_id = $_SESSION['clientid'];
//===========THIS PHP VALUES RIGHT HERE===================================
      $out = 0;  
      $in = 0;
      $ext =0;
      $min = 0;
      $sec = 0;
//====================================================================
  $query=" select * from call where client='$client_id' ORDER BY date_time DESC";
  $result = $mysqli->query($query);

how can i return the “html code” together with the “php values” using one ajax call?

Answer 1

You could transfer your data in a JSON format.

Within your PHP, you’ll build an array with all the data you want to pass back for the AJAX call.

$results = array(
  'html' => $html,
  'variable1'=>'value1',
  'variable2'=>'value2',
  ...
);

Now you encode this array into a JSON format using json_encode() –

$jsonString = json_encode($results);
echo $jsonString;

This is the value that you echo out of your PHP.

Now in your jQuery $.ajax request, you’ll need to specify the dataType:json, and you’ll be able to access all the parameters in your success callback –

$.ajax({
  type: "POST",
  dataType: "json",
  ...
  success: function(data){
    ...
    $("#app_panel").append(data.html);
    // also available :
    // data.variable1 and data.variable2
  }
});