Disable "Unsorted" State for Column

[ttosi]

Is there a straightforward way to disable the "unsorted" state for any given column (or for all the columns in the table)? So, to be clear as possible, when I initialize the table for the first time, I add a default sorts to a column and set it ascending. When I click on the column header it sorts descending. When I click on the column the second time it removes the sort entirely. I would like to just be able to sort ascending/descending with no "off" state.

[JangoSteve]

There's no way to do this currently. I'll leave this open as a new-feature request.

[ttosi]

Thank you!

[Oxicode]

+1

[LewisSmallwood]

As the sort functionality changes the GET parameters, I've written this hack to toggle the ordering back to a "default" sort mode. This is indicated by the id "default" on the th. To order DESC, call click() twice.

I'm assuming a loop could be added to find all the columns to make this dynamic, though not sure how...

<table id="example-table">
  <thead>
    <tr>
      <th id="default">Column One</th>
      <th>Column Two</th>
      <th>Column Three</th>
    </tr>
  </thead>
  <tbody>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
        </tr>
  </tbody>
</table>

<script type="text/javascript">
  $(document).ready( function() {
      $('#example-table').dynatable().bind('dynatable:afterUpdate', completedSort);
  });

  // After a dynatable sort has occured:
  function completedSort(e) {
      // Wait for the GET parameters to update.
      setTimeout(function() {
          var url = new URL(window.location.href);
          var columnOne = url.searchParams.get("sorts[columnOne]");
          var columnTwo = url.searchParams.get("sorts[columnTwo]");
          var columnThree = url.searchParams.get("sorts[columnThree]");

          // If all the columns are null (no filter), then sort the table by the "#default" th.
          if (columnOne == null && columnTwo == null && columnThree == null) {
              $("#default").children('a')[0].click();
          }
      }, 100);
  }
</script>