Column sorting requires 2 clicks

knuxyl

(I'm using the sample code from the site)
On loading a webpage, I can click the first column and it will sort, and after that, all the other column sorting works.
But if I load the webpage and click on column 2+ first, it doesn't sort until I click it again.
It was working yesterday, but today it's not working.
I just tested it again and the problem is more complex, it's hard to determine the exact behavior, some columns won't sort on first click even after sorting the first column if data 1 is at the top.
I'm not using any themes atm to test where this problem is coming from, and it wasn't the theme. I am literally using the sample code provided from the website.
I have a more complex site experiencing this same problem, so I created a test page with only the sample code and the problem is coming from the library, not my code.
Is anyone else experiencing this?

tangerine

I created a test page with only the sample code

Providing a link to your test page would be helpful.

knuxyl

I thought I was using the sample code on this site, I wasn't. I don't know where I got it. I tried the sample here and it's working fine. The only difference I could tell was that I didn't include a footer

knuxyl

I figured out what was causing the problem finally.
When there are only 2 <tr> rows, it requires 2 clicks to sort. When there is more than 2, it sorts just fine. Anybody have a solution?

Here is example page
https://pastebin.com/8wF3Snqw

Remove one of the <tr> sections and you will have the problem I'm talking about.

BTW I'm using JQuery UI Tabs also. I tested without UI Tabs and it was still doing the same thing.

I'm using the datatables for a SQL query so sometimes it will only have 2 results.

tangerine

Your table is not valid HTML.

 <thead>
            <tr>
        <th>icon</th>
            <th>Name</th>
            <th>Ilvl</th>
            <th>Req</th>
            <th>Side</th>
            <th>Slot</th>
        <th>Source</td>                       <<< Wrong
        <td>Type</td>                         <<< Wrong
            </tr>
        </thead>

knuxyl

Yeah I found those typos, but the problem was the tables were already organized when I went to click them. I guess I don't have the plugin for seeing the arrows on which way it's sorted so I didn't notice that was a problem.
Regarding the invalid table, for some reason it was still working correctly regardless of the typos

bindrid

Sounds like you are missing the css files that show the arrows