TWIG选择的onChange使与参数

Question

我在控制器

/** 
    *@Route("/change-status/{user}/{status}", name="users_change_status") 
    * ... 
    **/ 
    public function changeUserStatus(User $user, string $status){ 
     ..... 
    } 

在树枝模板

PUT方法AJAX请求是有选择显示，并改变用户的状态

{% for user in users %} 
<select id="{{ user.id }}" onchange="changeUserStatus('{{ path('users_change_status', {'user': user.id, 'status': ???}) }}')"> 
    <option value="active" {% if user.status == 'active' %} selected {% endif %}>Active</option> 
     <option value="pending" {% if user.status == 'pending' %} selected {% endif %}>Pending</option> 
    <option value="inactive" {% if user.status == 'inactive' %} selected {% endif %}>Inactive</option> 
</select> 
{% endfor %} 

我想送PUT请在选择选项更改时使用用户标识和状态。这是JavaScript代码

function changeUserStatus($url) { 
     $.ajax({ 
      type: "PUT", 
      url: $url, 
      async: true, 
      data: { }, 
      success: function() { 
       console.log('success'); 
      } 
     }); 
    } 

问题：

如何发送所选选项值作为请求的URL参数？

Answer 1

从选择字段中删除onchange属性。

<select class="select-status" base-url="{{ path('admin_users_change_status', {'user': user.id, 'status': ''}) }}"> 
    <option value="active" {% if user.status == 'active' %} selected {% endif %}>Active</option> 
    <option value="pending" {% if user.status == 'pending' %} selected {% endif %}>Pending</option> 
    <option value="inactive" {% if user.status == 'inactive' %} selected {% endif %}>Inactive</option> 
</select> 

在选择字段上设置一个change事件侦听器。获取基础URL并附加选择字段值。

在您的changeUserStatus函数中，您可以删除data（因为没有传入数据）和async（因为它默认为true）。

$('.select-status').change(function() { 
    var url = $(this).attr('base-url') + $(this).val(); 

    changeUserStatus(url); 
}); 

function changeUserStatus(url) { 
    $.ajax({ 
     type: 'PUT', 
     url: url, 
     success: function() { 
      console.log('success'); 
     } 
    }); 
}