Question

我创建了管理页面，显示了数据库中的所有用户详细信息。该表使用Spring + Hibernate填充。我尝试选择选项菜单的值，但我不知道如何选择给定行的用户名。

稍后我想调用Controller来更改用户角色。

<div class="list">
    <table class="table-list">
        <tr>
            <th>Id</th>
            <th>Username</th>
            <th>Password</th>
            <th>Email</th>
            <th>Roles</th>
            <th>Change role</th>
        </tr>
        <c:forEach var="users" items="${users}">
            <tr class="userdetails">
                <td><c:out value="${users.id }" /></td>
                <td class="username"><c:out value="${users.username }" /></td>
                <td><c:out value="${users.password }" /></td>
                <td><c:out value="${users.email }" /></td>
                <c:forEach var="roles" items="${users.usersRoles }">
                    <td><c:out value="${roles.role }" /></td>
                </c:forEach>
                <td><select id="change-role"><c:forEach var='changeRole'
                            items='${roles}'>

                            <option value="${changeRole.role}"><c:out
                                    value='${changeRole.role}' /></option>

                        </c:forEach></select></td>
            </tr>
        </c:forEach>
    </table>
</div>

Answer 1

您可以使用HTML5数据属性来实现它，例如

<select id="change-role">
   <c:forEach var='changeRole' items='${roles}'>
      <option value="${changeRole.role}" data-userid="${users.id }" data-username="${users.username }">
       <c:out value='${changeRole.role}' />
       </option>
   </c:forEach>
</select>

在您选择的更改事件中使用jquery / javascript代码来获取所选行的用户名和用户ID

$('#change-role').change(function(e){
  var userid=$(this).find('option:selected').data('userid');
  var username=$(this).find('option:selected').data('username');

  //You code to use Userid and Username

 });

Answer 2

抱歉，我知道出了什么问题。设置必须唯一的ID。愚蠢的我！一切正常。

jQuery从行onChange选择数据到选项菜单

2 个答案: