Funcion que muestra una descripcion larga sin saltos de linea
Publicado por Saltos de linea que no se muestran (3 intervenciones) el 22/10/2020 09:38:47
Buenos días. Soy nueva en Java Script. Tengo una tabla que se carga desde una base de datos sql.
La tabla es un poco larga no mucho. La he configurado para que muestre solo 10 líneas y en otra tabla adicional debajo e muestre la descripción de cada linea en que sitúo el raton, esto con el evento onmouseover, hasta aquí todo bien. Lo que hago es que la descripción larga la he colocado en una columna oculta y cuando el raton se posa sobre una linea, el contenido (la descripción larga) de esa columna oculta, se muestra en la tabla de abajo.
El problema lo tengo en que no muestra el salto de linea. He probado varias cosas... os dejo el código a ver si pueden ayudarme. De antemano, gracias.
La tabla es un poco larga no mucho. La he configurado para que muestre solo 10 líneas y en otra tabla adicional debajo e muestre la descripción de cada linea en que sitúo el raton, esto con el evento onmouseover, hasta aquí todo bien. Lo que hago es que la descripción larga la he colocado en una columna oculta y cuando el raton se posa sobre una linea, el contenido (la descripción larga) de esa columna oculta, se muestra en la tabla de abajo.
El problema lo tengo en que no muestra el salto de linea. He probado varias cosas... os dejo el código a ver si pueden ayudarme. De antemano, gracias.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
//html<?php
$consulta = "SELECT id_parameters, par, rank, manufacturing, value, short_description, description FROM parameters WHERE nivell = 'S'";
$resultado = mysqli_query($db, $consulta);
?>
<body>
<div id="scroll_tabla">
<table id="tablaParametros" align = "center">
<thead>
<td style="display:none"></td>
<td style="display:none"></td>
<td>Par</td>
<td>Rang</td>
<td>Fab.</td>
<td>Valor</td>
<td>Nou Valor</td>
<td>Descripció Breu</td>
<td style="display:none"></td>
</thead>
<tbody>
<?php
while($fila = mysqli_fetch_assoc($resultado))
{?>
<tr>
<td style="display:none"><?php echo ($fila['id_parameters']);?></td>
<td style="display:none"><?php echo ("ST");?></td>
<td onmouseover="ver_id()"><?php echo ($fila['par']);?></td>
<td onmouseover="ver_id()"><?php echo ($fila['rank']);?></td>
<td onmouseover="ver_id()"><?php echo($fila['manufacturing']);?></td>
<td onmouseover="ver_id()"><?php echo ($fila['par']);?></td>
<td onmouseover="ver_id()"><span class="editar">Editar</span></td>
<td align="left" onmouseover="ver_id()"><?php echo ($fila['short_description']);?></td>
<td style="display:none"><?php echo ($fila['description']);?></td>
</tr>
<?php
}?>
</tbody>
</table>
</div>
<div id="TablaD">
<table>
<thead>
<td>Descripción</td>
</thead>
</div>
<table id="tabla"> //Aqui es donde muestra la descripción larga con la función "ver_id()"
<tr>
<td id="tdDesc"></td>
</tr>
</table>
<p></p>
</div>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
//Funcion "ver_id()"function ver_id() {
if (!document.getElementsByTagName || !document.createTextNode) return;
var rows = document.getElementById('tablaParametros').getElementsByTagName('tr');
for (i = 0; i < rows.length; i++) {
rows[i].onmouseover = function() {
var result = this.getElementsByTagName('td')[8].innerHTML;
//result = result.replace(/\r?\n/g, "'+\\n+'"); //no funcionaresult = result.replace(/\r?\n/g, "<br>"); //me muestra en el texto las etiquetas <br>
//BORRA LOS DATOS DE LA TABLA que contiene la descripcionvar row = document.getElementById("");
document.getElementById("tabla").deleteRow(row);
var tbl = document.getElementById("tabla");
var tblBody = document.createElement("tbody");
var fila = document.createElement("tr");
var celda = document.createElement("td");
textoCelda = document.createTextNode(result);
celda.appendChild(textoCelda);
fila.appendChild(celda);
tblBody.appendChild(fila);
tbl.appendChild(tblBody);
tbl.setAttribute("border", "2");
} }}Valora esta pregunta
0
