CODEWITHSUNDEEP
jqueryinternet-explorer
Daniel Gustafsson
Daniel Gustafsson

Reputation: 1827

jQuery change contenteditable on div in IE8

I have a editable div-tag. Then i have a checkbox and i check or uncheck it i want the div-tag to toggle between editable and not editable. My code workes in chrome and ff but not in IE8. 

 if ($("#makeedit").prop("checked"))
{
    $("#RiskScoreTextArea").contenteditable("true");
    //$("#RiskScoreTextArea").prop("contenteditable", true);
} else {
    //$("#RiskScoreTextArea").prop("contenteditable", false);
    $("#RiskScoreTextArea").contenteditable("false");

}

}

as you can se i have tried many different variations. but it doesn't work :(

Upvotes: 0

Views: 301

Answers (2)

Nilesh Thakkar
Nilesh Thakkar

Reputation: 2895

You might want to try below code:

JavaScript:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

    <script type="text/javascript">
      $(document).ready(function(){
          $('#makeedit').on('click',function(){

            if(!$(this).is(':checked'))
                $('#RiskScoreTextArea').removeAttr('contenteditable');
            else
                $('#RiskScoreTextArea').attr({ contenteditable: 'true' });
          });
        });
    </script>

HTML:

 <input type="checkbox" id="makeedit" />
    <div id="RiskScoreTextArea" style="width:100;height:100;border:1px;border-color:red;border-bottom-width: 1px;border-radius: 1px;border-style: dotted;">
      this is div
    </div>

Upvotes: 1

Johan
Johan

Reputation: 35223

Try toggling the attribute manually:

if (!$('#makeedit').prop('checked'))
    $('#RiskScoreTextArea').removeAttr('contenteditable');
else
    $('#RiskScoreTextArea').attr({ contenteditable: 'true' });

http://jsfiddle.net/RY7q9/show/

Upvotes: 0

Related Questions