CODEWITHSUNDEEP
javascriptjqueryhtml
user1554967
user1554967

Reputation: 121

jquery change textarea to read write based on select

I have textareas in a form in which I want to change from readyonly to readwrite based on checkbox. In the below jquery I want the textarea object otherinjcomment which is set to readonly, set to readwrite when otherinj is checked and set to readonly when otherinj is unchecked.

$(function(){
    $("#otherinj").change(function{
        If($(this).is(':checked')){
            $("#otherinjcomment").prop('readonly',False)
        } 
        else{
            $("#otherinjcomment").prop('readonly',True)   
        }
    })
})

Here is the html

<div id="afterdesciption">
    <label for="otherinj">Other(Specify below)</label>
    <input type="checkbox" id="otherinj" name="otherinj" value="1">
</div>

<div>
    <textarea name="otherinjcomment" readonly="readonly"></textarea>
</div>

Upvotes: 0

Views: 196

Answers (2)

olchick
olchick

Reputation: 711

Your textarea has name "otherinjcomment", not id. You need this jquery code:

$("#otherinj").change(function(){
  if($(this).is(':checked')){
    $("[name=otherinjcomment]").prop('readonly',false)
  } 
  else{
    $("[name=otherinjcomment]").prop('readonly',true)   
  }
});

$("#otherinjcomment") to $("[name=otherinjcomment]")

Upvotes: 2

shakirthow
shakirthow

Reputation: 1366

To make it read only and then read write you can switch the disabled attribute accordingly here is a working example link and if you have several text fields, then use a class as the selector rather a ID

$("#otherinj").change(function(){
  if($(this).is(':checked')){
    $("#otherinjcomment").attr("disabled","disabled"); 
  } 
  else{
    $("#otherinjcomment").removeAttr('disabled')
  }
})

Upvotes: 2

Related Questions