需要动态复选框值来更改选择框的状态答案

【问题标题】：Need dynamic checkbox value to change state of select box需要动态复选框值来更改选择框的状态
【发布时间】：2017-02-01 14:00:06
【问题描述】：

我有一个涉及 laravel 和 jQuery 的问题。

我有一个表单，它有一个使用wenzhixin/multiple-select jQuery 插件的多选框。

<script>
    $('#multiselect').multipleSelect({
      placeholder: "Select Landing Pages",
      filter: true
    });
</script>

该插件的启用/禁用状态由复选框的 :checked/:unchecked 属性决定：

<script>
  $("#toggle").click(function() {
    if ($(this).is(":checked")) {
      $('#multiselect').multipleSelect("disable");
    } else {
      $('#multiselect').multipleSelect("enable");  
    }
  });
</script>

最终我需要做的是在加载页面/表单时，需要根据复选框的初始值启用/禁用选择框：

<select multiple="multiple" id="multiselect" name="landings[]" {{ ($post->global == "1") ? "disabled='disabled'" : '' }}>
          @foreach($landings as $landing)
            <option {{ in_array($landing->id, $post->landings()->select('post_landing.*')->lists('landing_id')->all()) ? 'selected' : '' }} value="{{ $landing->id }}">
              {{ $landing->title }}
            </option>
          @endforeach
        </select>
<label style="display: inline-block; font-size: .7em;">Global Post: </label>
          {!! Form::hidden('global', 0) !!}
          {!! Form::checkbox('global', 1, $post->global, ['id' => 'toggle']) !!}

这行得通。现在，假设 $post->global 的值为“1”（并且该框已选中）：如果我想取消选中它，则在选择框中选择一些选项，然后通过 POST 提交表单，值不发送选择框。虽然，在我的 POST 请求中，我可以看到 $post->global 值被正确发送（global => "0"）......但就像我说的，请求没有显示选择值数组。

在相反的情况下，一切都按预期工作：如果 $post->global 的初始值为“0”（并且该框未选中），我可以将复选框设置为“选中”并提交表单，然后$post-global 的请求是“1”。同样，我也可以不选中该框并选择一些值，然后请求与值数组一起发送。我相信问题就在这里：

 <select multiple="multiple" id="multiselect" name="landings[]" {{ ($post->global == "1") ? "disabled='disabled'" : '' }}>

但是如果这不起作用，我如何根据我的复选框的值将我的选择框的初始状态设置为禁用/启用？

这是一个小提琴：https://jsfiddle.net/o95nhfaw/1/

【问题讨论】：

代替disabled 改为readonly。 disabled输入不会提交数据。

标签： jquery forms post

【解决方案1】：

我想通了。我只是在我的 if 语句中添加了一行 js，如果复选框从初始值更改，则删除 disabled 属性：

$("#toggle").click(function() {
    if ($(this).is(":checked")) {
      $('#multiselect').multipleSelect("disable");
    } else {
      $('#multiselect').multipleSelect("enable");
      $('#multiselect').removeAttr('disabled');
    }
  });

谢谢！

【讨论】：