Laravel 刀片 - 如何在动态模式上将“选定”添加到选项表单菜单答案

【问题标题】：Laravel blade - How to add "selected" to option form menu on a dynamic modalLaravel 刀片 - 如何在动态模式上将“选定”添加到选项表单菜单
【发布时间】：2020-04-07 05:03:56
【问题描述】：

我正在使用模态按钮上的 data- 属性向我的模态发送数据。

在我的“编辑”模式中，我有一个带有选择菜单的表单，如果已经选择了一个选项，我需要在该菜单中返回。

我可以像这样使用刀片正常地做到这一点......

@foreach($companyUsers as $manager)
   <option id="manager-option" value="{{ $manager->id }}" {{ $manager->id == $user->manager_id ? 'selected' : '' }}> {{ $manager->userFormatted() }}</option>
@endforeach

但是我需要通过js动态插入$user->manager_id。所以这是我的js

$('#editUser').on('show.bs.modal', function (event) {
  var button = $(event.relatedTarget) // Button that triggered the modal
  var user = button.data('user')
  var userManager = button.data('user-manager')

  var modal = $(this)
  modal.find('.k-form').attr('action', '/usermanagement/' + user)
  modal.find('#manager-option').attr('selected', userManager) // here i'm stuck
})

所以在我有modal.find('.manager-option').attr(userManager) 的地方，我需要以某种方式将刀片文件中的$user->manager_id 替换为我的js 中的变量userManager

【问题讨论】：

您正在使用$('.manager-option')，但我在您的代码中没有看到class="manager-option"。另请注意，您正在循环中的元素上设置id="manager-option"。 ids 是独一无二的；你不能这样做。如果您尝试使用$('#manager-option')，它不会选择您所期望的。
哦，类的错误应该是#manager-option。是的，我知道它需要是独一无二的，但这不是我要解决的问题。
除了有点相关。如果您离开id="manager-option，所有<option> 元素将具有相同的ID，并且您正在使用modal.find('#manager-option')，它将始终以最后一个<option> 为目标。此外，.attr('selected') 期望 true/false 作为第二个参数，而不是 userManager 的字符串。
是的，它是相关的，我理解并且可以解决这个问题。我的主要问题是如何在刀片文件中使用 userManager 变量而不是 $user->manager_id ？我需要一种不同的方法来做到这一点 {{ $manager->id == $user->manager_id ？ '选中' : '' }}
明白了。您必须查询它：modal.find('.manager-option[value=' + userManager + ']').attr('selected', true)（或类似的，例如将<select> 的值设置为userManager 等）

标签： jquery laravel laravel-blade

【解决方案1】：

能够通过@Tim Lewis 的建议解决此问题。

刀片：

@foreach($companyUsers as $manager)
    <option class="manager-option-{{ $manager->id }}" value="{{ $manager->id }}"> {{ $manager->userFormatted() }}</option>
@endforeach

JS：

$('#editUser').on('show.bs.modal', function (event) {
    var button = $(event.relatedTarget)
    var user = button.data('user')
    var userName = button.data('user-name')
    var userManager = button.data('user-manager')

    var modal = $(this)
    modal.find('.k-form').attr('action', '/usermanagement/' + user)
    modal.find('.modal-title').text('Edit: ' + userName)
    modal.find('.manager-option-' + userManager).attr('selected', true)
})

【讨论】：