Pagina 1 di 2 1 2 ultimoultimo
Visualizzazione dei risultati da 1 a 10 su 11
  1. #1

    ordinare tabella creata via ajax

    Salve a tutti.
    E' un oretta che cerco di capire come fare, ma sto sbattendo la testa contro quella che sarà sicuramente una cavolata.

    Ho un div che viene popolato da una tabella, tramite ajax, alla pressione di un pulsante.
    vorrei semplicemente che la tabella al suo interno, fosse ordinabile.

    Ho provato con jquery.tablesorter ma nulla, non riesco a farlo funzionare.
    su una tabella "normale" funziona, ma probabilmente non esistendo la tabella al momento della creazione della pagina, tablesorter non funziona

    jquery e jquery.tablesorter vengono caricati, ne sono certo, primo perchè se non fossero caricati tramite "ispeziona elemento" di chrome non riuscirei a leggerli. e secondo perchè ripeto, se la stessa tabella al posto di crearla via ajax, la metto direttamente nel codice html della pagina, tablesorter funziona.

    come da documentazione, lo carico tramite questo script messo nell'head (sicuramente l'errore è qui, ma è la prima volta che uso jquery..):

    codice:
    $(document).ready(function() 
        { 
            $("#myTable").tablesorter(); 
        } 
    );

  2. #2
    Utente di HTML.it L'avatar di abellos
    Registrato dal
    Feb 2002
    Messaggi
    383
    ciao hai usato i tag thead e tbody per definire la prima riga e i dati da ordinare nella tabella che crei?

    io l'ho usato in questo modo e funziona
    codice:
    <script type="text/javascript">
    $(document).ready(function() 
        { 	
    	/*sortList: [[1,0], [1,0]] ordina per pratica
    	sortList: [[4,0], [1,0]] ordina per ubicazione
    	*/
            $("#tabella").tablesorter({sortList: [[2,0], [1,0]]} ); 
        } 
    ); 
    
    
    </script>
    il [a,b]
    a serve a scegliere la colonna da ordinare
    b l'ordinamento crescente o decrescente
    Da un grande potere derivano grandi responsabilità

  3. #3
    Originariamente inviato da abellos
    ciao hai usato i tag thead e tbody per definire la prima riga e i dati da ordinare nella tabella che crei?

    io l'ho usato in questo modo e funziona
    codice:
    <script type="text/javascript">
    $(document).ready(function() 
        { 	
    	/*sortList: [[1,0], [1,0]] ordina per pratica
    	sortList: [[4,0], [1,0]] ordina per ubicazione
    	*/
            $("#tabella").tablesorter({sortList: [[2,0], [1,0]]} ); 
        } 
    ); 
    
    
    </script>
    il [a,b]
    a serve a scegliere la colonna da ordinare
    b l'ordinamento crescente o decrescente
    ciao! si li ho inseriti (la tabella è creata dinamicamente da un db tramite le librerie table di codeigniter).
    infatti ripeto, se prendo l'html generato e lo metto direttamente nel file html, tablesorter funziona...

    non mi interessa avere un ordine all'avvio, l'ordine giusto me lo sono già impostato nella query che genera la tabella.

    il problema è che la funzione mettendola su $(document).ready, viene caricata al caricamento della pagina. ma al caricamento della pagina la tabella non esiste!

    grazie cmq per la risposta!

  4. #4
    metti $("#myTable").tablesorter(); nella success function della chiamata ajax che crea la tabella, dopo l' html()

  5. #5
    Originariamente inviato da lucavizzi
    metti $("#myTable").tablesorter(); nella success function della chiamata ajax che crea la tabella, dopo l' html()
    la chiamata ajax non la effettuo tramite jquery: ho una funzione javascript che viene chiamata al click di un bottone:

    codice:
    function analizza()
    		{
    			getdata(document.getElementById('start_date').value,document.getElementById('end_date').value);
    			$("#datatable").tablesorter(); 
    		}
    codice:
    function getdata(start,end)
    		{
    			target_div = 'wrapper';
    				if (window.XMLHttpRequest)
    			  {// code for IE7+, Firefox, Chrome, Opera, Safari
    			  xmlhttp=new XMLHttpRequest();
    			  }
    			else
    			  {// code for IE6, IE5
    			  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    			  }
    			
    			xmlhttp.onreadystatechange=function()
    			  {
    				if (xmlhttp.readyState!=4)
    				{
    				document.getElementById(target_div).innerHTML="Loading...";
    				}
    				
    				if (xmlhttp.readyState==4 && xmlhttp.status==200)
    				{
    				document.getElementById(target_div).innerHTML=xmlhttp.responseText;
    				}
    			  }
    			  			xmlhttp.open("POST","http://localhost:8080/ticket/index.php/ticket/ajax_fasceorarie/"+start+"/"+end,true);
    			xmlhttp.send();
    		}

    getdata sarebbe la funzione che fa la chiamata ajax e tramite la onreadystatechange cambia l'innerhtml del div interessato, ficcandogli dentro la tabella html.

    io ho aggiunto la riga $("#datatable").tablesorter(); lì pensando che fosse il posto più adatto.. a quel punto, la tabella dovrebbe già essere visibile! ripeto, dal punto di vista di ajax-jquery sto veramente a zero quindi schiaritemi le idee vi prego

  6. #6
    la devi mettere dopo:
    document.getElementById(target_div).innerHTML=xmlh ttp.responseText;

  7. #7
    Originariamente inviato da lucavizzi
    la devi mettere dopo:
    document.getElementById(target_div).innerHTML=xmlh ttp.responseText;
    fatto ed effettivamente così funziona. però non ho capito il perchè.. saresti così gentile da spiegarmelo brevemente?

  8. #8
    la tabella entra a far parte del DOM dopo che fai l'innerHTML, non prima.

  9. #9
    Originariamente inviato da lucavizzi
    la tabella entra a far parte del DOM dopo che fai l'innerHTML, non prima.
    bhe ma io eseguivo la sortertable dopo la getdata...

  10. #10
    ma prima dell'innerHTML

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2024 vBulletin Solutions, Inc. All rights reserved.