Php και sort javascript

Σε αυτή την περιοχή μπορείτε να βρείτε ή να αναζητήσετε πληροφορίες σχετικές με την PHP

Συντονιστές: WebDev Moderators, Super-Moderators, PHP Moderators

Απάντηση
antonis_ath
Δημοσιεύσεις: 113
Εγγραφή: 22 Μαρ 2007 07:56

Php και sort javascript

Δημοσίευση από antonis_ath » 23 Νοέμ 2007 13:09

Καλημερα!
Εχω να φτιαξω μια σελίδα η οποία φέρνει κάποια αποτελέσματα μετά απο ένα search.
Μέχρι εδώ όλα καλά.
Εμφανιζεται ο πίνακας που στη πρώτη γραμμή έχει τα ονοματα κάθε πεδίου σε κάθε κελλί και απο κάτω τα δεδομένα.
Τώρα πρέπει κάθε όνομα απο κάθε πεδίο οταν το πατάς να γίνεται sort τα πεδία του πίνακα.
Υπάρχει ενα αντοιστιχο παράδειγμα της εφαρμογής απο τι κοιτάζω απο χθές και επειδή javascript δεν ξέρω πολλά πραγματα διαπιστωσα τα εξής
Το αρχείο javascript ειναι ξεχωριστο,μέσα έχει μια function η οποία κάνει
Find all tables with class sortable and make them sortable
Είδα στο παράδειγμα που έχω οτι το table που φέρνει τα δεδομένα είναι class sortable
και δεν υπάρχει αναφορά κάπου αλλού στο στο javascript.
Eκανα και εγώ το ίδιο αντέγραψα το αρχειο javascript στο φακελό μου έδωσα class sortable στο πίνακα αλλά μπα...
Επειδή δεν έχω ξανακανει κατι τέτοιο μήπως μπορείτε να βοηθήσετε λίγο?

Άβαταρ μέλους
fafos
Script Master
Δημοσιεύσεις: 6230
Εγγραφή: 30 Νοέμ 2004 03:09

Php και sort javascript

Δημοσίευση από fafos » 23 Νοέμ 2007 15:52

Apo osa gnorizo to tableshort me ajax-javascript ginetai mono gia thn trexousa selida pou vlepei o xrhsths.. dhladh an ta apotelesmata sou feroun apotelesmata se 10 selides pantotas na ta kaneis short me vash to onoma tha sou kanei short alfavhtika ta apotelesmata ths proths selidas kai oi ypoloipes einai me to default short.. des ena paradeigma me ajax edo:
http://motherrussia.polyester.se/docs/tablesorter/

to poio sosto einai na to kaneis me short meso ton php queries pou zhtas... apo kei kai pera an exeis gnoseis ajax mporeis na tou dineis thn dynatothta na allazei to short xoris na kanei reload h selida alla monh ths h ajax den prokeitai na sou kanei short ola ta apotelesmata..

antonis_ath
Δημοσιεύσεις: 113
Εγγραφή: 22 Μαρ 2007 07:56

Php και sort javascript

Δημοσίευση από antonis_ath » 23 Νοέμ 2007 16:26

Nα σας δείξω το javascript απο το οποίο δεν καταλαβαίνω πολλά γιατι δεν ξέρω javascript για να καταλαβετε τι εννοώ και να με καθοδησετε αν μπορείτε. στο τι πρέπει να προσθέσω στον κώδικα της php\

Κώδικας: Επιλογή όλων

addEvent(window, "load", sortables_init);

var SORT_COLUMN_INDEX;

