Answers

• spectreDa Posts: 7Questions: 2Answers: 0

  March 2020 edited March 2020

  json.keys = true;

  json.order= [[2, 'asc']],
  json.rowGroup= {
  // Uses the 'row group' plugin
  dataSrc: 1,
  startRender: function (rows, group) {
  var collapsed = !!collapsedGroups[group.group_display];
  console.log(collapsed)
  rows.nodes().each( (r) => {
  console.log(r)
  r.style.display = collapsed ? 'none' : '';
  });
  console.log(rows, "rows")
  // Add category name to the <tr>. NOTE: Hardcoded colspan
  return $('<tr/>')
  .append(<td colspan="1" style="background-color: #0000">${group.group_display} </td>)
  .append( '<td style="background-color: #0000">'+group.quantity+'</td>' )
  .append( '<td style="background-color: #0000"></td>' )
  .append( <td style="background-color: #0000">${group.single_quantity}</td> )
  .append( '<td style="background-color: #0000"></td>' )

          .attr('data-name', group.group_display)
          .toggleClass('collapsed', collapsed);
  }
  

  }
  json.data = datatable.data;
  json.myColumnFormats = datatable.columns;
  json.colReorder = true;
  json.rowReorder= true;
  json.lengthMenu = [20];

  json.select = true;
  json.reorder = {
  dataSrc: "Part_Reference"
  };

  json.createdRow = (row, data) => {
  console.log(row);

  if (data[1].display === "+") {
    console.log(data[1]);
  }
  

  };
  json.columnDefs = [

    { "visible": false, "targets": 2 }
  

  ];
  json. order= [[2, 'asc']],

  json.columns = cols;

  json.columnDefs = columnDefs;

  json.dom = "<f<t>ip>";

  his.mainTable = $("#littleplace" + this.name + "_" + this._uid).DataTable(
  json
  );

  this.mainTable.columns.adjust().draw();
• kthorngren Posts: 21,330Questions: 26Answers: 4,951

  March 2020 Answer ✓

  Unfortunately there isn't enough information to understand how you are handling the Ajax sourced data. Please post a link to your page or a test case showing the issue. This way we can help debug your code.
  https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

  Kevin
• spectreDa Posts: 7Questions: 2Answers: 0

  March 2020 edited March 2020

  I made mistake clicked by answered button. Question is not resolved.

  Ok there is a jsbin example https://jsbin.com/tulixakive/edit?html,css,js,output
• kthorngren Posts: 21,330Questions: 26Answers: 4,951

  March 2020 Answer ✓

  Wow, thats a lot of code for just 4 rows

  Took a bit to figure out your code but found one way to make it work. The data for the option rowGroup.dataSrc column is an object which you are using columns.render to render the orthogonal data. Using dataSrc: 1 will actually return the object for that cell. I changed it to use a function as suggested in the rowGroup.dataSrc comments.

  The other change I made was to the line:
  .append(<td colspan="1" style="background-color: #0000">${group} </td>)

  Changed it from group.group_display to just group. Looks like you need to fix the rest of the return statement.

  Here is the updated example:
  https://jsbin.com/hetiyaqufi/1/edit?js,output

  Kevin
• spectreDa Posts: 7Questions: 2Answers: 0

  March 2020 edited March 2020

  Thanks kthorngren it's a
  prefect solution of my problem ;-)