Modal not showing when data passed to it - laravel

i have been working on laravel project and i need to delete data from database by showing warning modal message. deleting part deals with controller and working fine.But when passing user id to modal modal is not showing up.
<tbody>
#foreach($userdata as $data)
<tr>
<td>{{ $data->user_id}}</td>
<td>{{ $data->Column2}}</td>
<td>{{ $data->Column3}}</td>
<td>{{ $data->Column4}}</td>
<td><a data-toggle="modal" data-target="#exampleModal{{ $data->user_id }}" class="btn btn-danger">Delete</a>
</td>
</tr>
#endforeach
</tbody>
<div id="exampleModal{{$data->user_id}}" class="modal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Delete Data</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<p style="align-items: center">Data will be delete.</p>
</div>
<div class="modal-footer">
<form action="" method="POST">
#csrf
#method('delete')
<a type="submit" class="btn btn-danger" href="#">Delete</a>
</form>
<button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
</div>
</div>
</div>
</div>

Related

My LiveWIre wire Click Action is not working

This is my Livewire Component. When I try to click a function like delete it doesn't work and doesn't give me dd(). Everything is ok I've checked several times and tried everything.
#extends('admin.layouts.layout')
#section('content')
<!-- Modal -->
<div>
<div
class="modal fade"
id="deleteModal"
tabindex="-1"
aria-labelledby="exampleModalLabel"
aria-hidden="true"
>
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Catagory Delete</h5>
<button
type="button"
class="btn-close"
data-bs-dismiss="modal"
aria-label="Close"
></button>
</div>
<form wire:submit.prevent="destroyCatagory">
<div class="modal-body">
<h6>Are You Sure YOu Want To Delete this Data?</h6>
</div>
<div class="modal-footer">
<button
type="button"
class="btn btn-secondary"
data-bs-dismiss="modal"
>
Close
</button>
<button type="submit" class="btn btn-primary">Yes Delete</button>
</div>
</form>
</div>
</div>
</div>
<div class="row">
#if (session()->has('message'))
<div class="alert alert-success">{{session('message')}}</div>
#endif
<div class="col-md-12">
<div class="card">
<div class="card-header">
<h4>
Catagory
<a
href="{{url('admin/catagory/create')}}"
class="float-end btn btn-primary"
>Add Catagory</a
>
</h4>
</div>
<div class="card-body">
<table class="table table-striped table-hover">
<tr>
<th>ID</th>
<th>Name</th>
<th>Status</th>
<th>Action</th>
</tr>
#forelse ($catagories as $catagory)
<tr>
<td>{{$catagory->id}}</td>
<td>{{$catagory->name}}</td>
<td>{{$catagory->status=='1'? 'Hidden':'visible'}}</td>
<td>
<a
href="{{url('admin/catagory/'.$catagory->id.'/edit')}}"
class="btn btn-success"
>
Edit</a
>
<a
wire:click="deleteCatagory({{$catagory->id}})"
class="btn btn-primary"
data-bs-toggle="modal"
data-bs-target="#deleteModal"
>Delete</a
>
</td>
</tr>
#empty #endforelse ($catagories as $catagory)
</table>
{{$catagories->links()}}
</div>
<div class="card-footer"></div>
</div>
</div>
</div>
</div>
#endsection
This is my index.blade.php for the livewire component. Everything seems to be ok in this component. I've checked everything several times and I've been stuck on this for many days, please help me.
public function deleteCatagory($id)
{
dd($id);
$this->catagory_id = $id;
}
public function destroycatagory()
{
$catagory= Catagory::find($this->catagory_id);
$path = 'uploads/catagory/'.$catagory->image;
if(File::exists($path)) {
File::delete($path);
}
$catagory->delete();
session()->flash('message','Catagory Deletd Successfully');
}

Laravel 5.5 - MethodNotAllowedHttpException

