Solved

sort direction ..

Posted on 2011-09-06
11
311 Views
Last Modified: 2012-05-12
Hi Experts,
This is continuation of this question
http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Jquery/Q_27291969.html
Need to change  descending if d order is asc and vice versa


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Zvonko &#42;</title>
    <script>
    function srtodr(sFunc)
        {
            var testString = "{ 'a':[ { 'Name':'123abc','Age':'30','Date':'02/08/1988'}, { 'Name':'125','Age':'25','Date':'30/10/1975'}, { 'Name':'abcfgj','Age':'41','Date':'24/12/1982'},{ 'Name':' fsfdsf','Age':'30','Date':'02/08/1988'},{ 'Name':'','Age':'30','Date':'02/08/1988'},{ 'Name':'AbcTest','Age':'30','Date':'02/08/1988'} ]} ";
            var oJSON = eval("(" + testString + ")");
			conc.innerHTML = "";
			oJSON.a.sort(sFunc);
            for (var i = 0; i < oJSON.a.length; i++)
            {
                conc.innerHTML = conc.innerHTML + "Name = " + oJSON.a[i].Name;
                conc.innerHTML = conc.innerHTML + " Age = " + oJSON.a[i].Age;
                conc.innerHTML = conc.innerHTML + " Date = " + oJSON.a[i].Date;
                conc.innerHTML = conc.innerHTML + "<br/>";
            }             
        }
	function sortName(a,b){
	  if(a.Name>b.Name) return 1;
	  if(a.Name<b.Name) return -1;
	  return 0;
	}
	function sortAge(a,b){
	  return (a.Age*1)-(b.Age*1)
	}
	function sortDate(a,b){
	  var aDate = a.Date.split('/');
	  var bDate = b.Date.split('/');
	  aDate = new Date(aDate[2],aDate[1],aDate[0]);
	  bDate = new Date(bDate[2],bDate[1],bDate[0]);
	  return aDate.getTime()-bDate.getTime();
	}
	
    
    </script>
</head>
<body onload="srtodr(sortName)">
    <form id="form1" runat="server">
    <div id="conc"></div>
    <div>
      <a href="javascript:void(0)" onclick="srtodr(sortName)"> Sort Name </a> ||
       <a href="javascript:void(0)" onclick="srtodr(sortAge)">Sort Age </a> ||
       <a href="javascript:void(0)" onclick="srtodr(sortDate)">Sort Date </a> 
    </div>
    </form>
</body>
</html>

Open in new window

0
Comment
Question by:Rajar Ahmed
  • 6
  • 5
11 Comments
 
LVL 82

Accepted Solution

by:
leakim971 earned 500 total points
ID: 36489728
Test page : http://jsfiddle.net/TH5vA/
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Zvonko &#42;</title>
    <script>

var _n = false;
var _a = false;
var _d = false;

    function srtodr(sFunc)
        {
            var testString = "{ 'a':[ { 'Name':'123abc','Age':'30','Date':'02/08/1988'}, { 'Name':'125','Age':'25','Date':'30/10/1975'}, { 'Name':'abcfgj','Age':'41','Date':'24/12/1982'},{ 'Name':' fsfdsf','Age':'30','Date':'02/08/1988'},{ 'Name':'','Age':'30','Date':'02/08/1988'},{ 'Name':'AbcTest','Age':'30','Date':'02/08/1988'} ]} ";
            var oJSON = eval("(" + testString + ")");
			conc.innerHTML = "";
			oJSON.a.sort(sFunc);
            for (var i = 0; i < oJSON.a.length; i++)
            {
                conc.innerHTML = conc.innerHTML + "Name = " + oJSON.a[i].Name;
                conc.innerHTML = conc.innerHTML + " Age = " + oJSON.a[i].Age;
                conc.innerHTML = conc.innerHTML + " Date = " + oJSON.a[i].Date;
                conc.innerHTML = conc.innerHTML + "<br/>";
            }             
        }
	function sortName(a,b){
	  if(a.Name>b.Name) return 1;
	  if(a.Name<b.Name) return -1;
	  return 0;
	}
	function sortAge(a,b){
	  return (a.Age*1)-(b.Age*1)
	}
	function sortDate(a,b){
	  var aDate = a.Date.split('/');
	  var bDate = b.Date.split('/');
	  aDate = new Date(aDate[2],aDate[1],aDate[0]);
	  bDate = new Date(bDate[2],bDate[1],bDate[0]);
	  return aDate.getTime()-bDate.getTime();
	}
	
    
    </script>
