javascript - jQuery-复选框启用/禁用-使用数据库

我想实现问题的解决方案：yii2中的jQuery - checkbox enable/disable，只是反向并与DB结合使用。反向表示：我有一些复选框，如果选中了irep复选框，则应禁用所有其他复选框，否则应将其启用。所以我换了$("input.irep").attr("disabled", true);和$("input.irep").removeAttr("disabled");。

irep存储在数据库中（作为bool / tinyint值1），并且如果我打开表单，即使我要向其中添加'disabled' => $model->irep，也应该启用应该禁用的字段。如果我删除其他，则几乎可以，但是取消选中不会重新启用其他复选框。您能指出我正确的方向吗？谢谢。

形成：

$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]) ?>

最佳答案

使用.prop代替.attr参见here原因

仅当disabled是$model->irep的添加属性时，才添加1属性，该值无关紧要，该属性应该存在，或者该值中的1或0仅使用disabled没有任何效果。

那么为什么要在加载脚本的开始时调用enable_cb()呢？您正在将此函数用于#irep上的click事件，而this.checked函数内部的检查对页面加载没有影响。对函数的独立调用将使this指向window对象，而不是复选框。

并避免使用.click并更喜欢使用.on('click'进行事件委派。

您的代码应如下所示

$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 =>'']) ?>