I have an task using Laravel. Which one on my task, user can edit the data on master data table. I'm using modal pop when user want to edit the data. So the user no need to move the page for edit data. On my task I'm using Laravel 5.5
Here is my code :
This is for tabel modal edit
<div class="modal fade" id="edit-modal" tabindex="-1" role="dialog" aria-labelledby="largeModal" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header no-bd">
<h5 class="modal-title">
<span class="fw-mediumbold">Detail</span>
<span class="fw-light">Data</span>
</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form class="form-material form-horizontal" method=post action="{{route('masterdataobjek.update', 'test')}}">
{{ csrf_field() }}
<div class="row">
<div class="col-sm-12">
<input type="hidden" name="id_objek" id="id_objek_modal" value="">
<div class="form-group form-group-default">
<label>Nama Objek</label>
<input id="objek_nama_modal" type="text" name="objek_nama_modal" class="form-control">
</div>
</div>
<div class="col-sm-12">
<div class="form-group form-group-default">
<label for="comment">Deskripsi Objek</label>
<textarea class="form-control" name="objek_desc_modal" id="objek_desc_modal" rows="5"></textarea>
</div>
</div>
<div class="col-sm-12">
<label for="exampleFormControlFile1">Upload WTO File</label>
<div class="form-group form-group-default">
<input type="file" class="form-control-file" name="objek_wto" id="objek_wto">
</div>
</div>
</div>
<div class="modal-footer no-bd">
<button type="submit" class="btn btn-primary">Update</button>
<button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
</div>
</form>
</div>
</div>
</div>
</div>
For the button clicked code ;
<tbody>
#foreach ($tabelobjek as $ta => $data)
<tr>
<td>{{ $loop->iteration }}</td>
<td>{{ $data->objek_nama}}</td>
<td style="">{{str_limit($data->objek_desc,15)}}</td>
<td>
<div class="form-button-action">
<button type="button" data-toggle="modal"
class="btn btn-link btn-success btn-lg" data-original-title="Edit"
data-target="#edit-modal" id="edit-button"
data-idobjek="{{$data->id_objek}}"
data-namaobjek="{{$data->objek_nama}}"
data-objekdeskripsi="{{$data->objek_desc}}">
<i class="fa fa-edit"></i>
</button>
</div>
</td>
</tr>
#endforeach
</tbody>
for trigger button :
<script>
$(document).ready(function () {
$(document).on('click', '#edit-button', function () {
var namaobjek = $(this).data('namaobjek');
var objekdeskripsi = $(this).data('objekdeskripsi');
var idobjek = $(this).data(idobjek)
$('#id_objek_modal').val(idobjek)
$('#objek_nama_modal').val(namaobjek);
$('#objek_desc_modal').val(objekdeskripsi);
})
})
MasterDataObjekController.php
public function update(Request $request)
{
$updateObjek = TbObjek::findOrFail($request->id_objek);
$updateObjek->update($request->all());
return back();
}
POST requests are for creating new records, PUT and PATCH are for updating records. Refer to the table of HTTP methods on Laravel RESTful containers here
You need to change your form tag from this
<form class="form-material form-horizontal" method=post action="{{route('masterdataobjek.update', 'test')}}">
to this
<form class="form-material form-horizontal" method="put" action="{{route('masterdataobjek.update', 'test')}}">

How to retrieve the id from iteration to the bootstrap modal?

I need to capture the id from the iteration, but it seems to capture the last id which it's seems to be obviously,
Am using bootstrap modal which i even don't know how they code their jQuerys'.
Thus how can i do to make this button not capturing the last id?
<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#applications_{{$user->id}}" id="#applications_{{$user->id}}">View applications</button>
<!-- Modal -->
<div class="modal fade" id="applications_{{$user->id}}" role="dialog" >
<div class="modal-dialog" >
<!-- Modal content-->
<div class="modal-content" style="width: 600px !important;">
<div class="modal-header">
{{-- <button type="button" class="close" data-dismiss="modal">×</button> --}}
<h4 class="modal-title">Applications</h4>
</div>
<div class="modal-body">
<div class="text-muted" style="float: left;padding-right: 10px">
<table class="table table-hover">
<tr>
<th>Company name</th>
<th>Location</th>
<th>Program</th>
<th>Application</th>
<th>Actions</th>
</tr>
#foreach($user->post as $form)
<tr>
<td>{{$form->pivot->company_name}}</td>
<td></td>
<td>{{$form->pivot->id}}</td>
<td>
/* this button is only capturing the last id from iteration */
<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#application_{{$form->pivot->id}}" >View {{$form->pivot->file}}</button> </td>
<td></td>
</tr>
#endforeach
{{$user->name}}
</table>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<!-- Modal -->
<div class="modal fade" id="application_{{$form->pivot->id}}" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Application</h4>
</div>
<div class="modal-body">
<div class="text-muted" style="float: left;padding-right: 10px">
<div class="center image">
<img src="/storage/file/{{$form->pivot->file}}" class="img-round" alt="User Image">
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
Expected to retrieve an image from it's respectively post, but it only works with the last id, no errors.
Your second modal is outside the foreach, then id="application_{{$form->pivot->id}}" only works with the last value it took in the loop. To do it with a blade, you can redo the loop and create a modal for each id and image:
<!-- 2nd Modal -->
#foreach($user->post as $form)
<div class="modal fade" id="application_{{$form->pivot->id}}" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Application</h4>
</div>
<div class="modal-body">
<div class="text-muted" style="float: left;padding-right: 10px">
<div class="center image">
<img src="/storage/file/{{$form->pivot->file}}" class="img-round" alt="User Image">
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
#endforeach

pass data from table to modal using angular