</head>
<body onload="srtodr(sortName)">
    <form id="form1" runat="server">
    <div id="conc"></div>
    <div>
       <a href="javascript:void(0)" onclick="_n?srtodr(sortName):srtodr(sortName2);_n=!_n;"> Sort Name </a> ||
            <a href="javascript:void(0)" onclick="_a?srtodr(sortAge):srtodr(sortAge2);_a=!_a;">Sort Age </a> ||
                <a href="javascript:void(0)" onclick="_d?srtodr(sortDate):srtodr(sortDate2);_d=!d;">Sort Date </a> 
    </div>
    </form>
</body>
</html>

Open in new window

0
 
LVL 18

Author Comment

by:Rajar Ahmed
ID: 36489886
http://jsfiddle.net/TH5vA/8/

unable to sort date when some values  null  in date column
0
 
LVL 82

Expert Comment

by:leakim971
ID: 36489908
and for you a null value is greater of lower than a valid date?
0
Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

 
LVL 82

Expert Comment

by:leakim971
ID: 36489917
else you just need to test :

if( a == null ) a = new Date(1970,0,1); // or a = new Date(2200,0,1);
if( b == null ) b = new Date(1970,0,1);

Open in new window

0
 
LVL 18

Author Comment

by:Rajar Ahmed
ID: 36490022
Like numeric if its null its priority of ascending is set to first
similarly i want to sort data ascending if its set to null .

Example
                                          RESULTS
date  records      !           Asc             Desc
null                      !           null          02/08/1990
02/08/1988         !   02/08/1982     02/08/1988
02/08/1982         !     02/08/1988   02/08/1982
02/08/1990         !     02/08/1990             null

Tried this way ..
http://jsfiddle.net/TH5vA/20/
0
 
LVL 82

Expert Comment

by:leakim971
ID: 36490035
ID:36489917 did not help you?
0
 
LVL 18

Author Comment

by:Rajar Ahmed
ID: 36490052
yes , i tried dat in the jsfiddle . it was not working...
http://jsfiddle.net/TH5vA/20/ 
function srtodr(sFunc) {
    var testString = "{ 'a':[{ 'Name':'abcfgj','Age':'41','Date':''},{ 'Name':' fsfdsf','Age':'30','Date':'02/08/1990'},{ 'Name':'','Age':'30','Date':'02/08/1988'},{ 'Name':'AbcTest','Age':'30','Date':'02/08/1982'} ]} ";
    var oJSON = eval("(" + testString + ")");
    conc.innerHTML = "";
    oJSON.a.sort(sFunc);
    for (var i = 0; i < oJSON.a.length; i++) {
        conc.innerHTML = conc.innerHTML + "Name = " + oJSON.a[i].Name;
        conc.innerHTML = conc.innerHTML + " Age = " + oJSON.a[i].Age;
        conc.innerHTML = conc.innerHTML + " Date = " + oJSON.a[i].Date;
        conc.innerHTML = conc.innerHTML + "<br/>";
    }
}

function sortName(a, b) {
    if (a.Name > b.Name) return 1;
    if (a.Name < b.Name) return -1;
    return 0;
}

function sortAge(a, b) {
    return (a.Age * 1) - (b.Age * 1)
}

function sortDate(a, b) {
   if(( a == null ) || ( a == '' )) a = new Date(1970,0,1); // or a = new Date(2200,0,1);
    if(( b == null )||( b == '' )) b = new Date(1970,0,1);
    var aDate = a.Date.split('/');
    var bDate = b.Date.split('/');
    aDate = new Date(aDate[2], aDate[1], aDate[0]);
    bDate = new Date(bDate[2], bDate[1], bDate[0]);
    return aDate.getTime() - bDate.getTime();
}

