Answers

• zajc Posts: 67Questions: 10Answers: 2

  June 2021

  If I changed the order of columns where data:null column is not the first column, it works OK.

          var table = $('#measuring-points-table').DataTable({
              processing: true,
              serverSide: true,
              responsive: true,
              stateSave: true,
              select: true,
              dom: 'Bfrtip',
              ajax: {
                  url: '/measuring-points/datatable',
                  type: 'post'
              },
              columns: [{
                  data: 'measuring_points.id',
                  name: 'measuring_points.id',
                  visible: false
              }, {
                  className: 'details-control',
                  orderable: false,
                  data: null,
                  defaultContent: '',
                  width: '10px'
              }, {
                  data: 'locations.name',
                  name: 'locations.name'
              }, {
                  data: 'devices.name',
                  name: 'devices.name'
              }, {
                  data: 'measuring_points.notes',
                  name: 'measuring_points.notes'
              }, {
                  data: 'measuring_points.created_at',
                  name: 'measuring_points.created_at',
                  visible: false
              }, {
                  data: 'measuring_points.updated_at',
                  name: 'measuring_points.updated_at',
                  visible: false
              }],
              buttons: [{
                  extend: 'create',
                  editor: editor
              }, {
                  extend: 'edit',
                  editor: editor
              }, {
                  extend: 'remove',
                  editor: editor
              }, {
                  extend: 'colvis',
                  text: 'Colums',
                  columns: ':gt(0)'
              }, {
                  extend: 'collection',
                  text: 'Export',
                  buttons: ['csv', {
                      extend: 'print',
                      exportOptions: {
                          columns: ':visible'
                      }
                  }]
              }]
          });
  
• zajc Posts: 67Questions: 10Answers: 2

  June 2021 edited June 2021

  For workaround i've created additional hidden column which is not data:null

  <table class="table table-striped table-bordered" id="measuring-points-table">
      <thead>
          <tr>
              <th></th>//<---------
              <th></th>
              <th>ID</th>
              <th>Location</th>
              <th>Device</th>
              <th>Notes</th>
              <th>Created At</th>
              <th>Updated At</th>
          </tr>
      </thead>
  </table>
  

  I've repeated data: 'measuring_points.id column.

     columns: [{
                      data: 'measuring_points.id', //<---------
                      name: 'measuring_points.id',
                      visible: false
                  }, {
                      className: 'details-control',
                      orderable: false,
                      data: null,
                      defaultContent: '',
                      width: '10px'
                  }, {
                      data: 'measuring_points.id',
                      name: 'measuring_points.id'
                  }
  
• colin Posts: 15,240Questions: 1Answers: 2,599

  June 2021

  Odd, it should work - see here: http://live.datatables.net/kacitilu/1/edit (note the editing won't work - it's just to demonstrate the empty column). There it has a similar setup as yours, with the extra column at the start.

  Could you look at that, please, and see if it helps. If it's still not working for you, please can you update my example, or link to your page, so that we can see the problem.

  Cheers,

  Colin
• kthorngren Posts: 21,337Questions: 26Answers: 4,954

  June 2021 edited June 2021

  I think the error as to do with the ordering of the table. By default the order is set to column 0 which has your data: null. Your server side script is trying to sort by this column. Try using order to order the table by one of your data columns.

  EDIT: If this works you may want to set columns.orderable false for this column.

  Kevin
• zajc Posts: 67Questions: 10Answers: 2

  June 2021 edited June 2021

  If I set order: [[ 1, 'asc' ]], and set stateSave: false it works. It doesn't work if it is set to stateSave: true. I don't know why stateSave affects order.

  As @kthorngren wrote, now I also think the problem is default order by column 0 which is in my case null. I cannot debug what kind of SQL statement is because all I get is

  {
     "fieldErrors":[
  
     ],
     "error":"Unknown field:  (index 0)",
     "data":[
  
     ],
     "ipOpts":[
  
     ],
     "cancelled":[
  
     ],
     "debug":[
  
     ]
  }
  

  @colin your example is not dealing with the real database (in my case MySQL) but only text dataset, so there is no SELECT statement involved.
• kthorngren Posts: 21,337Questions: 26Answers: 4,954

  June 2021

  The stateSave option affects the order because the order is saved. Sounds like it is loading the order saved when the order was set to column 0. To get around that I would try enabling the deferLoading option to stop the first request to the server with stateSave enabled. Now the saved state should be with the column ordering you defined with order. Remove the deferLoading option and reload the page.

  If you wanted you can use one of the SSP JS BIN templates found here. You can change Colin's example to use one of the SSP URLs and enable server side processing.

  Kevin
• zajc Posts: 67Questions: 10Answers: 2

  June 2021

  My newest workaround now is to use known column instead data:null and than render values to null.

            {
                  className: 'details-control',
                  orderable: false,
                  data: 'measuring_points.id',
                  defaultContent: '',
                  width: '10px',
                  render: function() {
                      return null;
                  }
              }
  

  This works fine. It is not logical, but it is working as I expected and I can continue to work.

  If I will find some time I am going to create an example with SSP.
• kthorngren Posts: 21,337Questions: 26Answers: 4,954

  June 2021

  Actually probably the only thing you need to do is sort the table by another column and reload the page. It should save the state with the column you just sorted. You can use stateSaveParams or stateLoadParams to remove the column sorting if you want the page to always sort by what you define with order.

  Kevin