insert data in html table

Question

insert data in html table

Navigation

#1 by (1 votes)
#2 by (0 votes)

-1

I am trying to create a mini system that, at random, allows me to select the winner of a prize for employees in the company where I work. I get a random data and I can show it in a td with an id ="listadeganadores" , what I want is that in that table, jump to the second and a third position.

The following code prints in the result of the first one but when executing it, it deletes it for the other one.

d3.select("#ganadores").text(data[picked].question);
oldrotation = rotation;

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>

<table id="listadeganadores" border="1">
  <tr>
    <td colspan="5" align="center">RESULTADOS</td>
  </tr>
  <tr>
    <!--   en estos td van los resultados    -->
    <td id="ganadores"></td>
  </tr>
</table>

javascript html d3.js

asked by Juan Ortiz 27.01.2018 в 23:30

source

2 answers

Problems with polymorphism in java help me with this java code?

score 1 · Answer 1

The problem is that you are using text() that will replace the content of the selected item with the text that is passed. What you could do is use append to add a div or a container, and then the text in that element.

In d3, which seems to be what you use, it would be something like this:

var ganadores = ["Ganador 1", "Ganador 2", "Ganador 3"];

d3.select("#ganadores").append("div").text(ganadores[0]);
d3.select("#ganadores").append("div").text(ganadores[1]);
d3.select("#ganadores").append("div").text(ganadores[2]);

#ganadores div:nth-child(1) {
  text-align: center;
}

#ganadores div:nth-child(2),
#ganadores div:nth-child(3) {
  width: 50%;
  float: left;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>

<table id="listadeganadores" border="1" >
  <tr>
    <td colspan="5" align="center">RESULTADOS</td>
  </tr>
  <tr>
    <!--   en estos td van los resultados    -->
    <td id="ganadores"></td>
  </tr>
</table>

score 0 · Answer 2

The <tr> where you want it to be inserted will have to have a id . suppose it is declared like this

tr id="puestos">

So, if you use JQuery, it can be like this

var puesto1 = $("<td>"); 

var puesto2 = $("<td>");

var puesto3 = $("<td>");


$("#puestos").append(puesto1);

$("#puestos").append(puesto2);

$("#puestos").append(puesto3);

To add text to each one is done like this

puesto1.text("Primer lugar");