Sorting two columns simultaneously in datatables: A step-by-step guide

I need help sorting a table with the following data. I want to arrange column A in ascending order and column B in descending order.

A    B    C
1    4    string1 
2    11   string2 
1    13   string3
2    43   string4

My goal is to sort by both columns A (ascending) and B (descending) simultaneously, resulting in this arrangement:

A    B    C
1    13   string3
1    4    string1 
2    43   string4
2    11   string2

Currently, I am only able to sort one column using the code below:

oTable.api().columns( ['.acol'] ).order("asc").draw();

Answer №1

Referencing the content found in the documentation:

If needed, you have the ability to define multiple columns within the order command. In your situation:

datatableApi.columns( ['.firstCol', '.secondCol'] )
            .order([ [ '.firstCol', 'asc' ], [ '.secondCol', 'desc' ] ])
            .draw();

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Tips for making sure a function is complete before proceeding with a new question using the Inquirer package

Currently, I have a setup where I'm looping inquirer like so: function start() { let stop = 0; const askQuestion = () => { inquirer .prompt([ { type: "list", name: "action", m ...

The keyboard event is expected to trigger once the text box has been filled

Currently, I am working on keyboard events using jQuery. Within my project, I have implemented two text boxes that are used for entering a first name and last name respectively. My goal is to trigger an alert displaying both the first and last names once t ...

Troubleshooting Bootstrap bug caused by rollupPluginBabelHelpers

I am currently working on a Bootstrap 4 website. I noticed that in Internet Explorer, the modal works fine when opened for the first time, but then displays an error in the console and does not open when trying to do so a second time on the same window. On ...

Avoid sudden page movements when validating user input

After successfully implementing the "Stars rating" feature from https://codepen.io/462960/pen/WZXEWd, I noticed that the page abruptly jumps up after each click. Determined to find a solution, I attempted the following: const labels = document.querySelect ...

how to protect your javascript and php code

I have a question about "injection", specifically javascript injection which I find confusing. Suppose I have a javascript function that sends an AJAX request to get a user's permission level, and then uses an if statement to assign power based on th ...

Jquery unable to change the css property 'background-image'

I'm currently working on creating a photo viewer for my website by cycling through an array of pictures. The cycling aspect is functioning properly, but I am encountering difficulties when trying to transfer the message to the CSS. I'm not sure i ...

Trigger an outer iframe to navigate from a deeply buried child iframe

Seeking assistance with reloading an iframe nested within two additional iframes. I have attempted using parent.document and Response.Redirect, however, neither are achieving the desired result. When utilizing Response.Redirect (URL), it reloads iframe 1 ...

Storing an image or video file to the disk of a NodeJS server and creating a reference in MongoDB

Seeking advice on the optimal method to store an image or video file on a NodeJS server and link it to MongoDB. Additionally, I need to enable streaming for the videos. Any recommendations would be greatly appreciated. Thank you! ...

Having trouble accessing states in Redux using React Hooks, encountering an issue where property '_id' cannot be read from null

I'm currently working on a MERN web app and delving into React Hooks. My main goal right now is to access the states in my Redux store. However, when I refresh the page, I encounter this error message: TypeError: Cannot read property '_id&apos ...

inept java script circle

Each image in the array is superimposed on one another to form the final picture. However, a problem arises when all the images are loaded - the loop continues to run making it extremely difficult to scroll or execute any other animations. function map( ...

Monitoring the modifications of a linked component in React: A guide

I am facing an issue where I need to store the text of a referenced element in an array. My goal is to first display the text of each paragraph element with the "ebookName" class in the console before storing it in the array. However, I have encountered a ...

The call signatures for `node-fetch -- typeof import("[...]/node-fetch/index")'` are not properly defined

Originated from this source: https://github.com/node-fetch/node-fetch#json ... my personal code: const fetch = require('node-fetch'); async function doFetch() { const response = await fetch('https://api.github.com/users/github'); ...

Tips for effectively recycling the describe sections in mocha test cases

My app has different modes, each with its own loading times and configurations. One particular mode has a long loading period every time a page is opened which is causing some testing challenges. Currently, I have separate test files for each section of th ...

What is the best method to restrict the size of a div to match the dimensions of the

In my webpage, I have a menubar (div) that contains bookmarks. However, when too many bookmarks are added, the menu becomes too wide for the page size I prefer (1280, 720) and becomes scrollable, causing some bookmarks to be out of view. My goal is to ens ...

Modifying `msg.sender` in Solidity and Ether.js

I have a Smart Contract written in Solidity. Within this contract, there is a function called makeMarketItem. function makeMarketItem( address nftContract, uint256 tokenId, uint256 price ) public payable nonReentrant { IERC721(nftContract). ...

Begin the jQuery datepicker with a future starting date

I recently integrated a jQuery date picker on my website but I'm encountering an issue. I want to restrict users from selecting a date before 1st June 2014, however, the calendar seems to be changing every day. The date picker has been live for 9 days ...

Bootstrap Popover: A Stylish Way to Display

I am looking to enhance my bootstrap template by incorporating a set of terms and conditions with a user-friendly popover feature for key terms. Although I have correctly linked all the necessary CDN files, I encounter an issue where the pop-up works when ...

Enhancing arrow cone spin with ThreeJs

My arrow function is supposed to connect pick and place points using QuadraticBezierCurve3 and ConeGeometry, but the rotation of the cone doesn't align perfectly with the curve as shown in the snippet below! I'm seeking advice on how I can enhan ...

Enhance your website with a dynamic jQuery gallery featuring stunning zoom-in

I am currently working on a mobile website project and I'm in need of a gallery feature that allows users to zoom in on images and swipe through them using touch gestures. After some research, I haven't been able to find a suitable solution in j ...

I am having trouble with retrieving and showing Json data in a table using axios within a React component

Struggling to access JSON data using hooks to display it in the <p> tag but encountering an error - "TypeError: states.map is not a function". I attempted utilizing Array.from() to convert my JSON to an array, yet it neither displayed anything nor pr ...