0

I would like to implement the solution of the question: jQuery - checkbox enable/disable in yii2, just reversed and combined with DB. Reversed means: I have some checkboxes and if the irep checkbox is checked, all the other checkboxes should be disabled, else they should be enabled. So I have swapped $("input.irep").attr("disabled", true); and $("input.irep").removeAttr("disabled");.

irep is stored in a db (as bool/tinyint value 1), and if I open the form, the fields that supposed to be disabled, are still going to be enabled, even if I'm adding 'disabled' => $model->irep to it. If I remove the else it's almost OK, but unchecking doesn't re-enable the other checkboxes. Can you please point me to the right direction? Thank you.

Form:

$script = <<< JS

$(function() {
  enable_cb();
  $("#irep").click(enable_cb);
});

function enable_cb() {
  if (this.checked) {
    $("input.irep").attr("disabled", true);
  } else {
    $("input.irep").removeAttr("disabled");
  }
}

JS;
$this->registerJs($script);

<?= $form->field($model, 'irep')->checkbox(['id' => 'irep']) ?>
<?= $form->field($model, 'intfg')->checkbox(['class' => ['irep'], 'disabled' => $model->irep]) ?>
<?= $form->field($model, 'extfg')->checkbox(['class' => ['irep'], 'disabled' => $model->irep]) ?>
Muhammad Omer Aslam
  • 22,976
  • 9
  • 42
  • 68
user2511599
  • 796
  • 1
  • 13
  • 38
  • `check` and `un-check` a checkbox is a different thing and disabling the input is another, add your code to show what you are actually doing, you dont have to do anything for this other than setting the check boxes with the correct value by using `activeCheckboxList` – Muhammad Omer Aslam Oct 15 '19 at 13:26
  • I don't want the other checkboxes to be checked or unchecked, jut to be enabled or disabled. – user2511599 Oct 16 '19 at 09:42

1 Answers1

1

Use .prop instead of .attr see here why

Add the disabled attribute only if the $model->irep is 1 the way you are adding the attribute the value wont matter, either the attribute should be there or it should not the 1 or 0 in the value will have no effect using disabled only would have been same.

Then why are you calling the enable_cb() on the start of the script on load, you are using this function for the click event on #irep the check inside the function which is this.checked has no effect as on the page load with the standalone call to the function will have this pointing to the window object instead of the checkbox.

And avoid using .click and prefer .on('click' instead for event delegation.

your code should look like below

$script = <<< JS
$(function(){
    $("#irep").on('click',enable_cb);
});

function enable_cb() {
  if (this.checked) {
    $(".irep").prop("disabled", true);
  } else {
    $(".irep").prop("disabled",false);
  }
}
JS;

$this->registerJs($script);

//add disabled attribute
$disabled = $model->irep ? 'disabled' : '';

<?= $form->field($model, 'irep')->checkbox(['id' => 'irep']) ?>
<?= $form->field($model, 'intfg')->checkbox(['class' => ['irep'], $disabled=>'']) ?>
<?= $form->field($model, 'extfg')->checkbox(['class' => ['irep'], $disabled =>'']) ?>
Muhammad Omer Aslam
  • 22,976
  • 9
  • 42
  • 68
  • It happens the same: for a second `intfg` and `extfg` are disabled, but after that they are switched back to be enabled automatically. – user2511599 Oct 17 '19 at 05:55
  • there must be some other script attached to it i tested it in a separate view with only the above code and it works correctly, have you used the same code and no extra code from the answer. please add your complete view @user2511599 – Muhammad Omer Aslam Oct 17 '19 at 07:44
  • You have removed `enable_cb();` ! :) now I see. now it's working. Thank you very much! – user2511599 Oct 17 '19 at 11:02
  • It's working also like this: `'disabled' => $model->irep` so you don't need `$disabled = $model->irep ? 'disabled' : '';` – user2511599 Oct 17 '19 at 11:39
  • you **should not** do `'disabled' => $model->irep` this is logically wrong as i already explained in the answer please read the answer @user2511599 – Muhammad Omer Aslam Oct 17 '19 at 20:03