RECORDS NOT DISPLAYED IN DESC ORDER FROM MYSQL IN HTML


#1

• The records are not being displayed in the right order all of the rows are in descending order but when displayed in html they are not in descending order I have no idea what is wrong if you look at number 2 it is the second row but it is in row 12 same with 3 and 4 are not in the right Colom’s

• Here is the way the rows and table is defined if someone has any suggestions it would be appreciated
If you need anything else please let me know
Thanks Sam

$batas300$posisi0number1 start2016-05-31 number2 start2016-05-25 number3 start2016-05-20 number4 start2016-05-20 number5 start2016-05-19 number6 start2016-05-18 number7 start2016-05-17 number8 start2016-05-17 number9 start2016-05-16 number10 start2016-05-16 number11 start2016-05-12 number12 start2016-05-11 number13 start2016-05-11 number14 start2016-05-11 number15 start2016-05-10 number16 start2016-05-10 number17 start2016-05-09 number18 start2016-05-09 number19 start2016-05-09 number20 start2016-05-09 number21 start2016-05-09 number22 start2016-05-06 number23 start2016-05-05 number24 start2016-05-04 number25 start2016-05-03 number26 start2016-05-03 number27 start2016-04-29 number28 start2016-04-29 number29 start2016-04-28 number30 start2016-04-28 number31 start2016-04-26

<?php

No Start Status Date
1 May 31 2016 May 18, 2016
10 May 16 2016 May 17, 2016
11 May 12 2016 May 13, 2016
12 May 11 2016 May 12, 2016
13 May 11 2016 May 11, 2016
14 May 11 2016 May 12, 2016
15 May 10 2016 May 11, 2016
16 May 10 2016 May 11, 2016
17 May 09 2016 May 10, 2016
18 May 09 2016 May 10, 2016
19 May 09 2016 May 17, 2016
2 May 25 2016 May 14, 2016
20 May 09 2016 May 10, 2016
21 May 09 2016 May 09, 2016
22 May 06 2016 May 09, 2016
23 May 05 2016 May 09, 2016
24 May 04 2016 May 06, 2016
25 May 03 2016 May 03, 2016
26 May 03 2016 May 04, 2016
27 April 29 2016 April 30, 2016
28 April 29 2016 April 30, 2016
29 April 28 2016 April 29, 2016
3 May 20 2016 May 18, 2016
30 April 28 2016 April 30, 2016
31 April 26 2016 May 06, 2016
4 May 20 2016 May 18, 2016
5 May 19 2016 May 18, 2016
6 May 18 2016 May 19, 2016
7 May 17 2016 May 18, 2016
8 May 17 2016 May 18, 2016
9 May 16 2016 May 17, 2016

No #ID Work Order Status Start Status Date Client Actions

#2

Add the explain table (table structure) and the query used. There is clearly a pattern in the output, seems to be sorted like you’d expect a string to be sorted (28, 29, 3, 30, 31, 4, 5, 6)


#3

I suspect the problem is in those sorting classes. OP, post the CSS for the sort classes.


#4

Here is the query and explain tables I have also included the echo output from the query it is in order thanks for looking at this.

$batas300$posisi0number1start2016-05-31
number2start2016-05-25
number3start2016-05-20
number4start2016-05-20
number5start2016-05-19
number6start2016-05-18
number7start2016-05-17
number8start2016-05-17
number9start2016-05-16
number10start2016-05-16
number11start2016-05-12
number12start2016-05-11
number13start2016-05-11
number14start2016-05-11
number15start2016-05-10
number16start2016-05-10
number17start2016-05-09
number18start2016-05-09
number19start2016-05-09
number20start2016-05-09
number21start2016-05-09
number22start2016-05-06
number23start2016-05-05
number24start2016-05-04
number25start2016-05-03
number26start2016-05-03
number27start2016-04-29
number28start2016-04-29
number29start2016-04-28
number30start2016-04-28
number31start2016-04-26

