API in javascript is returning data, but is not being saved into an array


I am trying to fetch data from an API of WordPress. Here is my code:

column.data().unique().sort().each(function (d,j) {
    var practiceArea = d.practice_area;
    var jsonPacticeArea = JSON.stringify(practiceArea);
    if (jsonPacticeArea !== undefined) {
        var res = $.map(jsonPacticeArea.split("|"), $.trim);
        for (var i = 0; i < res.length; i++) {
             var str = res[i];
             str = str.replace(/"/gi, '').trim();
             if (arrayPracticeArea.indexOf(str) === -1) {

the “column” is the variable that is getting data through an API, and as far as I do console.log(column. data().unique().sort()), that’s returning complete data as you can see in the screenshot:

[![enter image description here][1]][1]

and I want to fetch data is marked in red rectangle and store those values in an array, but as soon as I try to add “each” function to fetch the data and store it in an array (in my case its arrayPracticeArea) its returning undefined values.

Can anyone please help me out? I am just not much experienced with Javascript API.

Here is my AJAX code:

var tableAttorney = $('#table_affliate_attorney').DataTable({
                    destroy: true,
                    searching: true,
                    bLengthChange: false,
                    scrollX: true,
                    scrollY: 440,
                    autoWidth: false,
                    "language": {
                        "emptyTable": "We are sorry but there are no Affiliate Attorneys within a 150 mile radius of your requested search"
                    ajax: {
                        type: 'get',
                        url: "/wp-admin/admin-ajax.php",
                        dataType: 'json',
                        cache: false,
                        data: {
                            'action': 'get_attorney_ajax',
                            'center_lat': center_lat,
                            'center_long': center_long,
                            'state': state,
                            'city': city,
                            'zip': zip
                    columns: [
                        {"data": "title"},
                        {"data": "city"},
                        {"data": "state"},
                        {"data": "zip"},
                        {"data": "distance"},
                            "data": "phone",
                            className: 'datatablePhone',
                            render: function (data) {
                                return '<a href="tel:' + data + '">' + data + '</a>';
                            "data": "email",
                            className: 'px190EM',
                            render: function (data) {
                                return '<a href="mailto:' + data + '">' + data + '</a>';
                            className: 'js-practice-area',
                            "data": "practice_area"
                            "targets": -1,
                            "data": 'email',
                            render: function (data) {
                                return "<a class="contact-lawyer" href="#" data-toggle="modal" data-target="#exampleModal" data-whatever="@mdo" data-email=""+data+"">Contact</a>";
                    columnDefs: [
                        {"width": "150px", "targets": [0]},
                        {"width": "130px", "targets": [5]}

So I am trying to fetch data from columns->data that has value practice_area.

Here is the fiddle link where I have hosted my whole JS code: https://jsfiddle.net/fareeboy/apor08jn/1/
[1]: https://i.stack.imgur.com/4EOZS.png

Farhan Ali 3 weeks 2021-09-04T00:27:05-05:00 0 Answers 0 views 0

Leave an answer