Text input readonly attribute not recognized in IE7?

Question

I am setting readonly="readonly" (in other words, true) via javascript:

document.getElementById("my_id").setAttribute("readonly", "readonly");

This is having the intended effect (making the field no longer editable, but its contents are submitted with the form) in FF, Safari and Chrome, but not for IE7. In IE7 I can still modify the contents of the text input field.

I have tried setting ("readonly", "true") as well, which works in all three other browsers that I am testing, but which IE7 also ignores.

Does anyone have experience with trying to do this with IE7? I do not want to use the disabled attribute as I want the value within the text input field to be submitted with the form.

Answer 1

Did you try this?

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

Answer 2

try:

document.getElementById("my_Id").setAttribute("readOnly","readonly")

it is readOnly, O is capital!

Answer 3

<script type="text/javascript">

function blah(txt) {
   var text = document.getElementById(txt).value;
   if(text.length > 4 && document.getElementById('chk').checked == false) {

   // *********    NOT WORKING WITH IE   *************** //
   //document.getElementById("ta").setAttribute('readOnly','readonly');
   //document.getElementById("ta").readOnly="readOnly";
   // ******** ---   **********//

   //document.getElementById("ta").disabled = true;   //  for disable textArea
   document.getElementById("ta").blur(); // comment this when above line is uncommented or visa-versa
   document.getElementById('chkBox').style.display = "block";
   }
}

function unable() {
  // document.getElementById("ta").disabled = false; // to unable textArea -- uncomment when disabling is used or visa-versa
   document.getElementById('ta').focus();
   document.getElementById('chkBox').style.display = "none";
}

</script>


<textarea id="ta" onkeydown="blah('ta')" ></textarea>
<div id="chkBox" style="display:none"><label> Please check this to continue....</label><input type="checkbox" id="chk" onclick="unable()"></div>

Answer 4

Or try:

document.getElementById("my_id").setAttribute("readOnly", true);

Please note as stated by @TheVillageIdiot, the O in readOnly is UPPER CASE. This should work from IE7 to IE11.