Ajax response how to access

Question

I got this response from ajax

{
  "laborCostIndex":0.0,
  "laborDailyWage":0.0,
  "laborHourlyWage":0.0,
  "laborMonthlyWage":0.0,
  "laborLeave":0.0,
  "laborBonus":0.0,
  "laborSSS":0.0,
  "laborPagIbig":0.0,
  "laborPhilHealth":0.0,
  "laborEMP":0.0,
  "laborTotalMonthlyRate":110.0,
  "laborTotalDailyRate":4.230769230769231,
  "laborTotalHourlyRate":0.5288461538461539
}

I'm trying to access the element inside through this:

response.laborCostIndex and response['laborCostIndex'] but seems doesn't work for me.

The ajax is from the xeditable here is the code:

UPDATE: posted the whole ajax

$('.laborCostIndex').editable({
    pk: '1',
    name: 'laborCostIndex',
    url: '../BTool/edit_laborCostIndex.do',
    validate: function( value ) {
        if($.trim( value ) == '') {
            return 'This field is required';
        } else if( isNaN( value ) ) {
                return 'Only accepts numbers';
        }
    },
    params: function(params) {
        var basicDailyWage = $(this).closest('td').next('td').find('a').text();
        var pagIbig = $(this).closest('tr').find(':nth-child(11)').find('a').text();
        var emp = $(this).closest('tr').find(':nth-child(13)').find('a').text();
        var datas = new Array(basicDailyWage, pagIbig, emp);

        params.pk = datas;
        return params;
    }, 
    success: function(response, newValue) {
        console.log( response );
        console.log( response.laborCostIndex );
        console.log( response['laborCostIndex'] );
    } 
});

Both results to undefined, I don't know why.

Answer 1

Try this in your success function

 var obj = JSON.parse(response);
 console.log( obj.laborCostIndex);