Uncaught TypeError: this.replace is not a function

Uncaught TypeError: this.replace is not a function

smp6715smp6715 Posts: 4Questions: 1Answers: 0

I have a basic datatable that I am trying to get working with server-side processing but when I try to do so I get the error "Uncaught TypeError: this.replace is not a function".

When I do everything client-side, the table populates properly with all the data I expect, so I'm a bit stumped. I'm assuming that something isn't the proper data type when building the AJAX but I can't for the life of me figure out what (hoping it's blatant ignorance on my part).

My datatable looks like this:

$("#units").DataTable( {
        "serverSide": true,
        "processing": true,
        "sPaginationType": "listbox",
        "ajax": { 
          "url": "UnitDetails_DataTable_SSP.jsp", 
          "data": ls_data,
          "type": "POST"
        },
        columns: [          
          { title: "Unit Type" },
      { title: "User Assigned Unit" },
      { title: "Floor" },
      { title: "Num Stories" },
      { title: "Unit Name" },
      { title: "Owner Occupied" },
      { title: "Unit Qualifier" },
      { title: "Unit Number" },
      { title: "Unit Status" },
      { title: "Sq. Ft." },
      { title: "Location" },
      { title: "Location Desc" },
      { title: "COO Date" },
      { title: "Lead-free Proof" },
      { title: "Lead-free Date" },
      { title: "Delete"},
      { title: "Row" }
        ]
} );

The full error from the console is this:

Uncaught TypeError: this.replace is not a function
    at String.addslashes (common.js:136)
    at e (jquery-1.12.4.min.js:4)
    at dc (jquery-1.12.4.min.js:4)
    at Function.n.param (jquery-1.12.4.min.js:4)
    at Function.ajax (jquery-1.12.4.min.js:4)
    at _fnBuildAjax (jquery.dataTables.js:3948)
    at _fnAjaxUpdate (jquery.dataTables.js:3968)
    at _fnDraw (jquery.dataTables.js:3431)
    at _fnReDraw (jquery.dataTables.js:3550)
    at _fnInitialise (jquery.dataTables.js:4732)

Thanks!

Answers

  • colincolin Posts: 15,142Questions: 1Answers: 2,586

    Hi @smp6715 ,

    This looks a lot like this thread.

    One thing, this here looks invalid: "sPaginationType": "listbox", it's not a valid initialisation setting.

    Could you post a snippet of your Json responses - that might be useful. Likewise, running the debugger.

    Cheers,

    Colin

  • smp6715smp6715 Posts: 4Questions: 1Answers: 0

    Thanks for the quick reply, I tried getting rid of the pagination type and still had the issue, but was able to get some insight with the response.

    Initially, I wasn't seeing a response, only the error, but then I changed the Show -x- Entries from 10 to 25, and that triggered the response, which subsequently led me to see the return from my jsp was total garbage :( and I definitely need to rework that.

    Any idea on why I wouldn't see the response on the initial load? None of my debug statements were logged on the server side either, until I changed the dropdown.

    Just FYI I added the error/success to the AJAX to see this in the console:

    $("#units").DataTable( {
            "serverSide": true,
            "processing": true,
            "sPaginationType": "listbox",
            "ajax": {
              "url": "UnitDetails_DataTable_SSP.jsp",
              "data": ls_data,
              "type": "POST",
              error: function(d) {
                  console.log(d);
               },
               success: function(d) {
                 console.log(d);
               }
            },
            columns: [         
              { title: "Unit Type" },
          { title: "User Assigned Unit" },
          { title: "Floor" },
          { title: "Num Stories" },
          { title: "Unit Name" },
          { title: "Owner Occupied" },
          { title: "Unit Qualifier" },
          { title: "Unit Number" },
          { title: "Unit Status" },
          { title: "Sq. Ft." },
          { title: "Location" },
          { title: "Location Desc" },
          { title: "COO Date" },
          { title: "Lead-free Proof" },
          { title: "Lead-free Date" },
          { title: "Delete"},
          { title: "Row" }
            ]
    } );
    
  • kthorngrenkthorngren Posts: 20,269Questions: 26Answers: 4,765

    I remember reading in the past that Allan has suggested not using the success function within the Datatables -option ajaxoption as he expects it to pass through to jQuery's ajax. You can use-option ajax.dataSrc` instead. It provides an option for a function.

    As for troubleshooting if you could provide the [debugger](http://debug.datatables.net/ info Colin asked for. This will show what the JSON response is.

    Also instead of the console.log output you can use the steps outlined in this technote to see what the response is form the server:
    https://datatables.net/manual/tech-notes/1

    Kevin

  • smp6715smp6715 Posts: 4Questions: 1Answers: 0

    Thanks Kevin, that's good info to have, still pretty new to the API, so good to have some suggested reading (I tend to get distracted far too easily). I'll try again with the debugger when I get back to work.

  • smp6715smp6715 Posts: 4Questions: 1Answers: 0

    I was able to fix the problem...it all stemmed from the data that I was sending in the AJAX. The ls_data that I had populated was in the incorrect format, I was using x=y for that and when I switched to the proper { "x": "y" } the this.replace error went away.

    I cleaned up my jsp file and the table is populating as expected! :)

This discussion has been closed.