Topic: Disable / Remove sorting on mdbTable for a specific column

MDWebservices priority asked 5 years ago


Hi,

I haven't been able to find any information, within this site and documentation and elsewhere on Google, for this specific request/issue.

I am using an Angular Bootstrap DataTable and I would like to remove the sorting functionality from a specific column. I've seen examples of this within the forums for Jquery but not for Angular. I've found examples of this also on google, but not for Angular.

Is this possible?

If you need more info, please let me know.

Cheers,


Bartosz Termena staff answered 5 years ago


Dear @MDWebservices

To remove the sorting functionality from a specific column, try this:

<table id="tableSortExample" mdbTable class="z-depth-1">
  <thead>
    <tr>
      <th
        *ngFor="let head of headElements; let i = index"
        aria-controls="tableSortExample"
        scope="col"
      >
        <a *ngIf="head !== 'first'" [mdbTableSort]="elements" [sortBy]="headElements[i]"
          >{{ head | titlecase }}
        </a>
        <a style="cursor: default" *ngIf="head === 'first'"> {{ head | titlecase }}</a>
        <mdb-icon fas icon="sort" *ngIf="head !== 'first'"></mdb-icon>
      </th>
    </tr>
  </thead>
  <tbody>
    <tr *ngFor="let el of elements; let i = index">
      <th scope="row">{{ el.id }}</th>
      <td>{{ el.first }}</td>
      <td>{{ el.last }}</td>
      <td>{{ el.handle }}</td>
    </tr>
  </tbody>
</table>

TS

 elements: any = [];
  headElements = ['id', 'first', 'last', 'handle'];

  ngOnInit() {
    for (let i = 1; i <= 15; i++) {
      this.elements.push({ id: i, first: 'User ' + i, last: 'Name ' + i, handle: 'Handle ' + i });
    }
  }

In my example I removed sorting by 'first'.

Hope it helps!

Best Regards, Bartosz.


MDWebservices priority answered 5 years ago


Thank you, Bartosz,

Very similar to something we attempted and this seemed to work better!

Cheers,


MDWebservices priority answered 5 years ago


Just gonna bump this...

... Is this something that has never been considered and not possible?



Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Resolved

Specification of the issue

  • ForumUser: Priority
  • Premium support: Yes
  • Technology: MDB Angular
  • MDB Version: 8.6.0
  • Device: PC
  • Browser: Chrome
  • OS: Windows
  • Provided sample code: No
  • Provided link: No