javascript - Change an TextBoxFor readonly property on whether a checkbox is checked or not -
i'm trying change textboxfor readonly property on whether checkbox checked or not. have read other posts answers don't seem work me.. 1 please point out miss in code below.
<div class="editor-label"> @html.labelfor(m => m.addfitbit) </div> <div class="editor-field" id="checkbox"> @html.checkboxfor(m => m.addfitbit) </div> <div class="editor-label"> @html.labelfor(m => m.mail) </div> <div class="editor-field" id="usermail"> @html.textboxfor(m => m.mail) </div> <br /> <input class="submit" type="submit" value="@langresources.create" /> <button onclick="history.back(); return false;">@langresources.btncancel</button> </div> </article> } @html.validationsummary(true, langresources.screenaddgeneralerror) <script type="text/javascript"> $(function() { $('#checkbox').change(function () { if ($(this).is(':checked')) { $('#usermail').attr('readonly'); } else { $('#usermail').removeattr('readonly'); } }); }); </script>
you target div
contains checkbox, indeed doesn't trigger change
events. target checkbox inside div
this.
$(function() { $('#checkbox input[type="checkbox"]').change(function () { $('#usermail input[type="text"]').prop('readonly', $(this).is(':checked')); }); });
also, corrected , simplified code using prop
instead of attr
. attributes should mean initial value of given property, it's better practice change corresponding element property instead.
for details using prop
, see the documentation (based on @liam's comment).
Comments
Post a Comment