function sortables_init() {
    // Find all tables with class sortable and make them sortable
    if (!document.getElementsByTagName) return;
    tbls = document.getElementsByTagName("table");
    for &#40;ti=0;ti<tbls.length;ti++&#41; &#123;
        thisTbl = tbls&#91;ti&#93;;
        if &#40;&#40;&#40;' '+thisTbl.className+' '&#41;.indexOf&#40;"sortable"&#41; != -1&#41; && &#40;thisTbl.id&#41;&#41; &#123;
            //initTable&#40;thisTbl.id&#41;;
            ts_makeSortable&#40;thisTbl&#41;;
        &#125;
    &#125;
&#125;

function ts_makeSortable&#40;table&#41; &#123;
    if &#40;table.rows && table.rows.length > 0&#41; &#123;
        var firstRow = table.rows&#91;0&#93;;
    &#125;
    if &#40;!firstRow&#41; return;
    
    // We have a first row&#58; assume it's the header, and make its contents clickable links
    for &#40;var i=0;i<firstRow.cells.length;i++&#41; &#123;
        var cell = firstRow.cells&#91;i&#93;;
        var txt = ts_getInnerText&#40;cell&#41;;
        cell.innerHTML = '<a href="#" class="sortheader" '+ 
        'onclick="ts_resortTable&#40;this, '+i+'&#41;;return false;">' + 
        txt+'<span class="sortarrow"></span></a>';
    &#125;
&#125;

function ts_getInnerText&#40;el&#41; &#123;
	if &#40;typeof el == "string"&#41; return el;
	if &#40;typeof el == "undefined"&#41; &#123; return el &#125;;
	if &#40;el.innerText&#41; return el.innerText;	//Not needed but it is faster
	var str = "";
	
	var cs = el.childNodes;
	var l = cs.length;
	for &#40;var i = 0; i < l; i++&#41; &#123;
		switch &#40;cs&#91;i&#93;.nodeType&#41; &#123;
			case 1&#58; //ELEMENT_NODE
				str += ts_getInnerText&#40;cs&#91;i&#93;&#41;;
				break;
			case 3&#58;	//TEXT_NODE
				str += cs&#91;i&#93;.nodeValue;
				break;
		&#125;
	&#125;
	return str;
&#125;

function ts_resortTable&#40;lnk,clid&#41; &#123;
    // get the span
    var span;
    for &#40;var ci=0;ci<lnk.childNodes.length;ci++&#41; &#123;
        if &#40;lnk.childNodes&#91;ci&#93;.tagName && lnk.childNodes&#91;ci&#93;.tagName.toLowerCase&#40;&#41; == 'span'&#41; span = lnk.childNodes&#91;ci&#93;;
    &#125;
    var spantext = ts_getInnerText&#40;span&#41;;
    var td = lnk.parentNode;
    var column = clid || td.cellIndex;
    var table = getParent&#40;td,'TABLE'&#41;;
    
    // Work out a type for the column
    if &#40;table.rows.length <= 1&#41; return;
    var itm = ts_getInnerText&#40;table.rows&#91;1&#93;.cells&#91;column&#93;&#41;;
    sortfn = ts_sort_caseinsensitive;
    if &#40;itm.match&#40;/^\d\d&#91;\/-&#93;\d\d&#91;\/-&#93;\d\d\d\d$/&#41;&#41; sortfn = ts_sort_date;
    if &#40;itm.match&#40;/^\d\d&#91;\/-&#93;\d\d&#91;\/-&#93;\d\d$/&#41;&#41; sortfn = ts_sort_date;
    if &#40;itm.match&#40;/^&#91;£$&#93;/&#41;&#41; sortfn = ts_sort_currency;
    if &#40;itm.match&#40;/^&#91;\d\.&#93;+$/&#41;&#41; sortfn = ts_sort_numeric;
    SORT_COLUMN_INDEX = column;
    var firstRow = new Array&#40;&#41;;
    var newRows = new Array&#40;&#41;;
    for &#40;i=0;i<table.rows&#91;0&#93;.length;i++&#41; &#123; firstRow&#91;i&#93; = table.rows&#91;0&#93;&#91;i&#93;; &#125;
    for &#40;j=1;j<table.rows.length;j++&#41; &#123; newRows&#91;j-1&#93; = table.rows&#91;j&#93;; &#125;

    newRows.sort&#40;sortfn&#41;;

    if &#40;span.getAttribute&#40;"sortdir"&#41; == 'down'&#41; &#123;
        ARROW = '<font color=#144B0E></font>';
        newRows.reverse&#40;&#41;;
        span.setAttribute&#40;'sortdir','up'&#41;;
    &#125; else &#123;
        ARROW = '<font color=#144B0E></font>';
        span.setAttribute&#40;'sortdir','down'&#41;;
    &#125;
    
    // We appendChild rows that already exist to the tbody, so it moves them rather than creating new ones
    // don't do sortbottom rows
    for &#40;i=0;i<newRows.length;i++&#41; &#123; if &#40;!newRows&#91;i&#93;.className || &#40;newRows&#91;i&#93;.className && &#40;newRows&#91;i&#93;.className.indexOf&#40;'sortbottom'&#41; == -1&#41;&#41;&#41; table.tBodies&#91;0&#93;.appendChild&#40;newRows&#91;i&#93;&#41;;&#125;
    // do sortbottom rows only
    for &#40;i=0;i<newRows.length;i++&#41; &#123; if &#40;newRows&#91;i&#93;.className && &#40;newRows&#91;i&#93;.className.indexOf&#40;'sortbottom'&#41; != -1&#41;&#41; table.tBodies&#91;0&#93;.appendChild&#40;newRows&#91;i&#93;&#41;;&#125;
    
    // Delete any other arrows there may be showing
    var allspans = document.getElementsByTagName&#40;"span"&#41;;
    for &#40;var ci=0;ci<allspans.length;ci++&#41; &#123;
        if &#40;allspans&#91;ci&#93;.className == 'sortarrow'&#41; &#123;
            if &#40;getParent&#40;allspans&#91;ci&#93;,"table"&#41; == getParent&#40;lnk,"table"&#41;&#41; &#123; // in the same table as us?
                allspans&#91;ci&#93;.innerHTML = '';
            &#125;
        &#125;
    &#125;
        
    span.innerHTML = ARROW;
&#125;

function getParent&#40;el, pTagName&#41; &#123;
	if &#40;el == null&#41; return null;
	else if &#40;el.nodeType == 1 && el.tagName.toLowerCase&#40;&#41; == pTagName.toLowerCase&#40;&#41;&#41;	// Gecko bug, supposed to be uppercase
		return el;
	else
		return getParent&#40;el.parentNode, pTagName&#41;;
&#125;
function ts_sort_date&#40;a,b&#41; &#123;
    // y2k notes&#58; two digit years less than 50 are treated as 20XX, greater than 50 are treated as 19XX
    aa = ts_getInnerText&#40;a.cells&#91;SORT_COLUMN_INDEX&#93;&#41;;
    bb = ts_getInnerText&#40;b.cells&#91;SORT_COLUMN_INDEX&#93;&#41;;
    if &#40;aa.length == 10&#41; &#123;
        dt1 = aa.substr&#40;6,4&#41;+aa.substr&#40;3,2&#41;+aa.substr&#40;0,2&#41;;
    &#125; else &#123;
        yr = aa.substr&#40;6,2&#41;;
        if &#40;parseInt&#40;yr&#41; < 50&#41; &#123; yr = '20'+yr; &#125; else &#123; yr = '19'+yr; &#125;
        dt1 = yr+aa.substr&#40;3,2&#41;+aa.substr&#40;0,2&#41;;
    &#125;
    if &#40;bb.length == 10&#41; &#123;
        dt2 = bb.substr&#40;6,4&#41;+bb.substr&#40;3,2&#41;+bb.substr&#40;0,2&#41;;
    &#125; else &#123;
        yr = bb.substr&#40;6,2&#41;;
        if &#40;parseInt&#40;yr&#41; < 50&#41; &#123; yr = '20'+yr; &#125; else &#123; yr = '19'+yr; &#125;
        dt2 = yr+bb.substr&#40;3,2&#41;+bb.substr&#40;0,2&#41;;
    &#125;
    if &#40;dt1==dt2&#41; return 0;
    if &#40;dt1<dt2&#41; return -1;
    return 1;
&#125;

function ts_sort_currency&#40;a,b&#41; &#123; 
    aa = ts_getInnerText&#40;a.cells&#91;SORT_COLUMN_INDEX&#93;&#41;.replace&#40;/&#91;^0-9.&#93;/g,''&#41;;
    bb = ts_getInnerText&#40;b.cells&#91;SORT_COLUMN_INDEX&#93;&#41;.replace&#40;/&#91;^0-9.&#93;/g,''&#41;;
    return parseFloat&#40;aa&#41; - parseFloat&#40;bb&#41;;
&#125;

function ts_sort_numeric&#40;a,b&#41; &#123; 
    aa = parseFloat&#40;ts_getInnerText&#40;a.cells&#91;SORT_COLUMN_INDEX&#93;&#41;&#41;;
    if &#40;isNaN&#40;aa&#41;&#41; aa = 0;
    bb = parseFloat&#40;ts_getInnerText&#40;b.cells&#91;SORT_COLUMN_INDEX&#93;&#41;&#41;; 
    if &#40;isNaN&#40;bb&#41;&#41; bb = 0;
    return aa-bb;
&#125;

function ts_sort_caseinsensitive&#40;a,b&#41; &#123;
    aa = ts_getInnerText&#40;a.cells&#91;SORT_COLUMN_INDEX&#93;&#41;.toLowerCase&#40;&#41;;
    bb = ts_getInnerText&#40;b.cells&#91;SORT_COLUMN_INDEX&#93;&#41;.toLowerCase&#40;&#41;;
    if &#40;aa==bb&#41; return 0;
    if &#40;aa<bb&#41; return -1;
    return 1;
&#125;

function ts_sort_default&#40;a,b&#41; &#123;
    aa = ts_getInnerText&#40;a.cells&#91;SORT_COLUMN_INDEX&#93;&#41;;
    bb = ts_getInnerText&#40;b.cells&#91;SORT_COLUMN_INDEX&#93;&#41;;
    if &#40;aa==bb&#41; return 0;
    if &#40;aa<bb&#41; return -1;
    return 1;
&#125;


function addEvent&#40;elm, evType, fn, useCapture&#41;
// addEvent and removeEvent
// cross-browser event handling for IE5+,  NS6 and Mozilla
// By Scott Andrew
&#123;
  if &#40;elm.addEventListener&#41;&#123;
    elm.addEventListener&#40;evType, fn, useCapture&#41;;
    return true;
  &#125; else if &#40;elm.attachEvent&#41;&#123;
    var r = elm.attachEvent&#40;"on"+evType, fn&#41;;
    return r;
  &#125; else &#123;
    alert&#40;"Handler could not be removed"&#41;;
  &#125;
&#125; 

dimis283
Δημοσιεύσεις: 118
Εγγραφή: 12 Ιουν 2006 00:53

Php και sort javascript

Δημοσίευση από dimis283 » 23 Νοέμ 2007 22:11

Εννοεί μάλλον <table class="sortable">.
Ειναι αυτό?
http://www.kryogenix.org/code/browser/sorttable/

antonis_ath
Δημοσιεύσεις: 113
Εγγραφή: 22 Μαρ 2007 07:56

Php και sort javascript

Δημοσίευση από antonis_ath » 24 Νοέμ 2007 12:34

Μάλλον αλλά δεν δουλέυει..Εχω κάνει τα παρακάτω

Κώδικας: Επιλογή όλων

$query="SELECT * FROM cours  where  intitule  LIKE '%$search%'and visible='2'   ";
$result=mysql_query&#40;$query&#41;;
$num_results=mysql_num_rows&#40;$result&#41;;


 echo"<table class='sortable' id='t1' style='border&#58; thin solid rgb&#40;192, 189, 133&#41;;' border='0' bgcolor='#D7D49E' cellpadding='0'
cellspacing='0' width='96%' align=center>";


echo"<tr>";


  echo" <th  align=left cosplan='2' >M???&#181;a</th>
  <th align=left >K?d????</th>
<th  align=left >??pa?de?t????</th>
<th  align=left>S?????? ????da</th>";
echo"</tr>";

 for&#40;$i=0; $i <$num_results; $i++&#41;
&#123;
$row=mysql_fetch_array&#40;$result&#41;;
$url=$row&#91;'code'&#93;;

$query2="select ONOMASIA  from lessons   where GLAC='$url'";
$result2=mysql_query&#40;$query2&#41;;
$num_results2=mysql_num_rows&#40;$result2&#41;;
$row2=mysql_fetch_array&#40;$result2&#41;;


echo"<tr onMouseOver=this.style.backgroundColor='#C8C695'  onMouseOut=this.style.backgroundColor='transparent'>";
echo "<td class=k_top align=left ><img src=../../images/arrow.gif><a
href='../../courses/".$url."'
target=_top
class=mainpage>".$row&#91;'intitule'&#93;." </a></td><td class=kk aling=center>".$row&#91;'code'&#93;."</td>
<td class=kk aling=right>".$row&#91;'titulaires'&#93;."</td>";

echo"</tr>";
echo mysql_error&#40;&#41;;
&#125;

echo"</table>";
Aλλά δεν δουλεύει..
Καμιά ιδέα?

dimis283
Δημοσιεύσεις: 118
Εγγραφή: 12 Ιουν 2006 00:53

Php και sort javascript

Δημοσίευση από dimis283 » 24 Νοέμ 2007 13:12

Εδώ λένε διαίρει και βασίλευε.
Δες αν δουλεύει ένα στατικό html table όπως το δικό σου και κάντο δυναμικό.
Το παραδειγμά τους δουλεύει.

antonis_ath
Δημοσιεύσεις: 113
Εγγραφή: 22 Μαρ 2007 07:56

Php και sort javascript

Δημοσίευση από antonis_ath » 24 Νοέμ 2007 22:38

Δοκίμασα αυτο που μου έδωσες και δουλεύει μια χαρά..Το πρόβλημα είναι οτι εγώ πρέπει να χρησιμωποιήσω το άλλο script που στη σε άλλη σελίδα παίζει στη δικία μου οχι .
Βλέπετε σε αυτό που σας έδωσα κάτι λάθος? :roll:
Ισως να πρέπει να προσθέσω κάτι στον κωδικα της php για να δουλέψει?

dimis283
Δημοσιεύσεις: 118
Εγγραφή: 12 Ιουν 2006 00:53

Php και sort javascript

Δημοσίευση από dimis283 » 25 Νοέμ 2007 10:35

Από ότι είδα έχεις κατι

Κώδικας: Επιλογή όλων

 id='t1' style='border&#58; thin solid rgb&#40;192, 189, 133&#41;;'
Βγάλτα-ότι έχουν σχέση με style και 'id'-νομίζω ότι μπορείς να τα βάλεις στο .css στην κλάση table.sortable η κάπως έτσι .
Φτιάξε άνα απλό table και δες αν λειτουργεί-δεν υπάρχει παράδειγμα?

antonis_ath
Δημοσιεύσεις: 113
Εγγραφή: 22 Μαρ 2007 07:56

Php και sort javascript

Δημοσίευση από antonis_ath » 25 Νοέμ 2007 12:09

Yπάρχει αυτό

Κώδικας: Επιλογή όλων


  echo "<table class=\"sortable\" id=\"t$serial\" style=\"border&#58; thin solid rgb&#40;192, 189, 133&#41;;\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" width=\"96%\" align=center>\n";
	    echo "<tr>\n";
            echo "   <th width=350 align=center colspan=2>&#204;&#220;&#232;&#231;&#236;&#225;</th>\n";
            echo "   <th width=70 align=center>&#202;&#249;&#228;&#233;&#234;&#252;&#242;</th>\n";
	    echo "   <th width=230 align=center>&#197;&#234;&#240;&#225;&#233;&#228;&#229;&#245;&#244;&#233;&#234;&#252;&#242;</th>\n";
            echo "   <th width=100 align=center>&#212;&#220;&#238;&#231;-&#212;&#236;&#222;&#236;&#225;</th>\n";
            echo "</tr>\n";
Το οποίο δουλέυει με το javascript το από πάνω.
Σε αυτή τη σελίδα γίνεται ιnclude ένα αρχείο το οποίο εχει μέσα

Κώδικας: Επιλογή όλων

<script type="text/javascript" src="sorttable.js"></script>
[/i]

antonis_ath
Δημοσιεύσεις: 113
Εγγραφή: 22 Μαρ 2007 07:56

Php και sort javascript

Δημοσίευση από antonis_ath » 26 Νοέμ 2007 12:15

Kαλημέρα...ρε παιδία...βλέπετε κανένα λαθος γιατι θα τρελλαθώ...τελίκα το js που έδωσα ποίο πάνω δουλέυει και σε απλό hmtl πίνακα απλά πρέπει να βάλεις id t1

Στον απο κάτω κώδικα τo js δουλευει.

Κώδικας: Επιλογή όλων

	  echo "<table class=\"sortable\" id=\"t$serial\" style=\"border&#58; thin solid rgb&#40;192, 189, 133&#41;;\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" width=\"96%\" align=center>\n";
	    echo "<tr>\n";
            echo "   <th width=350 align=center colspan=2>&#204;&#220;&#232;&#231;&#236;&#225;</th>\n";
            echo "   <th width=70 align=center>&#202;&#249;&#228;&#233;&#234;&#252;&#242;</th>\n";
	    echo "   <th width=230 align=center>&#197;&#234;&#240;&#225;&#233;&#228;&#229;&#245;&#244;&#233;&#234;&#252;&#242;</th>\n";
            echo "   <th width=100 align=center>&#212;&#220;&#238;&#231;-&#212;&#236;&#222;&#236;&#225;</th>\n";
            echo "</tr>\n";

	  while &#40;$mycours = mysql_fetch_array&#40;$result&#41;&#41; &#123;
	    // changed the variable because of the previous change in the select argument
	    if &#40;$mycours&#91;'visible'&#93; == 2&#41; &#123;
	      $codelink = "<a href='../../courses/$mycour&#91;k&#93;/' class=mainpage>$mycours&#91;c&#93;</a>";
	    &#125; else &#123;
	      $codelink = $mycours&#91;'c'&#93;;
	    &#125;

	    echo "<tr onMouseOver=\"this.style.backgroundColor='#C8C695'\" onMouseOut=\"this.style.backgroundColor='transparent'\">\n";
	    echo "   <td class=k_top width=1% valign=top><img src=../../images/arrow.gif></td>\n";
	    echo "   <td class=kk><a href='../../courses/$mycours&#91;k&#93;/' class=mainpage>$mycours&#91;i&#93;</a></td>\n";
	    echo "   <td class=kk align=center>$mycours&#91;c&#93;</td>\n";
	    echo "   <td class=kk align=center>$mycours&#91;t&#93;</td>\n";
	    // get taxi/tmima
	    $clid = mysql_fetch_array&#40;mysql_query&#40;"SELECT name from class WHERE id='$mycours&#91;cl_id&#93;'"&#41;&#41;;
	    echo "   <td class=kk align=center>$clid&#91;names&#93;$mycours&#91;d&#93;</td>\n";
	    echo "</tr>\n";
	    &#125;
	    echo "</table>\n";

Σε αυτόν δεν δουλεύει...βλέπει κανείς κάτι στραβό?




Κώδικας: Επιλογή όλων

   echo "<table class=\"sortable\" id=\"t1\" style=\"border&#58; thin solid rgb&#40;192, 189, 133&#41;;\" border=\"0\" cellpadding=\"0\"
cellspacing=\"0\" width=\"96%\" align=center>\n";



echo"<tr>\n";


  echo" <th   align=left cosplan='2' >Mάθημα</th>
  <th align=left >Kωδικός</th>
<th  align=left >Εκπαιδευτικός</th>
<th  align=left>Σχολική Μονάδα</th>";
echo"</tr>\n";

 for&#40;$i=0; $i <$num_results; $i++&#41;
&#123;
$row=mysql_fetch_array&#40;$result&#41;;
$url=$row&#91;'code'&#93;;
$faculte_id=$row&#91;'faculte_id'&#93;;
$query2="select ONOMASIA  from lessons   where GLU='$faculte_id'";
$result2=mysql_query&#40;$query2&#41;;
$num_results2=mysql_num_rows&#40;$result2&#41;;
$row2=mysql_fetch_array&#40;$result2&#41;;


echo"<tr onMouseOver=this.style.backgroundColor='#C8C695'  onMouseOut=this.style.backgroundColor='transparent'>";
echo "<td class=k_top align=left ><img src=../../images/arrow.gif>&nbsp;<a
href='../../courses/".$url."'
target=_top class=mainpage>".$row&#91;'intitule'&#93;." </a></td><td class=kk aling=center>".$row&#91;'code'&#93;."</td>
<td class=kk aling=right>".$row&#91;'titulaires'&#93;."</td><td class=kk align right>".$row2&#91;'ONOMASIA'&#93;." ";

echo"</tr>";
echo mysql_error&#40;&#41;;
&#125;

echo"</table>";



Απάντηση

Επιστροφή στο “PHP Προγραμματισμός”

Μέλη σε σύνδεση

Μέλη σε αυτήν τη Δ. Συζήτηση: Δεν υπάρχουν εγγεγραμμένα μέλη και 0 επισκέπτες