SELECT tprojects.IdProject, tprojects.ProjectStatus, tprojects.TypeId,
DATE_FORMAT(tprojects.ProjectStart, ‘%Y’) As Year,
DATE_FORMAT(tprojects.ProjectStart, ‘%M’) As Month,
DATE_FORMAT(tprojects.ProjectStart, ‘%d’) As Day,
tprojects.ProjectStart As ProjectStart,
DATE_FORMAT(tprojects.ProjectDeadline,’%M %d, %Y’) AS ProjectDeadline,
tprojects.isArchived, tprojects.archiveDate, twotype.TypeId,
twotype.TypeTitle AS ProjectName, tclients.IdClient,
tclients.FullName AS ClientName, tuser.FullName AS AdminName
FROM tprojects
LEFT JOIN tuser ON tprojects.CreatedUser = tuser.IdUser
LEFT JOIN tclients ON tprojects.IdClient = tclients.IdClient
LEFT JOIN twotype ON tprojects.TypeId = twotype.TypeId
LEFT JOIN projectmember pm ON pm.IdProject = tprojects.IdProject
WHERE tprojects.isArchived = 0
“;
if ($data[‘Level’] > ‘1’) {
$query .= " AND pm.MemberName = ${data[‘IdUser’]}”;
}
$query .= " ORDER BY Year DESC, Month DESC, Day DESC LIMIT $posisi,$batas";
$sql = mysql_query($query);

Tprojects

IdProject int(11) NO PRI NULL auto_increment
IdClient int(11) NO NULL
TypeId int(5) NO NULL
ProjectProgress int(3) NO NULL
ProjectStatus varchar(255) NO NULL
ProjectCurrency int(3) NO NULL
ProjectNotes longtext NO NULL
ProjectStart date NO NULL
ProjectDeadline date NO NULL
LastUpdateDate datetime NO NULL
LastUpdateUser int(11) NO NULL
CreatedDate datetime NO NULL
CreatedUser int(11) NO NULL
isArchived int(3) NO NULL
archiveDate date NO NULL

tclient

Field Type Null Key Default Extra
IdClient int(11) NO PRI NULL auto_increment
FullName varchar(255) NO NULL
Email varchar(255) NO NULL
MailingAddress longtext NO NULL
Phone varchar(200) NO NULL
CellPhone varchar(200) NO NULL
Notes text NO NULL
ProfilePicture varchar(255) NO NULL
IsActive int(1) NO NULL
Tclients
LastUpdateDate datetime NO NULL
LastUpdateUser int(11) NO NULL
CreatedDate datetime NO NULL
CreatedUser int(11) NO NULL
isArchived int(3) NO NULL
archiveDate date NO NULL

Tuser
Field Type Null Key Default Extra
IdUser int(11) NO PRI NULL auto_increment
FullName varchar(100) NO NULL
MailingAddress text NO NULL
Phone varchar(20) NO NULL
CellPhone varchar(20) NO NULL
Email varchar(100) NO NULL
IsActive char(1) NO NULL
Level char(1) NO NULL
Username varchar(32) NO NULL
Password varchar(32) NO NULL
ProfilePicture varchar(255) NO NULL
LastLogin datetime NO NULL
LastUpdateDate datetime NO NULL
LastUpdateUser int(11) NO NULL
CreatedDate datetime NO NULL
CreatedUser int(11) NO NULL

Projectmember

Field Type Null Key Default Extra
IdMember int(3) NO PRI NULL auto_increment
IdProject int(3) NO NULL
IdClient int(3) NO NULL
MemberName int(11) NO NULL
MemberRole varchar(100) NO NULL
LastUpdateDate datetime NO NULL
LastUpdateUser int(11) NO NULL
CreatedDate datetime NO NULL
CreatedUser int(11) NO NULL

Twotype

Field Type Null Key Default Extra
TypeId int(5) NO PRI NULL auto_increment
TypeTitle varchar(255) NO NULL
TypeDesc longtext NO NULL
IsActive int(1) NO NULL
LastUpdateDate datetime NO NULL
LastUpdateUser int(11) NO NULL
CreatedDate datetime NO NULL
CreatedUser int(11) NO NULL


#5

here is the css for the tablesorter

Thanks for looking at this

body {
margin-top: 50px;
}

#wrapper {
padding-left: 0;
}

#page-wrapper {
width: 100%;
padding: 5px 15px;
}

/* Nav Messages */

.messages-dropdown .dropdown-menu .message-preview .avatar,
.messages-dropdown .dropdown-menu .message-preview .name,
.messages-dropdown .dropdown-menu .message-preview .message,
.messages-dropdown .dropdown-menu .message-preview .time {
display: block;
}

.messages-dropdown .dropdown-menu .message-preview .avatar {
float: left;
margin-right: 15px;
}

.messages-dropdown .dropdown-menu .message-preview .name {
font-weight: bold;
}

.messages-dropdown .dropdown-menu .message-preview .message {
font-size: 12px;
}

.messages-dropdown .dropdown-menu .message-preview .time {
font-size: 12px;
}

