z10h22 z10h22 - 23 days ago 6
Ajax Question

Add doubleclick handler on table cell after response

I would like to add a doubleclick event handler to table cell AFTER the table was "downloaded" from a servlet and "inserted" by javascript.
I have a javascript cycle that iterate on a xml response to map datas ini table. Said that a cell can be

<td class='red' ></td>



I want to add a function on that cell, I've tried several solution, but none works.One is:

$(".red").on("dblclick",myfunction);


Help?

Update:
Table constructor ofter response received

function handleResponse(responseXML) {
var i;
var x=responseXML.getElementsByTagName("row");
var out="<table><tr><th >Description</th><th >State</th><th>Note</th></tr>";
for(i=0;i<x.length;i++){
out+="<tr>";
var Description = x[i].getElementsByTagName("Description")[0].childNodes[0].nodeValue;
var State = x[i].getElementsByTagName("State")[0].childNodes[0].nodeValue;
var note = x[i].getElementsByTagName("Note")[0].childNodes[0];
var note_text=" ";
if (!(typeof note === "undefined") && !(note=='null')) {
note_text=note.nodeValue;
}
out += "<td>"+Description+ "</td>";
if(State==0)
out+="<td class='white' ></td>";
else if(State==1)
out+="<td class='red' ></td>";
else if(State==2)
out+="<td class='yellow' ></td>";
else if(State==3)
out+="<td class='green' ></td>";

out+="<td>" + note_text + "</td></tr>";
}
var output = document.getElementById("mytable");
out+="</table>";
$().on("click",".red",update()); //here is the point
output.innerHTML=out;
}

Answer

Update:

Based on your comments you can try this:

When you print the td change the template a little:

out+="<td class='red' ondblclick='openModal()'></td>";

And then in your js file add something like this.

$(document).ready(function() {
    function openModal() {
      alert( "Double clicked." );
      // Or call your other function here...
    };
});

You can do it with several ways also, check here: http://www.w3schools.com/jsref/event_ondblclick.asp