Within a table, I have a column with a text box for users to edit the text as needed. The edited text is properly being saved using the onkeyup event. However, I want to hide the border of the text box after editing, so only the edited text is visible. If the user wants to edit the text again, they should be able to click on the text to make the text box visible again. I'm looking for a similar effect to this example without using jQuery: Textbox Effect. How can I achieve this?
Here is the code for the text box:
echo "<td ><input id={remark{$j}} type=\"text\" onkeyup=\"writeremark(this.id,{$data_set1['eid']},{$emprid});\" value=\"{$data_set1['remark']}\" /></td>";
onkeyup function
function writeremark(e,eid,emprid) {
var val=document.getElementById(e).value;
var dataString = 'eid='+eid +'&emprid='+emprid +'&val='+val ;
$.ajax({
type:"POST",
url: "updateremark.php",
data: dataString,
success: function(result){
}
});
}