Hola bueno este es mi prmer post espero me ayuden, bueno el problema es el siguiente:
al hacer clic en el texto que esta dentro de un <div></div> quiero que me salga una tabla con 3 columnas como la que muestro en la imagen pero quiero que se elimine e texto que puse, y que mitabla ocupe su lugar
En javascript
Código:
function crearTablaInput(idDiv, idInput){
var divcontenedor = document.getElementById(idDiv);
//Creo la tabla
var tabla = document.createElement('table');
tabla.border = '0';
//Creo la primera fila
var tr = document.createElement('tr');
//Creo la primera celda
var td = document.createElement('td');
//aqui va el textfield
//se puede crear un switch 0 mande crea input 1 crea combo 2cre texarea
td.innerHTML ="<input type='text' class='input1' value='"+divcontenedor.innerHTML+"' id='"+idInput+"' size='15' maxlength='20'>";
tr.appendChild(td); //Agrego la celda a la fila
//Creo la segunda celda
var td = document.createElement('td');
td.innerHTML = '<img src="img/check.png" width="16" height="16">';
tr.appendChild(td); //Agrego la celda a la fila
//Creo la tercera celda
var td = document.createElement('td');
td.innerHTML = '<img src="img/equis.png" width="16" height="16">';
tr.appendChild(td); //Agrego la celda a la fila
tabla.appendChild(tr); //Agrego la cuerpo de la tabla a la misma
//Agrego la tabla en algun lado de mi página
divcontenedor.appendChild(tabla);
}
en html
Código HTML:
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><div id="nombre" onclick="crearTablaInput(this.id, 'nombre')">Jose</div></td>
<td> </td>
</tr>
</table> Agradeceria si me ayudasen.