/* Nav Announcements */

.announcement-heading {
font-size: 50px;
margin: 0;
}

.announcement-text {
margin: 0;
}

/* Table Headers */

table.tablesorter thead {
cursor: pointer;
}

table.tablesorter thead tr th:hover {
background-color: #f5f5f5;
}

/* Flot Chart Containers */

.flot-chart {
display: block;
height: 400px;
}

.flot-chart-content {
width: 100%;
height: 100%;
}

/* Edit Below to Customize Widths > 768px */
@media (min-width:768px) {

/* Wrappers */

#wrapper {
padding-left: 200px;
}

#page-wrapper {
padding: 15px 25px;
}

/* Side Nav */

.side-nav {
margin-left: -225px;
left: 225px;
width: 200px;
position: fixed;
top: 50px;
height: 100%;
border-radius: 0;
border: none;
background-color: #222222;
overflow-y: auto;
}

/* Bootstrap Default Overrides - Customized Dropdowns for the Side Nav */

.side-nav>li.dropdown>ul.dropdown-menu {
position: relative;
min-width: 225px;
margin: 0;
padding: 0;
border: none;
border-radius: 0;
background-color: transparent;
box-shadow: none;
-webkit-box-shadow: none;
}

.side-nav>li.dropdown>ul.dropdown-menu>li>a {
color: #999999;
padding: 15px 15px 15px 25px;
}

.side-nav>li.dropdown>ul.dropdown-menu>li>a:hover,
.side-nav>li.dropdown>ul.dropdown-menu>li>a.active,
.side-nav>li.dropdown>ul.dropdown-menu>li>a:focus {
color: #fff;
background-color: #080808;
}

.side-nav>li>a {
width: 225px;
}

.navbar-inverse .navbar-nav>li>a:hover,
.navbar-inverse .navbar-nav>li>a:focus {
background-color: #080808;
}

/* Nav Messages */

.messages-dropdown .dropdown-menu {
min-width: 300px;
}

.messages-dropdown .dropdown-menu li a {
white-space: normal;
}

}

