Visualizzazione dei risultati da 1 a 6 su 6
  1. #1

    [jQuery] Righe alternate e a discesa

    Ho sviluppato una tabella che ha una struttura delle row simile a questa

    codice:
    	 			
    <tr class="playerList" id="1">
    <td width="15px"></td>
    </tr>	  			
    
    <tr class="charList" id="figlia di 1">	(nascosta)			 				
    <td width="15px"></td>
    </tr> 					
    
    <tr class="charList" id="figlia di 1">	(nascosta)			 				
    <td width="15px"></td>
    </tr> 					
    
    
    <tr class="playerList" id="2">				 				
    <td width="15px"></td>
    </tr>	  			
    
    <tr class="charList" id="figlia di 2">	(nascosta)			 				
    <td width="15px"></td> 							
    </tr>
    Cliccando sulle TR playerList dovrebbero apparire e scivolare giù le figlie TR charList, che possono essere una o più.
    Generandole dinamicamente posso assegnare alle figlie delle proprietà che le legano alla riga madre, ma non riesco a trovare un selettore che mi consenta di far scorrere solo le figlie della row sulla quale clicco.
    Sono solo riuscito a farle esplodere tutte vero il basso, ma a me serve che vengano giù a tendina solo le figlie.

    Con un selettore simile invece
    codice:
    $("tr.playerList").click(function () {	
    if ($(this).next().is(":hidden")) { 	
    $(this).next().slideDown("slow"); 	
    	} else { 	
    		$$(this).next().slideUp("slow"); 	
    	} 	
    });
    scende solo la prima figlia.

    Sono un po acerbo con jQuery e avrei bisogno un aiutino

  2. #2
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,133
    Prova cosi
    codice:
    <tr class="playerList" id="Uno">
    <td width="15px"></td>
    </tr>	  			
    
    <tr class="Uno" id="Progressivo1">	(nascosta)			 				
    <td width="15px"></td>
    </tr> 					
    
    <tr class="Uno" id="Progressivo2">	(nascosta)			 				
    <td width="15px"></td>
    </tr> 					
    
    $("tr.playerList").click(function () {	
    if ($('.Uno').is(":hidden")) { 	
    $('.Uno').slideDown("slow"); 	
    	} else { 	
    		$('.Uno').slideUp("slow"); 	
    	} 	
    });
    A) Gli id non devono essere numerici 1 (no) _1 (si)
    B) Gli id devono essere univoci Uno, Uno (no) Uno, Uno_1 (si)
    Ritengo che per far aprire solo i figli di un determinato id devi associare i figli ad una classe specifica per ogni id, come facevi tu con il next() scorri i figlio adiacente 1 figlio next() 2 figli next().next() etc... non sono sicuro jquery lo conosco ancora poco (o nulla)
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

  3. #3
    Utente di HTML.it
    Registrato dal
    Dec 2010
    Messaggi
    3,660
    Ritengo che per far aprire solo i figli di un determinato id devi associare i figli ad una classe specifica per ogni id
    codice:
    <tr class="playerList" id="1">
    <td width="15px"></td>
    </tr>                  
    
    <tr class="figliadi1">                        
    <td width="15px"></td>
    </tr>                     
    
    <tr class="figliadi1">                          
    <td width="15px"></td>
    </tr>                     
    
    
    <tr class="playerList" id="2">                                 
    <td width="15px"></td>
    </tr>                  
    
    <tr class="figliadi2">                            
    <td width="15px"></td>                             
    </tr>     
    
    $("tr.playerList").click(function () {    
        var id=$(this).attr("id");
        $("tr.figliadi"+id).slideDown("slow");
    });

  4. #4
    Lo script di Vindav funziona ma l'effetto finale è strano.
    La struttura che ho impostato è la seguente

    codice:
    <tr class="playerList" id="31"> 	
    <td width="10px"></td> 	
    <td width="10px"></td> 	
    <td class="small"></td> 	
    <td class="small"></td> 	
    <td class="small">/td> 	
    <td class="small"></td> 	
    <td class="small"></td> 
    </tr>	  
    
    <tr class="charList31" style="display:none">				 	
     <td colspan="7" width="100%"> 		
      <table border="0" cellpadding="0" cellspacing="0" width="100%">
       <tr> 				
        <td width="15px"></td> 				
        <td width="15px"></td> 				
        <td width="15px"></td> 				
        <td class="small" width="15px">
    [img]images/sub_line.gif[/img]</td> 				
        <td class="small"></td> 				
        <td class="small"></td> 				
        <td class="small"></td> 				
        <td class="small"></td> 			
       </tr> 		
      </table> 	
     </td> 
    </tr>
    Una riga con sette TD e sotto una riga figlia (anche se nel DOM è allo stesso livello) con una sola cella ma colspan=7.

    Se dalla seconda TR levo il display:none, tutto ok.
    Se invece lo applico e poi uso la funziona di slideDown di jQuery, il colspan non viene letto e viene tutto compresso in una singola cella
    Non ne vengo a capo

  5. #5
    Utente di HTML.it
    Registrato dal
    Dec 2010
    Messaggi
    3,660
    il codice jquery non va ad agire sul colspan, dubito che sia un problema js...

  6. #6
    Originariamente inviato da Vindav
    il codice jquery non va ad agire sul colspan, dubito che sia un problema js...
    Se tolgo il display:none la TR figlia viene visualizzata correttamente.
    Quando invece compare grazie allo slideDown viene tutto compresso nel primo TD.
    C'è un meccanismo pernicioso di rendering che non comprendo.
    Sono un po allergico ai DIV (coi quali si risolverebbe tutto) e quindi vorrei lasciare tutto in tabelle facendo slide down.

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 © 2025 vBulletin Solutions, Inc. All rights reserved.