Processing json encode ($data) via ajax jquery

I am working with ajax, JQuery and php; I send an ajax request to php via post, as follows:

function obtenermail() {
    //console.log($('#destinatario').val());
    var ced = $('#destinatario').val();
    $.ajax({
        type: "POST",
        data: { 'cedula': $('#destinatario').val()},
        url: "<?php echo site_url();?>"+"/roles/obtenercorreo", 
        success : function(data) {
            console.log(data);

        }
    });
}

In php I have the following function:

public function obtenercorreo(){
    if($this->session->userdata('logueado')){
        $ced = $this->input->post('cedula');
        $data = $this->persona_model->getPersonaced($ced);
        echo json_encode($data);
    }else{
        redirect('','refresh');
    }
}

The request works correctly, it shows me the arrangement as follows:

[{"cedula":"1100253986","nombres":"SOTO CASTILLO LAURO HERNAN","mod_laboral":"CONTRATO COLECTIVO","email":""}]

What I don't know, is how to get each value separately, since if I put

console.log(data[0])
console.log(data.cedula)
console.log(data['cedula'])

Returns me undefined or an empty string .

My question is: How could I do to read each individual item? i.e. get the cedula, or the mail separately

 4
Author: Juan Pinzón, 2016-03-01

3 answers

Right now it's treating it as if it were a string, you need to validate/process that string as JSON (with JSON.parse) and then you'll be able to access the data easily.

The changes to the JavaScript code would look like this:

$.ajax({
    type: "POST",
    data: { 'cedula': $('#destinatario').val()},
    url: "<?php echo site_url();?>"+"/roles/obtenercorreo", 
    success : function(data) {
        var datos = JSON.parse(data);
        console.log(datos[0].cedula);
        console.log(datos[0].email);
    }
});

And now the correct value of the ballot and Mail should appear in the console.

 6
Author: Alvaro Montoro, 2016-03-01 20:50:35

Despite already having the solution, I give you a recommendation (happy face).

The following code contains an AJAX call to the URL you want and the solution I put to you @Alvaro Montoro. To improve the practice of your request, I recommend that you add only 2 lines in your code and delete 1.

The first line to add will be in Js, because you will tell jQuery what type of content you expect (in this case JSON) so you avoid parsing the data because you receive it as such (in JSON).

Solution

$.ajax({
    type: 'POST',
    dataType: 'json',
    data: { 'cedula': $('#destinatario').val() },
    url: "<?php echo site_url(); ?>/roles/obtenercorreo", 
    success : function(data) {
        console.log(data[0].cedula);
        console.log(data[0].email);
    }
});

The second line is on the server side, what it does is return in the request the content type containing the response (JSON).

header('Content-Type: application/json');
echo json_encode($data);

Thanks to this type of practice, you can detect errors such as when the server does not respond to a JSON to handle it in a different way, which in that case, the function error of the AJAX would be activated.

 5
Author: Chofoteddy, 2016-03-03 18:47:09

You can save a line like this:

success : function(data) {
        console.log(data.cedula);
        console.log(data.email);
    }
 1
Author: Josh_zarate, 2016-03-01 22:33:50