Question 69740 in Ajax Question posted in
You can find the official documentation here.

Array values not able to get on Ajax success with JSON.parse – Jquery ajax

I have the following jQuery and Ajax codes

$("#grabIdCodeDetails").click(function() {
  var idCodeForDetails = $("#idCode").val();
  if (idCodeForDetails.trim() == "") {
    errorFunction("Please key in an ID Code");
    hidePreviousShownResult();
  } else {
    $.ajax({
      type: "POST",
      url: "fetchIdCodeDetailsFromDatabaseAjax.php",
      data: {
        idCodeForDetails: idCodeForDetails
      },
      success: function(fetchedDetails) {
        var returnedData = JSON.parse(fetchedDetails); 
        alert(returnedData['needle']);
      }
    });
  }
});

Following are the codes in fetchIdCodeDetailsFromDatabaseAjax.php page

$resultArray = [];
array_push($resultArray, $DeviceName, $Start_Date, $Customer, $TotalPinCount, $NeedleType, $DeliveryDate);

$DeviceName = $resultArray[0];
$Start_Date = $resultArray[1];
$Customer = $resultArray[2];
$TotalPinCount = $resultArray[3];
$NeedleType = $resultArray[4];
$DeliveryDate = $resultArray[5];

    echo json_encode(array(
            'needle' => $NeedleType,
            'deviceName' => $DeviceName,
            'pinCount' => $TotalPinCount,
            'startDate' => $Start_Date,
            'endDate' => $DeliveryDate,
            'customer' => $Customer
    ));

In the above $DeviceName, $Start_Date, $Customer, $TotalPinCount, $NeedleType, $DeliveryDate have respective values. When I echo, I can see the individual values.

But I am having Uncaught SyntaxError: Unexpected end of JSON input at JSON.parse (<anonymous>) error while executing this. I read that this could be due to it is returning empty strings. But that is not the case. When I tried to inspect type of data returning on Ajax success using alert(jQuery.type(fetchedDetails)), it shows string. Does anyone know what is going wrong here?

Tags:

2

Answers


  1. 0

    I think there is some problem with your code. Simply just write:

        echo json_encode([
        'needle' => $NeedleType,
        'deviceName' => $DeviceName,
        'pinCount' => $TotalPinCount,
        'startDate' => $Start_Date,
        'endDate' => $DeliveryDate,
        'customer' => $Customer
    ]);

    You do not need array push etc.

    For your front end try to console.log(fetchedDetails)

    $("#grabIdCodeDetails").click(function() {
  var idCodeForDetails = $("#idCode").val();
  if (idCodeForDetails.trim() == "") {
    errorFunction("Please key in an ID Code");
    hidePreviousShownResult();
  } else {
    $.ajax({
      type: "POST",
      url: "fetchIdCodeDetailsFromDatabaseAjax.php",
      data: {
        idCodeForDetails: idCodeForDetails
      },
      success: function(fetchedDetails) {
        console.log(fetchedDetails) // here 
      },
      error: function (xhr, ajaxOptions, thrownError) {
        console.log(xhr.status);
        console.log(thrownError);
       }
    });
  }
});

    Alert won’t show details.

    After that check your fetchedDetails and then use

    JSON.parse(fetchedDetails)

    or

    JSON.parse(fetchedDetails.data)

    You may have some status codes etc.

    Login or Signup to reply.
  2. 0

    You have to return the JSON encoded array instead of echo. You can use typeOf() in jQuery to check the data type.

    return  json_encode(array(
            'needle' => $NeedleType,
            'deviceName' => $DeviceName,
            'pinCount' => $TotalPinCount,
            'startDate' => $Start_Date,
            'endDate' => $DeliveryDate,
            'customer' => $Customer
    ));
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search