jdadwilson
03-11-2016, 06:27 AM
I have a problem with the Javascript processing of an Ajax returned array.
This is the code for the Ajax call:
var request;
var aaData;
// Initialize jQuery
$(document).ready(function() {
'use strict';
$('#table_FamilyPages').on('click', 'tbody tr', function() {
console.info( 'fam_ID: ' + oTable.row(this).cell(this, 1).data());
var famID = oTable.row(this).cell(this, 1).data();
request = $.ajax({
url: "files_ajax/ajax_FamilyPage_Single.php?fam_ID=" + famID,
dataType: "json"
});
// callback handler that will be called on success
request.done(function () {
$('#pages_remote').hide();
$('#pages_local').hide();
// Code here to display page info
var aaData = JSON.parse(request);
document.getElementById('idLongName').innerHTML = aaData.name_long;
$('#pages_family').show();
});
// callback handler that will be called on failure
request.fail(function (jqXHR, textStatus, errorThrown){
// Inform user of the error and log to console for debugging
var errMessage = "The following error occured: " + textStatus + ' - # ' + errorThrown;
alert(errMessage);
console.error(errMessage);
});
// callback handler that will be called regardless if failed or succeeded
request.always(function () {
// reenable the inputs
});
});
});
The question is... What variables do I use in the JSON.parse(???) [see bold] function and then what do I use in the innerHTML line [see bold]?
Testing the code I receive an error: SyntaxError: JSON.parse: unexpected character at line 1 column 2 of the JSON data
Here is a sample of the encoded JSON array returned from the Ajax call.
{"sEcho":1,"iTotalRecords":100,"iTotalDisplayRecords":100,"aaData":[{"name_short":"SHORT NAME","name_long"
:"LONG NAME","submitter":"SUBMITTER","photo":"PHOTO","caption":"CAPTION","text":"TEXT"}]}
This is a link to my test page: http://www.txfannin.org/new-site/familypages.php
TIA for your assistance
jdadwilson
This is the code for the Ajax call:
var request;
var aaData;
// Initialize jQuery
$(document).ready(function() {
'use strict';
$('#table_FamilyPages').on('click', 'tbody tr', function() {
console.info( 'fam_ID: ' + oTable.row(this).cell(this, 1).data());
var famID = oTable.row(this).cell(this, 1).data();
request = $.ajax({
url: "files_ajax/ajax_FamilyPage_Single.php?fam_ID=" + famID,
dataType: "json"
});
// callback handler that will be called on success
request.done(function () {
$('#pages_remote').hide();
$('#pages_local').hide();
// Code here to display page info
var aaData = JSON.parse(request);
document.getElementById('idLongName').innerHTML = aaData.name_long;
$('#pages_family').show();
});
// callback handler that will be called on failure
request.fail(function (jqXHR, textStatus, errorThrown){
// Inform user of the error and log to console for debugging
var errMessage = "The following error occured: " + textStatus + ' - # ' + errorThrown;
alert(errMessage);
console.error(errMessage);
});
// callback handler that will be called regardless if failed or succeeded
request.always(function () {
// reenable the inputs
});
});
});
The question is... What variables do I use in the JSON.parse(???) [see bold] function and then what do I use in the innerHTML line [see bold]?
Testing the code I receive an error: SyntaxError: JSON.parse: unexpected character at line 1 column 2 of the JSON data
Here is a sample of the encoded JSON array returned from the Ajax call.
{"sEcho":1,"iTotalRecords":100,"iTotalDisplayRecords":100,"aaData":[{"name_short":"SHORT NAME","name_long"
:"LONG NAME","submitter":"SUBMITTER","photo":"PHOTO","caption":"CAPTION","text":"TEXT"}]}
This is a link to my test page: http://www.txfannin.org/new-site/familypages.php
TIA for your assistance
jdadwilson