Datatables returning formatted json data with javascript functions

Question

Using Datatables with a .json source file, I am trying to manipulate the data before it shows in the table. I'm trying to simply remove spaces and replace with a dash in this example.

There are two ways I understand to do some data manipulation. One is columnDefs the other is using dataSrc and return the data. Both fail when i try to utilize .split or .replace or even .toLowerCase()...

For example, I have columnDefs added like so:

 columnDefs: [
            {
                "render": function ( data, type, row ) {
                  console.log(data);
                  var cn = data.split(" ").join("-").toLowerCase();
                  return cn;
                },
                "targets": 1
            }
        ],

The console shows:

Uncaught TypeError: data.split is not a function

How do we manipulate the data with replace or the like?

My data looks like:

{
    "Licensee": "Whistles for Woods",
    "Contact Name": "Bob",
    "Street": "2230 Trail",
    "Suite / PO Box": 0,
    "City": "Alturas",
    "ST": "CA",
    "Zip Code": 997733,
    "Telephone": 0,
    "Email Address": "[email protected]",
    "Website Address": "www.domain.com",
    "Fax": "No fax",
    "Products": "whistle with custom logo",
    "Categories": "Miscellaneous"
  },

How is your data formatted? If the data value is not a string or an array than it wont have the functions you mentioned. You will likely have to perform more in depth data manipulation to achieve what you want. — Michael Sorensen
– Michael Sorensen, Commented May 23, 2019 at 16:29
@MichaelSorensen thanks for the comment. I added it in there. It is a string. — jasonflaherty
– jasonflaherty, Commented May 23, 2019 at 16:32
ah... you made me think there! Trying console.log(typeof data) told me most of the items are string, however, there was a number in there... I made data.toString() and now I'm able to manipulate it... I didn't think that would be necessary, however, this is a good check for sure since this isn't clean data always... — jasonflaherty
– jasonflaherty, Commented May 23, 2019 at 16:43
Nice! I was just about to suggest that lol. In that case I would just make an if statement like if(typeof data === 'string'){ //do split and join } and continue on with my day :) — Michael Sorensen
– Michael Sorensen, Commented May 23, 2019 at 16:46

Michael Sorensen · Accepted Answer · 2019-05-23 16:51:10Z

1

As discussed in the comments

We just want to make sure that we are indeed manipulating strings and not any other data type. So in this case we would change the code to look something like this:

 columnDefs: [
        {
            "render": function ( data, type, row ) {
              if(typeof data === 'string'){ 
                  //only if string manipulate
                  data = data.split(" ").join("-").toLowerCase();
              }
              // OR data = data.toString(); whichever is more convenient!
              return data;
            },
            "targets": 1
        }
    ],

answered May 23, 2019 at 16:51

Michael Sorensen

2,14418 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Datatables returning formatted json data with javascript functions

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related