nicht angemeldet
Hallo zusammen,
in folgendem Javascript sollte es möglich sein, nach dem hinzufügen einer neuer Zeile diese durch einen Klick darauf zu editieren.
Wunderbar funktioniert dies in dem Firefox2.
Im Internetexplorer ist das editieren und speichern möglich. Jedoch kann danach der Text nicht mehr editiert werden - was eigentlich gehen sollte.
Im Firefox 3 funktioniert das Speichern überhaupt nicht. (vermutlich geht das wiederholte (td).innerHTML nicht) ?
Irgendwie bin ich hier überfragt was hier falsch ist.
Vielleicht kann mir jemand weiterhelfen?
Thonix
Der code:
<html>
<head>
<script type="text/javascript">
function insRow(){
// Add row to the end
var table=document.getElementById('myTable').insertRow(-1);
// Add cells
var y=table.insertCell(0);
var z=table.insertCell(1);
// Generate unique IDs
y_id = uid();
z_id = uid();
// Add text to the cells
y.innerHTML="<span id='"+y_id+"' onclick=editCelltoText('"+y_id+"')> NEW CELL1</span>";
z.innerHTML="<span id='"+z_id+"' onclick=editCelltoText('"+z_id+"')> NEW CELL2</span>";
//y.onclick = "editCelltoText('"+y_id+"')";
//z.onclick = "editCelltoText('"+z_id+"')";
}
// Function to make the cell editable with a textbox
function editCelltoText(id){
// Add shortcut to the cell
cell = document.getElementById(id);
// Cell text
// Textfield
celltext = "<input type='text' size='50' id='xx_"+id+"_text' value='"+cell.innerHTML+"'>";
// OK Button
celltext += "<input type='button' value='OK' onclick=editTexttoCell('"+id+"')>";
// Set cell text
cell.innerHTML = celltext;
// Disable onclick method
cell.attributes["onclick"].value = "";
}
// Function move from the textbox to a normal table cell
function editTexttoCell(id){
// Add shortcut to the cell
cell = document.getElementById(id);
// Cell text
// Textfield
celltext = document.getElementById("xx_"+id+"_text").value;
// Set cell text
//cell.innerHTML = "";
cell.bgColor = "#FFCCCC";
cell.innerHTML = celltext;
// Set onclick method
cell.attributes["onclick"].value = "editCelltoText('"+id+"')";
cell.onclick = "editCelltoText('"+id+"')";
}
var uid = (
function() {
var id=0;
return function(){
return id++;
};
}
)();
</script>
</head>
<body>
<table id="myTable" border="1">
<tr><td>Table Header 1</td><td>Table Header 2</td></tr>
</table>
<br />
<input type="button" onclick="insRow()" value="Insert row for change">
</body>
</html>