Question

I have a “Change” button that makes a form active or locked when clicked. Though the button only works when I click “change”, and then doesn’t :/

<div class="holder">
  <div class="question active">Q1<input id="one" type="text">
<div class="button passive"><input type="button" value="Change" id="changeone"></div></div></div>

$('input#changeone').click(function() {
    if( $('#one').attr('readonly', true) ) {

      $("#changeone").attr('value', 'Save');
      $('div.button').parent().css('background-color', 'red');
      $('#one').attr('readonly', false);

    } else {

      $("#changeone").attr('value', 'Change');
      $('div.button').parent().css('background-color', 'green');
      $('#one').attr('readonly', true);

    }

})

THANKS 🙂

**corrected indentation

THANK YOU ALL! You all responded so quickly and I thank everyone for their time 🙂

Answer 1

You are setting readonly to true in your if, rather than getting it. You need to use .attr(attributeName) to get the value.

$('input#changeone').click(function() {
    if( $('#one').attr('readonly') == 'readonly') {
        ...
    } else {
        ...
    }
});