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

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

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