title: how to show and hide textbox-border
body: <p>In table I have 1 column in which text-box is given so that user can edit text in that as per their need ,edited text is getting saved <code>onkeyup</code> properly but i want to hide text-box border ,or i can say after editing text text-box should not be visible ,only the edited text should be visible ,and if user again wants to edit than user should be able to see that text-box when user click on text again,something like this <a href="http://www.unleashed-technologies.com/blog/2010/01/13/jquery-javascript-easy-edit-place-input-boxes-and-select-boxes" rel="nofollow">I want textbox effect like this</a>,and i don't want to use jquery,how can i do this </p>
  
  <p>here is my code for textbox</p>
  
  <pre><code>echo "&lt;td &gt;&lt;input id={remark{$j}}  type=\"text\"  onkeyup=\"writeremark(this.id,{$data_set1['eid']},{$emprid});\" value=\"{$data_set1['remark']}\" /&gt;&lt;/td&gt;";
  </code></pre>
  
  <h3>onkeyup function</h3>
  
  <pre><code>function writeremark(e,eid,emprid) {
      var val=document.getElementById(e).value;
      var dataString = 'eid='+eid +'&amp;emprid='+emprid +'&amp;val='+val ;
      $.ajax({
          type:"POST",
          url: "updateremark.php",
          data: dataString,
          success: function(result){
        }
      });
  }
  </code></pre>