Im using Spring MVC and AngularJS to build my app and I been looking for a way to pass a table registry data to a modal in order to edit that registry but I haven´t find a working example so, thats my question how can a I pass the registry data to a modal?
This is what I have so far:
Table
<table class="table table-hover table-responsive">
<thead class="table-striped">
<th>Email</th>
<th>Nombre</th>
<th>Apellidos</th>
<th>Rol</th>
<th>Acciones</th>
</thead>
<tbody>
<tr data-ng-show="allUsuarios.length === 0">
<td colspan="4" class="warning">No hay registros para mostrar</td>
</tr>
<tr data-ng-repeat="usuarios in allUsuarios">
<td>{{usuarios.email}}</td>
<td>{{usuarios.nombre}}</td>
<td>{{usuarios.apellidos}}</td>
<td>{{usuarios.idRol.tipoRol}}</td>
<td>
<input type="hidden" value="{{usuarios.idUsuario}}"/>
<button class="btn btn-primary" data-toggle="modal" data-target="#formModalEditar"><i class="glyphicon glyphicon-pencil"></i></button>
<button class="btn btn-danger" data-toggle="modal" data-target="#formModalEliminar"><i class="glyphicon glyphicon-trash"></i></button>
</td>
</tr>
</tbody>
</table>
And the Modal:
<!--EDIT MODAL-->
<div class="col-lg-12">
<div class="modal fade" id="formModalEditar" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title" id="H2">Editar Usuario</h4>
</div>
<div class="modal-body">
<form role="form" action="add" method="post">
<div class="form-group">
<label>Email</label>
<input class="form-control" type="text" required=""/>
<label>Nombre</label>
<input class="form-control" type="text" required=""/>
<label>Apellidos</label>
<input class="form-control" type="text" required=""/>
<label>Rol</label>
<br>
<div class="btn-group open">
<button data-toggle="dropdown" class="btn dropdown-toggle">Action <span class="caret"></span></button>
<ul class="dropdown-menu">
<li>Action</li>
</ul>
</div>
</div>
<div class="text-right">
<button type="submit" class="btn btn-success">Guardar</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Cancelar</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<!--END EDIT MODAL-->
PS: I don´t know why when I press Ctrl+K to format the code, it gets displayed like that, sorry.
First of all you have to define a registery in you angular component
currentRegistery : Registery;
In your table you have to add an onclick on the edit icon of each registery to be able to set the current Registery with the selected registery
<button class="btn btn-primary" data-toggle="modal" data-target="#formModalEditar" onclick=“currentRegistery=usuarios”><i class="glyphicon glyphicon-pencil"></i></button>
Finally on your modal you can deal directly with the currentRegistery object.

How get id from other user in Laravel

I am trying to create a user manager in Laravel, I have implemented methods for editing and deleting registered users in my database, but when I try to delete a selected user, it picks up the id of the logged in user, thus excluding the logged in user account.
Function Destroy from Admin Controller
public function destroy($id)
{
$user = User::find($id);
$user->delete($id);
}
View from Admin index
#extends('layouts.sidebar')
#extends('layouts.app')
#section('content')
<div class="container">
<div class="row">
<div class="panel-heading">
<h2>Gerenciamento de usuários</h2>
<div class="panel-body">
<!-- Button trigger modal -->
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#insertUser">
Adicionar Usuário
</button>
<!-- Modal -->
<div class="modal fade" id="insertUser" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">Cadastro de usuários</h4>
</div>
<div class="modal-body">
<form class="" action="{{ url('/admin/criausuario')}}" method="post">
{{ csrf_field() }}
<label for="nome">Nome</label>
<input type="text" class="form-control" id="nome" placeholder="Nome Completo" name="nome"></br>
<label for="email">Email</label>
<input type="email" class="form-control" id="email" placeholder="Email" name="email"></br>
<label for="senha">Senha</label>
<input type="password" class="form-control" id="senha" placeholder="Senha" name="senha"></br>
<label for="tipo">Tipo</label>
<select class="form-control">
<option value="0">Usuário</option>
<option value="1">Administrador</option>
</select>
<button type="button" class="btn btn-default" data-dismiss="modal">Fechar</button>
<button type="submit" class="btn btn-default">Cadastrar</button>
</div>
<div class="modal-footer">
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-body">
<table class="table">
<tr>
<th>Avatar</th>
<th>ID</th>
<th>Nome</th>
<th>Email</th>
<th>Ações</th>
</tr>
<tr>
#foreach($users as $user)
<td> <img src="{{$user->avatar}}" alt="" style="width: 75px; border-radius: 50%;"> </td>
<td>{{$user->id}}</td>
<td>{{$user->name}}</td>
<td>{{$user->email}}</td>
<td><i class="glyphicon glyphicon-edit"></i>
<button type="button" class="btn btn-danger" data-toggle="modal" data-target="#confirmacao">
<i class="glyphicon glyphicon-remove"></i>
</button></td>
</tr>
<div class="modal fade" id="confirmacao" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">Confirmação</h4>
</div>
<div class="modal-body">
Você tem certeza que deseja excluir o usuário selecionado?
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Fechar</button>
<button type="button" class="btn btn-danger">Excluir</button>
</div>
</div>
</div>
</div>
#endforeach
</table>
</div>
</div>
</div>
</div>
{{ $users->links()}}
#endsection
Route
Route::get('/admin', 'AdminController#index')->middleware('admin');
Route::get('/admin/editar/{id}', 'AdminController#edit')->middleware('admin');
Route::post('/admin/editar/{id}', 'AdminController#update')->middleware('admin');
Route::post('/admin/criausuario/', 'AdminController#store');
Route::get('/admin/deletar/{id}', 'AdminController#destroy')->name("user::deleteGet")->middleware('admin');
Any suggestion?

Resources