Afficher/Ajout de manière dynamique <tr>

Question

J'ai ce code:

<table id="SomeTable"> 
<tr> 
    <td>Rows:</td> 
    <td><select name="Rows" id="Rows"> 
         <option value="1">1</option> 
         <option value="2">2</option> 
         <option value="3">3</option> 
         <option value="4">4</option> 
         <option value="5">5</option> 
        </select></td> 
</tr> 
<tr> 
    <td>#1</td> 
    <td><input type="text"></td> 
</tr> 
...... 
<tr> 
    <td>#5</td> 
    <td><input type="text"></td> 
</tr></table> 

Est-il possible d'afficher dynamiquement en quelque sorte le nombre de lignes sélectionnées dans la liste déroulante? Et ajouter le numéro actuel dans la première ou chaque rangée en utilisant JQuery?

Quel est le meilleur moyen de résoudre ce problème? Et est-il possible d'animer ces tr comme ils sont enlevés/ajoutés?

/M

Answer 1

Vous pouvez utiliser le sélecteur :gt(), comme ceci:

$("#Rows").change(function() { 
    $("#SomeTable tr").show().filter(":gt(" + $(this).val() + ")").hide(); 
}); 

Il est un indice 0, mais puisque vous avez une ligne supplémentaire là-haut avec le menu déroulant lui-même, cela fonctionne parfaitement.

$("#Rows").change(function() { 
    $("#SomeTable tr").show().slice(parseInt($(this).val(), 10)).hide(); 
}); 

Pour l'animation, vous pouvez faire un peu de décoloration, mais animant des lignes de table en particulier est méchant dans IE, je resterais loin de: comme celui-ci est .slice(), une autre alternative un peu plus propre.

Answer 2

$('#Rows').change(function() { 
    alert($(this).val()); 
}); 

Je ne sais pas ce que vous entendez, vous essayez d'ajouter des numéros n de l'élément en fonction de la valeur de la zone de sélection?