如何重新启用多选选择器

Question

我正在尝试使用此引导选择选择器，其中可以选择多个值，默认情况下我希望它被禁用。因此，为了启用它，必须按下一个按钮。问题是按下按钮不会重新启用该特定字段，与之链接的其他字段可以正常工作。

无论如何代码不起作用如下任何帮助将不胜感激。

    <form method="post" action="{{route('updateuser')}}">
      @csrf
      <table class="table  table-bordered">
        <thead>
          <tr>
            <th scope="col">ID</th>
            <th scope="col">User Name</th>
            <th scope="col">Email</th>
            <th scope="col">Role</th>
            <th scope="col">Sites</th>
            <th scope="col">Created At</th>
            <th scope="col">Updated At</th>
            <th scope="col">Edit</th>
          </tr>
        </thead>
        @if(count($users)!=0)
        @foreach($users as $user)
        <tr>
          <td><input type='text' name="id" placeholder="User ID" value='{{ $user->id }}' readonly></td>
          <td><input type='text' name="name" placeholder="Name" value='{{ $user->name }}' disabled></td>
          <td><input type='text' name="email" placeholder="Email" value='{{ $user->email }}' disabled></td>
          <td><select name="role" disabled>
              <option>none</option>
              <option>Reporter</option>
              <option>Admin</option>
              <option>Super Admin</option>
            </select></td>
          <td><select class="selectpicker selectsite" multiple name="sitesSelected[]" disabled>
              <option selected> {{$site[0]->sitename}}
                < </option>
              <option> {{$site[1]->sitename}} </option>
              <option> {{$site[2]->sitename}} </option>
            </select></td>
          <td><input type='text' name="created_at" placeholder="created_at" value='{{ $user->created_at }}' readonly></td>
          <td><input type='text' name="updated_at" placeholder="updated_at" value='{{ $user->updated_at }}' readonly></td>
          <td><input type="button" name='edit' value='edit'>
            <input type="submit" name='save' value='save'>
            <button type="button" id="btnDelete" data-toggle="modal" data-target="#userModal" value="{{ $user->id }}">Delete</button>
          </td>
        </tr>
        @endforeach
        @endif
      </table>
      {{ $users->links() }}
    </form>

 <script type="text/javascript">
   $(document).ready(function(){
     $("form input[type=text]").prop("disabled",true);
     $("input[name=edit]").on("click",function(){
       $(this).closest("tr").find("input,select").prop("disabled",false);
                     
     })
   })
              
 </script>

从代码中可以看出，我构建了一个表格，其中每一行代表网站的一个用户。不工作的部分是名为“sitesSelected[]”的选定元素，当按下编辑按钮时它不会重新启用，但是当按下编辑按钮时，所有其他元素都会重新启用。

Answer 1

好吧，我对 Bootstrap 了解不多，但是由于选择元素中有多个属性，因此多重选择功能正在发挥作用。 （查看此链接https://www.w3schools.com/tags/att_select_multiple.asp 以更好地了解多重属性）。

因此，如果要启用或禁用它，只需删除或添加多个属性即可。下面的例子。

要删除元素的“禁用”属性：

$('select[name="role"]').removeAttr("disabled");

为元素添加多个属性：

$(".selectpicker selectsite").attr("multiple","true");

要删除元素的多个属性：

$(".selectpicker selectsite").attr("multiple","false");

您的问题有点令人困惑，但我已尽力而为，因为我也是新来的，而且我知道有人结束您的问题时的感受。无论如何，如果有疑问，请发表评论。