javascript - 模态 Bootstrap 显示在所有窗口中，这是同一封电子邮件

Question

嗨，我不知道该怎么做。我在面板管理中显示用户，其工作正常，甚至在按钮上显示 Angular 色。下一步我想做的是单击并显示模式 Bootstrap ，在这里我遇到了问题，我不知道当我这样做时如何将 $user->email 传递给标题:

<form action="{{route('change')}}" method="post" role="form" class="form-horizontal">	
       	{{ csrf_field() }} 
<div id="myModal" class="modal fade" name="{{$user->email}}">

    <div class="modal-dialog">

        <div class="modal-content">

            <div class="modal-header">

                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>

                <h4 class="modal-title">Zmiana roli użytkownika o adresie E-mail:</br>
                 	<b>{{$user->email}}</b>
                </h4>

            </div>

            <div class="modal-body">

                <p>Wybierz rolę dla użytkownika</p> 
           
          	
			<select name="{{$user->email}}">
				<option name="role_user">User</option>
				<option name="role_moderator">Moderator</option>
				<option name="role_admin">Admin</option>
			</select>
			
		   
            </div>
            <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Zamknij</button>
            <input  name="" type="submit" class="btn btn-primary" value="Zmień rolę"></input>
            </div>    
        </div>
    </div>
</div>
</form>	

我在屏幕上有一些想法，我想在这个模式中改变 Angular 色。 在标题模式中显示地址电子邮件，但它仅显示在表格的最后。 所以也许我必须将此窗口命名为 {{$user->email}} 因为我想基于电子邮件更改 Angular 色，因为它在数据库中是唯一的。我在复选框上更改了 Angular 色，但我尝试以良好的 View 做得更好。我想做一些像管理员显示所有用户和他们附近的按钮，他可以单击按钮并获取信息用户->电子邮件并选择。此选择显示用户 Angular 色，管理员可以更改并保存它。它显示在所有用户窗口中表用户的最后一行，我的意思是我得到了最后一个具有管理员 Angular 色的用户管理员，因此它显示在所有窗口管理详细信息中。

更新 1: 我确实喜欢这样:

<td><button class="btn btn-info wielkoscPrzycisku" name="{{$user->email}}" id="{{$user->email}}" data-toggle="modal" data-target="#myModal" href="#myModal" value="" data-user-email="{{$user->email}}">{{$roles->name}}</button></td>

它的按钮来自“我想要获取数据”。 下一个jquery:

jQuery('#open-modal-button').click(function () {
            user_email = jQuery(this).data('user-email');
            jQuery('modal-title-email').html(user_email);
            
        });	

下一个跨度按钮:

<span id="modal-title-email"></span>

Answer 1

我不知道你的其余代码到底说什么，所以我有点即兴发挥，但你可以做的是在你的表行上使用 jQuery 和 html 数据属性，并在循环访问你的用户数组时填充它并使用 jquery 轻松获取一些内容。

     
     
     <h4 class="modal-title">Zmiana roli użytkownika o adresie E-mail:</br>
        <span id="modal-title-email"></span>
     </h4>
     
     <tr>
      <td>Name</td>
      <td>Email</td>
      <td><button data-user-name="John">Admin</button></td>
     </tr>
     
     <script>
        jQuery('#open-modal-button').click(function () {
            username = jQuery(this).data('user-name');
            jQuery('#modal-title-email').html(username);
        });
     </script>

当单击打开模式的按钮时，您可以从 data 属性中获取数据，然后使用 jQuery html 函数将其添加到模式标题中。