0

estoy trabajando con bootstrap y php y quiero hacer un delete con un modal pero no se como pasarle el id a ese modal

boton normal para eliminar sin modal:

<a href="users/delete_user.php?id=<?php echo $filas['id'] ?>" class="btn btn-danger">
    <i class="fa fa-trash-o" aria-hidden="true"></i>
</a>

Este es el boton con el que abro el modal

<a type="button" class="btn btn-danger" data-toggle="modal" data-target="#exampleModal">
    <i class="fa fa-trash-o"></i>
</a>

Modal

<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
    <div class="modal-content">
        <div class="modal-header">
            <h5 class="modal-title" id="exampleModalLabel">Delete</h5>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
        <div class="modal-body">
            <b>Are you sure to delete this user?</b>
            <?php echo $filas['id'] ?>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
            <a href="users/delete_user.php?id=<?php echo $filas['id'] ?>" class="btn btn-danger">
                <i class="fa fa-trash-o" aria-hidden="true"></i>
            </a>
        </div>
    </div>
</div>
</div>

Si es necesario implementar js no importa

2
  • Luis en el boton modal debes pasarle el id del usuario y recibirlo en el modal para que te funcione.
    – Juanzu
    el 5 may. 2020 a las 16:37
  • como seria? explícame porfa
    – Luis
    el 5 may. 2020 a las 16:39

2 respuestas 2

1

te dejo un ejemplo de como lo hago desde laravel y tu lo organizas:

Boton para abrir modal de eliminar

en el data-target va el nombre que identificas el modal

  <a data-target="#modal-delete-{{$product->id}}" data-toggle="modal" href="" class="btn btn-danger btn-xs"><i class="fa fa-trash"></i> Eliminar </a>

debe incluir el archivo donde esta el modal, si esta en el mismo archivo del boton obvias el siguiente codigo

@include('admin.producteliminar')

despues en el modal eliminar tienes que crear un action con el metodo post y pasarle el id del dato a eliminar, ademas en el id va el nombre del modal que lo identifico en el boton eliminar. id="modal-delete-

<div class="modal fade modal-slide-in-right" aria-hidden="true" role="dialog" tabindex="-1"
    id="modal-delete-{{$product->id}}">

    <form method="post" action="{!! action('ProductController@destroy',['id' => $product->id]) !!}">
        {{csrf_field()}}
        <input type="hidden" name="_method" value="DELETE">

        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header btn-danger">
                    <button type="button" class="close" data-dismiss="modal" aria-label="close">
                        <span aria-hidden="true">x</span>
                    </button>
                    <h4 class="modal-title">Eliminar Producto</h4>
                </div>
                <div class="modal-body">
                    <p>Confirme si desea eliminar el Producto</p>
                </div>
                <div class="modal-footer" style="background-color:#E7E7E7">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Cancelar</button>
                    <button type="submit" class="btn btn-danger">Eliminar</button>

                </div>
            </div>
        </div>

    </form>

</div>
1
  • ya he tratado poniendo el id en el data target pero no me abre el modal cuando hago eso
    – Luis
    el 5 may. 2020 a las 16:44
1

para poder realizar el siguiente ejemplo se recolienda utiliza javascript dentro de botón tiene que colocar los datos del usuarios con las siguiente código data-id="" dentro tiene que colocar los datos

<button class="massdelete-modal btn btn-danger"
    data-id="{{ $lists->ida}}"
    data-nombre="{{ $lists->nombrea marcus feliz }}">Eliminar</button>

en el codigo javascript

que me tome la informacion de data-id y me lo escriba el campo con el id=id_mass

$('#id_mass').val($(this).data('id'));

$('.modal-descripcion').text('Eliminar los datos');

$(document).on('click', '.massdelete-modal', function() {
			
   $('#id_mass').val($(this).data('id'));
   $('.modal-descripcion').text('Eliminar los datos');
   $('#msdelete').text('¿Seguro que quieres borrar los datos?'+$(this).data('id'));
			
   $('#massModal').modal('show');
	
		});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet"/>

<button class="massdelete-modal btn btn-danger"
data-id="{{ $lists->id wwwwwwww}}"
data-nombre="{{ $lists->nombre}}"
>Eliminar</button>

<button class="massdelete-modal btn btn-danger"
data-id="{{ $lists->ida}}"
data-nombre="{{ $lists->nombrea marcus feliz }}"
>Eliminar</button>

<button class="massdelete-modal btn btn-danger"
data-id="{{ $lists->ids aaaaa}}"
data-nombre="{{ $lists->nombres aaaaaa}}"
>Eliminar</button>


<div id="massModal" class="modal fade" role="dialog">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal">&times;</button>
					<h4 class="modal-descripcion"></h4>
				</div>
				<div class="modal-body">
					<h3 class="text-center" id="msdelete">¿Seguro que quieres borrar los  datos?</h3>
					<form class="form-horizontal" id="formmass" role="form">
						
						<div class="form-group">
							<label class="control-label col-sm-2" for="id">ID:</label>
							<div class="col-sm-10">
								<input type="text" class="form-control" id="id_mass"  disabled>
							</div>
						</div>
						</form>          
						</div>
			</div> 
			</div> 
			</div> 

2
  • pero eso no es laravel?
    – Luis
    el 6 may. 2020 a las 1:35
  • 1
    en el ejemplo no estoy utilizando Laravel y lo que usted pide es pasar datos de un botón a un modal, ademas solo se esta utilizando Javascript,JQUERY y HTML que corresponde al frontend de la aplicación y Laravel corresponde al backend,que corresponde al problema que formulaste, una recomendación es utilizar Laravel para su proyecto a futuro y VUEJS por cuestiones de trabajo el 6 may. 2020 a las 4:11

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.