Trying to code SPA using Rails as the backend gives JSON::ParserError - 795: unexpected token

R_G

Live non-working sample from examples here

Under ajax.data, I am trying to use extend to inject data into the parameters but it's not working. I've tried many formats and I receive the same error every time. I've tried various forms of encoding the data and none have changed the result.

The table allows me to multi-select many rows which have been collected into array rows_active. I convert that to object active as well in an attempt to inject the data. In this example, I've simply tried to hard code the data into the data function to see what it takes to pass it.

I don't think it makes any difference, but the table is created dynamically on the page using SPA concepts. The first table is a list of lots, and that makes up the table "Rows" here. This table takes those lots, Row 29 & 64, sends them to Rails and Rails is supposed to respond with the lot's rows to display. I destroy'd and remove'd the lot table, appended this table, and initialized it using:

        movesindexlotstable.destroy();  
        $('#tablebuttons').remove();
        $('#movesindexlotstable').remove();
        // Get the HTML and install it on movesanchor
        $.post('/moves_indexrowshtml.html',
            {}, /* Function should render html, wait for it, and instantiate Datatables to process that html. */
            function (ir_html, status) {
              $('#movesanchor').html(ir_html);
              init_movesindexrowstable();
              new $.fn.dataTable.Responsive(movesindexrowstable);
            }
        );

In any case, my question is what does it take to extend the ajax.data field to inject additional fields into it? Is what I am doing here correct? If so, I'd suppose the problem is my interface to Rails. So, answering this question helps me isolate the problem. Thanks for all your help!

      if (!$.fn.DataTable.isDataTable('#movesindexrowstable')) {
        function init_movesindexrowstable() {
          var rows_active = [];      // new Array
          var active = {};           // new Object
          // Create key/value pairs in params Object
          lots_active.forEach(function (row) {
            active[row] = row;
          });
          var movesindexrowstable = $('#movesindexrowstable').DataTable(
              {
                responsive: true,
                autoWidth: false,
                pagingType: 'full',
                jQueryUI: false,
                processing: true,
                serverSide: true,
                ajax: {
                  url: 'moves_indexrowsjson.json',
                  type: 'POST',
                  contentType: 'application/json',
                  dataType: 'json',
                  data: function ( d ) {
                    return $.extend( {}, d, {"Row_29": "Row_29", "Row_64": "Row_64"} )}
                },
                columns: [
                  {"data": "name", className: null}
                ],
                rowCallback: function (row, data) {
                  if ($.inArray(data.DT_RowId, rows_active) !== -1) {
                    $(row).addClass('active');
                  }
                }
              }
          );
        }
      }
      $('#movesindexrowstable tbody').on('click', 'tr', function () {
        var id = this.id;
        var index = $.inArray(id, rows_active);
        if (index === -1) {
          rows_active.push(id);
        } else {
          rows_active.splice(index, 1);
        }
        $(this).toggleClass('active');
      });

R_G

Okay, I think I found it. Allan, could you please validate this for me, as it could require a change in your examples if I am correct or perhaps it's Rails only? I am changing the data parameter layout as follows, though my working result will use variables of course. The difference is the addition of the JSON.stringify. I had coded the new variables that way, but not the entire extend until now.

                  data: function (d) {
                    return JSON.stringify( $.extend({}, d, {lots: {Row_29: 'Row_29', Row_64: 'Row_64'}}) )
                  }

I was using the extend function as shown in this DataTables example page.

Thanks.

allan

That's perfectly valid if your server-side process expects a JSON string in the request body.

Allan