Mijn functie werkt alleen als je de column aanklikt die permanent in de tabel is geplaatst
Zodra je een gecreate column aanklikt gebeurt er niks terwijl ook die column het event zou moeten triggeren.
De jquery javascript functie zou alle DOM elementen met een "clickable" class erin moeten herkennen als trigger maar dat doet hij alleen bij de row die er standaart in is geplaatst.
De gecreate rows die er precies hetzelfde uit zien triggeren de functie niet.
Wie kan mij helpen, met voorbaad dank!
De HTML:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="jquery-1.11.3.min.js"></script>
</head>
<body>
<table>
<thead>
<tr>
<th> Datum: </th>
<th> Gewicht: </th>
<th> Middel: </th>
<th> Heup: </th>
</tr>
</thead>
<tbody id="table" >
<tr id="row0"> <!--- rows --->
<td id="img0" class="clickable"> <img src="cancel.jpg" width="15" height="15" ></td>
</tr>
<!--- hierin komt de javascript -->
</tbody>
</table>
[/table]
</body>
</html>
De Javascript
<script type="text/javascript" >
$('.clickable').click(function() {
//zoek het id van tbody van de table
var parent = document.getElementById("table");
// niewe row tr
var NewRow = document.createElement("tr");
// append row aan tbody
parent.appendChild(NewRow);
// niewe column
var Cancel = document.createElement("td");
// append column cancel aan row newrow
NewRow.appendChild(Cancel);
// set cancel attributes
Cancel.setAttribute("id","img1;");
Cancel.setAttribute("class","clickable");
//create imgage
var image = new Image();
//append image aan column cancel
Cancel.appendChild(image);
//set image atributes
image.src = 'cancel.jpg';
image.height= '15';
image.width= '15';
//image.setAttribute("id", "clickable_1;");
//image.setAttribute("class", "clickable");
});
</script>
