CODEWITHSUNDEEP
javascripttextboxreadonly
Harry Joy
Harry Joy

Reputation: 59660

Make text box editable using JavaScript

I've a textbox with readonly="readonly" that means I can not edit it. But what I want is to make this textbox editable when user double clicks on it.

What I've tried yet is:

<input size="10" readonly="readonly" ondblclick="setEditable(this)"/>

and in JavaScript:

 function setEditable(i){
     i.readonly = false;
 }

But this does not worked. So how can I make a textbox editable, which is readonly, when user double clicks on it?

Upvotes: 1

Views: 38009

Answers (3)

Shrikant Patil
Shrikant Patil

Reputation: 1

To make text field editable

document.getElementById("TextFieldId").readOnly=true;

To make text field Uneditable

document.getElementById("TextFieldId").readOnly=false;

Upvotes: 0

Sarfraz
Sarfraz

Reputation: 382696

Update:

To make it readonly again:

var el = document.getElementById('txt');
el.onblur = function(){
  this.setAttribute('readonly');
};

You can do this:

<input size="10" readonly="readonly" id="txt" />

JS:

var el = document.getElementById('txt');
el.ondblclick = function(){
  this.removeAttribute('readonly');
};

Upvotes: 6

Shaun Hare
Shaun Hare

Reputation: 3871

as above pure javascript example by sarfraz try to make your javascript unobtrusive much better practice

Also as a lot of people do if you have jquery on page now you can use that to do same

In jquery

$('#txt').removeAttr("readonly");

Upvotes: 0

Related Questions