function sortName2(a, b) {
    if (a.Name < b.Name) return 1;
    if (a.Name > b.Name) return -1;
    return 0;
}

function sortAge2(a, b) {
    return (b.Age * 1) - (a.Age * 1)
}

function sortDate2(a, b) {
    if(( a == null ) || ( a == '' )) a = new Date(1970,0,1); // or a = new Date(2200,0,1);
    if(( b == null )||( b == '' )) b = new Date(1970,0,1);
    var aDate = a.Date.split('/');
    var bDate = b.Date.split('/');
    aDate = new Date(aDate[2], aDate[1], aDate[0]);
    bDate = new Date(bDate[2], bDate[1], bDate[0]);
    return bDate.getTime() - aDate.getTime();
}
var _n = false;
var _a = false;
var _d = false;

window.onload = function() {
    srtodr(sortName)
}

Open in new window

0
 
LVL 82

Assisted Solution

by:leakim971
leakim971 earned 500 total points
ID: 36490196
Check this one : http://jsfiddle.net/TH5vA/31/

function srtodr(sFunc) {
    var testString = "{ 'a':[{ 'Name':'abcfgj','Age':'41','Date':''},{ 'Name':' fsfdsf','Age':'30','Date':'02/08/1990'},{ 'Name':'','Age':'30','Date':'02/08/1988'},{ 'Name':'AbcTest','Age':'30','Date':'02/08/1982'} ]} ";
    var oJSON = eval("(" + testString + ")");
    conc.innerHTML = "";
    oJSON.a.sort(sFunc);
    for (var i = 0; i < oJSON.a.length; i++) {
        conc.innerHTML = conc.innerHTML + "Name = " + oJSON.a[i].Name;
        conc.innerHTML = conc.innerHTML + " Age = " + oJSON.a[i].Age;
        conc.innerHTML = conc.innerHTML + " Date = " + oJSON.a[i].Date;
        conc.innerHTML = conc.innerHTML + "<br/>";
    }
}

function sortName(a, b) {
    if (a.Name > b.Name) return 1;
    if (a.Name < b.Name) return -1;
    return 0;
}

function sortAge(a, b) {
    return (a.Age * 1) - (b.Age * 1)
}

function sortDate(a, b) {
    if(( a.Date == null ) || ( a.Date == '' )) aDate = ["01","01","1970"]; else aDate = a.Date.split('/');
    if(( b.Date == null )||( b.Date == '' )) bDate = ["01","01","1970"]; else bDate = b.Date.split('/');
    aDate = new Date(aDate[2], aDate[1], aDate[0]);
    bDate = new Date(bDate[2], bDate[1], bDate[0]);
    return aDate.getTime() - bDate.getTime();
}

function sortName2(a, b) {
    if (a.Name < b.Name) return 1;
    if (a.Name > b.Name) return -1;
    return 0;
}

function sortAge2(a, b) {
    return (b.Age * 1) - (a.Age * 1)
}

function sortDate2(a, b) {
    if(( a.Date == null ) || ( a.Date == '' )) aDate = ["01","01","1970"]; else aDate = a.Date.split('/');
    if(( b.Date == null )||( b.Date == '' )) bDate = ["01","01","1970"]; else bDate = b.Date.split('/');
    aDate = new Date(aDate[2], aDate[1], aDate[0]);
    bDate = new Date(bDate[2], bDate[1], bDate[0]);
    return bDate.getTime() - aDate.getTime();
}
var _n = false;
var _a = false;
var _d = false;

window.onload = function() {
    srtodr(sortName)
}

Open in new window

0
 
LVL 18

Author Comment

