Extract Data from JSON and display in SWAL alert - php

Question

I am having problems while trying to show info from a Json to an alert, this is my code.
function check_values_chbx(){
var pre_insc = [];
}).done(function(response){
for(i=0; i<response.length; i++){
pre_insc[i] = response[0]['personas'][i]['name']+" "+response[0]['personas'][i]['ap_pat']+" "+response[0]['personas'][i]['ap_mat'];
}
alert(pre_insc[1]);
swal({
title: "Detalles de inscripcion",
text: "Participantes que quedaran inscritos: \n\n"+pre_insc.join('\n')+"\n\nCategoria:",
buttons: true,
dangerMode: false,
}).then((willDelete) => {
if (willDelete) {
swal("Participantes registrados con exito, mucha suerte!", {
icon: "success",
});
}else {
location.reload();
}
});
});
}
And this is my JSON
[
{
"personas": [
{
"name": "Jessica",
"ap_pat": "BocaNegra",
"ap_mat": "Garcia"
},
{
"name": "Fernando",
"ap_pat": "Soto",
"ap_mat": "Olivas"
}
],
"evento": [
{
"name": "Carrera larga"
}
],
"categoria": [
{
"name": "Juvenil"
}
]
}
]
I need to print each name like:
swal("name1\n"+name2\n"+etc").
Please if someone could help me it will be very helpful, have a nice day.

Answer 1

You can use the below script which recursively iterates a json object if it finds an array or Object until it finds the text for the given property and then print them all if the property name is name with \n separator, you can add the following inside your script file and pass it the response that you are receiving and use the returned names with your sweetAlert, just make sure you pass the response to the function like below
names = jsonParser.getNames(response[0]);
Add the below in you script
var jsonParser = {
isObject: function (property) {
return property && {}.toString.call(property) === '[object Object]';
},
isArray: function (property) {
return property && {}.toString.call(property) === '[object Array]';
},
getNames: function (errors) {
var data = "";
for (let message in errors) {
var errorSet = errors;
if (errorSet.hasOwnProperty(message)) {
if (jsonParser.isArray(errorSet[message]) || jsonParser.isObject(
errorSet[message])) {
data += jsonParser.getNames(errors[message]);
} else if (message == 'name') {
data += errorSet[message] + "\n";
}
}
}
return data;
}
};
An example to read the names from your given response is given below.
var jsonParser = {
isObject: function(property) {
return property && {}.toString.call(property) === '[object Object]';
},
isArray: function(property) {
return property && {}.toString.call(property) === '[object Array]';
},
convertToString: function(errors) {
var data = "";
for (let message in errors) {
var errorSet = errors;
if (errorSet.hasOwnProperty(message)) {
if (jsonParser.isArray(errorSet[message]) || jsonParser.isObject(
errorSet[message])) {
data += jsonParser.convertToString(errors[message]);
} else if (message == 'name') {
data += errorSet[message] + "\n";
}
}
}
return data;
}
};
var response = [{
"personas": [{
"name": "Jessica",
"ap_pat": "BocaNegra",
"ap_mat": "Garcia"
},
{
"name": "Fernando",
"ap_pat": "Soto",
"ap_mat": "Olivas"
}
],
"evento": [{
"name": "Carrera larga"
}],
"categoria": [{
"name": "Juvenil"
}]
}];
var names = '';
names = jsonParser.convertToString(response[0]);
console.log(names);
Your final script should look like
function check_values_chbx(){
var pre_insc = [];
}).done(function (response) {
var names = jsonParser.getNames(response[0]);
swal({
title: "Detalles de inscripcion",
text: "Participantes que quedaran inscritos: \n\n" + names +
"\n\nCategoria:",
buttons: true,
dangerMode: false,
}).then((willDelete) => {
if (willDelete) {
swal("Participantes registrados con exito, mucha suerte!", {
icon: "success",
});
} else {
location.reload();
}
});
});
Hope this helps you out