I have several tables with ajax loaded content. Sometimes I have to change the content of a td
manually before exporting it to PDF, so I thought best way would be to create a trigger for each td
on double-click using jQuery's .dblclick()
. The trigger would open a modal with an input
field and change the text of the double-clicked td
when submitting the modal.
This works, but when I change the content of a second, third, etc td
, each previously clicked td
gets the new value too.
Check my fiddle: https://jsfiddle.net/fvoufq07/
My code so far:
$( ".sitename" ).dblclick( function() {
var sitename = $( this );
$( "#msgBox .modal-title" ).html("Change sitename");
$( "#msgBox .modal-body" ).html("Enter new sitename:<input type=\"text\" id=\"new_sitename\">");
$( "#msgBox" ).modal("show");
$( "#msgBox button.btn" ).click( function() {
sitename.text( $( "#new_sitename" ).val().trim() );
});
});