by:Rajar Ahmed
ID: 36490390
i get error on ie browser but workin in chrome
conc.innerHTML = conc.innerHTML + "Name = " ....
Microsoft JScript runtime error: 'a[...].Name' is null or not an object
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>sortdirection</title>
    <script>
        function srtodr(sFunc) {
            var testString = "{ 'a':[{ 'Name':'abcfgj','Age':'41','Date':''},{ 'Name':' fsfdsf','Age':'30','Date':'02/08/1990'},{ 'Name':'','Age':'30','Date':'02/08/1988'},{ 'Name':'AbcTest','Age':'30','Date':'02/08/1982'},{ 'Name':'abcfgj','Age':'41','Date':''}, ]} ";
            var oJSON = eval("(" + testString + ")");
            conc.innerHTML = "";
            oJSON.a.sort(sFunc);
            for (var i = 0; i < oJSON.a.length; i++) {
                conc.innerHTML = conc.innerHTML + "Name = " + oJSON.a[i].Name; //error line in ie
                conc.innerHTML = conc.innerHTML + " Age = " + oJSON.a[i].Age;
                conc.innerHTML = conc.innerHTML + " Date = " + oJSON.a[i].Date;
                conc.innerHTML = conc.innerHTML + "<br/>";
            }
        }

        function sortName(a, b) {
            if (a.Name > b.Name) return 1;
            if (a.Name < b.Name) return -1;
            return 0;
        }

        function sortAge(a, b) {
            return (a.Age * 1) - (b.Age * 1)
        }

        function sortDate(a, b) {
            if ((a.Date == null) || (a.Date == '')) aDate = ["01", "01", "1970"]; else aDate = a.Date.split('/');
            if ((b.Date == null) || (b.Date == '')) bDate = ["01", "01", "1970"]; else bDate = b.Date.split('/');
            aDate = new Date(aDate[2], aDate[1], aDate[0]);
            bDate = new Date(bDate[2], bDate[1], bDate[0]);
            return aDate.getTime() - bDate.getTime();
        }

        function sortName2(a, b) {
            if (a.Name < b.Name) return 1;
            if (a.Name > b.Name) return -1;
            return 0;
        }

        function sortAge2(a, b) {
            return (b.Age * 1) - (a.Age * 1)
        }

        function sortDate2(a, b) {
            if ((a.Date == null) || (a.Date == '')) aDate = ["01", "01", "1970"]; else aDate = a.Date.split('/');
            if ((b.Date == null) || (b.Date == '')) bDate = ["01", "01", "1970"]; else bDate = b.Date.split('/');
            aDate = new Date(aDate[2], aDate[1], aDate[0]);
            bDate = new Date(bDate[2], bDate[1], bDate[0]);
            return bDate.getTime() - aDate.getTime();
        }
        var _n = false;
        var _a = false;
        var _d = false;

        window.onload = function () {
            srtodr(sortName)
        }
    </script>
</head>
<body onload="srtodr(sortName)">
    <form id="form1" runat="server">
    <div id="conc"></div>
    <div>
        <a href="javascript:void(0)" onclick="_n?srtodr(sortName):srtodr(sortName2);_n=!_n;"> Sort Name </a> ||
        <a href="javascript:void(0)" onclick="_a?srtodr(sortAge):srtodr(sortAge2);_a=!_a;">Sort Age </a> ||
        <a href="javascript:void(0)" onclick="_d?srtodr(sortDate):srtodr(sortDate2);_d=!_d;">Sort Date </a> 
    </div>
</form>
</body>
</html>

Open in new window

0
 
LVL 82

Assisted Solution

by:leakim971
leakim971 earned 500 total points
ID: 36490422
if( oJSON.a[i].Name != null ) conc.innerHTML = conc.innerHTML + "Name = " + oJSON.a[i].Name; //error line in ie

Open in new window

0
 
LVL 18

Author Closing Comment

by:Rajar Ahmed
ID: 36490570
awesome .. thanks...!
0

Featured Post

DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction Chart.js, used properly, can visually add a difference to your charting applications. It engages your visitors and allows them to interact with data they otherwise wouldn't be able to without expensive and complicated systems. For this…
How to build a simple, quick and effective accordion menu using just 15 lines of jQuery and 2 css classes
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

772 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question