OverSu OverSu - 1 month ago 9
HTML Question

Select random visible row from table and clone it (with JS/jQuery)

I'm trying to get one random row from an array which is composed of 100 rows. Some are hidden, other are visible.

My aim is to get a random visible row, and clone it in another table. (visible and hidden row are classified, that's why I need that !)

My code:

<table id="Random">
</table>

<table id="Classified">
<tr id="Row1" style="display:none">
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
</tr>

<tr id="Row2">
<td>5</td>
<td>6</td>
<td>7</td>
<td>8</td>
</tr>

<tr id="Row3" style="display:none">
<td>9</td>
<td>10</td>
<td>11</td>
<td>12</td>
</tr>

<tr id="Row4">
<td>13</td>
<td>21</td>
<td>32</td>
<td>43</td>
</tr>

<tr id="Row5">
<td>15</td>
<td>26</td>
<td>37</td>
<td>48</td>
</tr>
</table>


<script>
$("#Random").html("");
var randomtd = Math.floor(Math.random() * $('#Classified tr:visible').length) + 1;
var identifiedRow = $('#Classified tr').eq(randomtd)[0];

$("#Random").html(identifiedRow);
</script>

Answer Source

Here you go with a solution https://jsfiddle.net/1hok7xme/

$("#Random").html("");
   
$('#Classified tr').each(function(){
  if($(this).is(':visible')){
    $("#Random").append(`<tr>${$(this).html()}</tr>`);
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Random Table:
<table id="Random">
</table>

<br/>
Classified Table:
<table id="Classified">
    <tr id="Row1" style="display:none">
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
    </tr>

    <tr id="Row2">
        <td>5</td>
        <td>6</td>
        <td>7</td>
        <td>8</td>
    </tr>

    <tr id="Row3" style="display:none">
        <td>9</td>
        <td>10</td>
        <td>11</td>
        <td>12</td>
    </tr>

    <tr id="Row4">
        <td>13</td>
        <td>21</td>
        <td>32</td>
        <td>43</td>
    </tr>

    <tr id="Row5">
        <td>15</td>
        <td>26</td>
        <td>37</td>
        <td>48</td>
    </tr>
</table>

Hope this will help you.