.aligncenter { text-align: center; }
.alignright { float: right !important; }
.highlight { color: #cc3d3d; }
.completed { background: #f0f0f0; }
.clear { clear: both; }
.marginRight { margin-right: 4px; }
.marginTop { margin-top: 10px; }
.headerright { float: right; padding: 7px 10px 0 0; }
.headerright .dropdown { display: inline-block; margin-left: 7px; }
.divider30 { height: 30px; clear: both; }
.divider20 { height: 20px; clear: both; }
.divider15 { height: 15px; clear: both; }
.divider10 { height: 10px; clear: both; }
.one_half{ width:48.5%; }
.one_third{ width:31.16%; }
.two_third{ width:65.83%; }
.one_fourth{ width:22.5%; }
.three_fourth{ width:74.5%; }
.one_fifth{ width:17.3%; }
.two_fifth{ width:38.1%; }
.three_fifth{ width:58.9%; }
.four_fifth{ width:67.7%; }
.one_sixth{ width:13.83%; }
.five_sixth{ width:83.17%; }
.one_half,.one_third,.two_third,.three_fourth,.one_fourth,.one_fifth,
.two_fifth,.three_fifth,.four_fifth,.one_sixth,.five_sixth{ position:relative; margin-right:3%; float:left; }
.last{ margin-right:0 !important; clear:right; }
.dashicons { list-style: none; margin-bottom: 15px; }
.dashicons li { margin-bottom: 15px; }
.dashicons li a { display: block; border: 1px solid #ccc; background: #fcfcfc; text-align: center; }
.dashicons li a:hover { text-decoration: none; background-color: #fff; }
.dashicons li a span { display: block; padding: 2px; text-transform: uppercase; margin-bottom: 5px; }
.dashicons li a img { margin: 15px auto 5px auto; }
.widgettitle {
color: #999; text-transform: uppercase; text-transform: uppercase; margin-bottom: 15px;
text-shadow: 1px 1px rgba(255,255,255,0.3); border: 1px solid #bbb; position: relative;
}
h4.widgettitle { font-size: 12px; padding: 2px 10px; font-weight: bold; }
h4.ctitle { border: 1px solid; color: #fff; text-shadow: 1px 1px rgba(0,0,0,0.2); }
h3.widgettitle { font-size: 14px; padding: 5px 10px; }
h3.ctitle { border: 1px solid; color: #fff; text-shadow: 1px 1px rgba(0,0,0,0.2); }
.showhide {
font-size: 10px; position: absolute; top: 0; right: 0; padding: 2px 10px; border-left: 1px solid #bbb; color: #999;
text-align: center; min-width: 75px;
}
.showhide:hover { text-decoration: none; color: #777; background: #e7e7e7; }
.widgetcontent { margin-bottom: 30px; position: relative; }
.widgetcontent.bordered { padding: 15px; border: 1px solid #bbb; border-top: 0; background: #fcfcfc; }
.widgetcontent.nopadding { padding: 0; }
.widgetsource { display: none; }
.widgetsource.show { display: block; }
.stdform input { padding: 7px 5px; border: 1px solid #bbb; }
.stdform textarea { padding: 6px 5px; border: 1px solid #bbb; }
.stdform select { border: 1px solid #bbb; padding: 5px 2px; }
.stdform p, .stdform div.par { margin: 20px 0; }
.stdform span.field, .stdform div.field { margin-left: 220px; display: block; position: relative; }
.stdform .formwrapper { display: block; padding-top: 5px; margin-left: 220px; line-height: 25px; }
.stdform label { float: left; width: 200px; text-align: right; padding: 5px 20px 0 0; }
.stdform label.error { float: none; display: block; font-size: 11px; color: #ff0000; text-align: left; padding: 0; width: auto; margin-left: 220px; }
.stdform label.valid { color: #468847; }
.stdform small.desc { font-size: 11px; color: #999; font-style: italic; display: block; margin: 5px 0 0 220px; }
.stdform .stdformbutton { margin-left: 220px; }
.stdform #spinner.input-small { width: 100px; }
.stdform2 p, .stdform2 div.par { border-top: 1px solid #ddd; background: #fcfcfc; margin: 0; clear: both; }
.stdform2 div.terms { border: 0; background: none; }
.stdform2 p:first-child, .stdform2 div.par:first-child { border-top: 0; }
.stdform2 label { display: inline-block; padding: 15px 0 0 15px; vertical-align: top; text-align: left; font-weight: bold; }
.stdform2 label.error { margin-left: 0; padding: 0; }
.stdform2 label small { font-size: 11px; color: #999; display: block; font-weight: normal; line-height: 16px; }
.stdform2 span.field, .stdform2 div.field { margin-left: 220px; display: block; background: #fff; padding: 15px; border-left: 1px solid #ddd; }
.stdform2 .stdformbutton { margin-left: 0; padding: 15px; background: #fff; }
.stdform2 input[type=checkbox], .stdform2 input[type=radio] { margin: 10px; }
.shadowed, .listfile li:hover,
.widgeticons li a {
-moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.1);
-webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.1);
box-shadow: 1px 1px 2px rgba(0,0,0,0.1);
}
form input, form textarea, form select {
-moz-box-shadow: 0 1px 0 rgba(255,255,255,1);
-webkit-box-shadow: 0 1px 0 rgba(255,255,255,1);
box-shadow: 0 1px 0 rgba(255,255,255,1);
}
.empty {
background-color: #f8dbdb !important;
border-color: #cc3d3d !important;
}
.splashMessage {
font-size: 14px;
font-family: ‘Open Sans’, sans-serif;
line-height: 1.5em;
margin: 20px 0;
padding: 12px 30px 10px 20px;
position: relative;
}
.splashMessage i {
font-size: 18px;
margin-right: 10px;
}
.splashMessage .alert-close {
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAQAAAD8fJRsAAAAXElEQVR4XnXPsQ1AIQgE0KsYAWf6NDoClfuP8CGAFEY63sUcwobwgVHDtlHwxIaCk9W26ZEY74iccxP0Ag3u96Pg8HDO6Oau7K6bO3qXv88lrKzsM1b9XYIzEucf0sMh9ZVCt9gAAAAASUVORK5CYII=) no-repeat scroll 0 0 transparent;
display: block;
height: 12px;
opacity: 0.4;
overflow: hidden;
position: absolute;
right: 10px;
text-indent: -999px;
top: 15px;
width: 12px;
}
.splashMessage .alert-close:hover { opacity: 1; }

.splashMessage.default {
background-color: #ffffff;
border: 1px #cccccc solid;
color: #333333;
}
.splashMessage.primary {
background-color: #428bca;
border: 1px #357ebd solid;
color: #ffffff;
}
.splashMessage.info {
background-color: #5bc0de;
border: 1px #46b8da solid;
color: #ffffff;
}
.splashMessage.success {
background-color: #5cb85c;
border: 1px #4cae4c solid;
color: #ffffff;
}
.splashMessage.warning {
background-color: #f0ad4e;
border: 1px #eea236 solid;
color: #ffffff;
}
.splashMessage.danger {
background-color: #d9534f;
border: 1px #d43f3a solid;
color: #ffffff;
}
.splashMessage.inverse {
background-color: #474949;
border: 1px #000 solid;
color: #ffffff;
}
/*!

*/
.slider {
display: inline-block;
vertical-align: middle;
position: relative;
}
.slider.slider-horizontal {
width: 210px;
height: 20px;
}
.slider.slider-horizontal .slider-track {
height: 10px;
width: 100%;
margin-top: -5px;
top: 50%;
left: 0;
}
.slider.slider-horizontal .slider-selection {
height: 100%;
top: 0;
bottom: 0;
}
.slider.slider-horizontal .slider-handle {
margin-left: -10px;
margin-top: -5px;
}
.slider.slider-horizontal .slider-handle.triangle {
border-width: 0 10px 10px 10px;
width: 0;
height: 0;
border-bottom-color: #0480be;
margin-top: 0;
}
.slider.slider-vertical {
height: 210px;
width: 20px;
}
.slider.slider-vertical .slider-track {
width: 10px;
height: 100%;
margin-left: -5px;
left: 50%;
top: 0;
}
.slider.slider-vertical .slider-selection {
width: 100%;
left: 0;
top: 0;
bottom: 0;
}
.slider.slider-vertical .slider-handle {
margin-left: -5px;
margin-top: -10px;
}
.slider.slider-vertical .slider-handle.triangle {
border-width: 10px 0 10px 10px;
width: 1px;
height: 1px;
border-left-color: #0480be;
margin-left: 0;
}
.slider input {
display: none;
}
.slider .tooltip-inner {
white-space: nowrap;
}
.slider-track {
position: absolute;
cursor: pointer;
background-color: #f7f7f7;
background-image: -moz-linear-gradient(top, #f5f5f5, #f9f9f9);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f5f5f5), to(#f9f9f9));
background-image: -webkit-linear-gradient(top, #f5f5f5, #f9f9f9);
background-image: -o-linear-gradient(top, #f5f5f5, #f9f9f9);
background-image: linear-gradient(to bottom, #f5f5f5, #f9f9f9);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’#fff5f5f5’, endColorstr=’#fff9f9f9’, GradientType=0);
-webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
-moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.slider-selection {
position: absolute;
background-color: #f7f7f7;
background-image: -moz-linear-gradient(top, #f9f9f9, #f5f5f5);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f9f9f9), to(#f5f5f5));
background-image: -webkit-linear-gradient(top, #f9f9f9, #f5f5f5);
background-image: -o-linear-gradient(top, #f9f9f9, #f5f5f5);
background-image: linear-gradient(to bottom, #f9f9f9, #f5f5f5);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’#fff9f9f9’, endColorstr=’#fff5f5f5’, GradientType=0);
-webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
-moz-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.slider-handle {
position: absolute;
width: 20px;
height: 20px;
background-color: #0e90d2;
background-image: -moz-linear-gradient(top, #149bdf, #0480be);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#149bdf), to(#0480be));
background-image: -webkit-linear-gradient(top, #149bdf, #0480be);
background-image: -o-linear-gradient(top, #149bdf, #0480be);
background-image: linear-gradient(to bottom, #149bdf, #0480be);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’#ff149bdf’, endColorstr=’#ff0480be’, GradientType=0);
-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
opacity: 0.8;
border: 0px solid transparent;
}
.slider-handle.round {
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
}
.slider-handle.triangle {
background: transparent none;
}
h4 {
color: #cd0000;
font-size: 22px;
letter-spacing: -2px;
text-align: left;
}
.list {
color: #555;
font-size: 12px;
padding: 0 !important;
border: 1px solid #dedede;
}
.list li {
list-style: none;
border-bottom: 1px dotted #ccc;
text-indent: 5px;
padding: 5px;
border-right: 5px double hsla(0,95%,50%,.1);
}
.dash-count {
display: block;
position: absolute;
top: -10px;
right: 5px;
line-height: 16px;
height: 16px;
padding: 0 5px;
font-family: Arial, sans-serif;
font-size: 14px;
color: white !important;
border-width: 1px;
border-style: solid;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-color: #B94A48;
background-color: #B94A48;
}