I have this link where i open modal:
<li><i class="fa fa-times"></i></li>
And i have modal in seperate page modals.blade.php
<div class="modal fade modal_form" id="deleteProperty{{$property->id}}" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel5" aria-hidden="true">
<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="exampleModalLabel5">Are you sure you want to delete this property?</h4>
</div>
<div class="modal-body">
<form method="POST" action="{{ route('user.property.delete',[$user->id,$property->id])}}">
<div class="form-group">
<div class="left-btn">
<button type="button" class="btn btn-primary" data-dismiss="modal">No</button>
</div>
<div class="right-btn">
<button type="submit" class="btn btn-primary">Yes</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
How can i pass this parameter ($property->id) to modal so when user click on specific property, to delete that property?
You need to pass the variables you want to use in the included views.
Example:
#include('standardUser.includes.modals', [ "property" => $property ])
Related
EDIT! LATEST CODE UPDATED, NEW ERROR^
I am currently designing a website which has a feature for users to create an account.
I am encountering problems trying to get the user to be deleted first of all, then for the user to be deleted whilst logged in.
My Users controller looks like so:
public function destroy(Request $request)
{
$user = Auth::user();
Auth::logout();
if ($user->delete())
{
return Redirect::route('\home')->with('global', 'Your account has been deleted!');
}
}
My Modal bootstrap window that opens from a form looks like this;
<div class="modal fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="deleteModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="deleteModalLabel">Are you sure?</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<form action="{{route('users.delete', ['user' => Auth::id()])}}" method="Post">
<span aria-hidden="true">×</span>
</button>
</div>
#csrf
#method('delete')
<div class="modal-body">
Are you sure you want to permanetly delete your account?
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal">No, cancel</button>
<button type="submit" class="btn btn-danger">Yes, delete my account</button>
</div>
</div>
</div>
</div>
The form the modal opens from:
<div class="container">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="card">
<div class="card-header">
<img src="{{ asset('/uploads/avatars/' . $user->avatar ) }}" style="width:100px; height:100px; float:left;
margin-right:25px ">
<strong>Delete {{$user->name}}'s account?</strong></div>
<div class="card-body">
<form action="delete" method="POST" enctype="multipart/form-data">
{{csrf_field()}}
<div class="form-group">
<label for="name">Account Email:</label>
<input type="text" name ="email" value="{{$user -> email}}" class="form-control" readonly>
<div class="form-group">
<div class="text-centre">
<p></p>
<button type="button" class="btn btn-danger" data-toggle="modal" data-target="#deleteModal">
Delete
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
And finally my route looks like this;
Route::post('/users/delete', 'Admin\UsersController#destroy')->name("delete-account");
Any ideas on how to firstly get this working and secondly implement it are welcome. thank you
Please tell us the error you are getting.
The first thing I recognize seeing your code is, that you return on the second line of your method. But after the return, you are still expecting code to run. Unfortunately, this will not work. Code after a return is ignored.
Try to split the methods:
Route::delete('/users/destroy', ['uses' =>'Admin\UsersController#destroy', 'as' => 'users.destroy']);
Route::get('/users/delete', ['uses' =>'Admin\UsersController#delete', 'as' => 'users.delete']);
Form method and request should be like this:
<form action="{{route(users.destroy)}}" method="delete">
Actual problem was the mismatch of route types. You have defined a route of GET type while the form is submitted to a route of DELETE type.
Please replace your code with this one and check:
<div class="modal fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="deleteModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="deleteModalLabel">Are you sure?</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<form action="{{route('users.delete', ['user' => Auth::id()])}}" method="Post">
<span aria-hidden="true">×</span>
</button>
</div>
#csrf
#method('delete')
<div class="modal-body">
Are you sure you want to permanetly delete your account?
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal">No, cancel</button>
<button type="submit" class="btn btn-danger">Yes, delete my account</button>
</div>
</div>
</div>
</div>
And change your route to this
Route::delete('/users/{user}', 'Admin\UsersController#destroy')->name("users.delete");
Your controller lacks an IF-THEN statement
public function destroy(User $user)
{
if($user->id !== Auth::id()) return view('admin.users.delete')->with('user', Auth::user());
Auth::logout();
if ($user->delete())
{
return Redirect::route('\home')->with('global', 'Your account has been deleted!');
}
}
Please replace your code with this one and check:
<div class="modal fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="deleteModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="deleteModalLabel">Are you sure?</h5>
<form action="{{route('delete-account'}}" method="Post">
#csrf
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</form>
</div>
<div class="modal-body">
Are you sure you want to permanetly delete your account?
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal">No, cancel</button>
<button type="submit" class="btn btn-danger">Yes, delete my account</button>
</div>
</div>
</div>
</div>
And change your route to this
Route::post('/users/delete', 'Admin\UsersController#destroy')->name("delete-account");
Your controller lacks an IF-THEN statement
public function destroy(Request $request)
{
$user = Auth::user();
Auth::logout();
if ($user->delete())
{
return Redirect::route('\home')->with('global', 'Your account has been deleted!');
}
}
I have a list of categories, from where I want to pass {{category.name}} to data into Bootstrap modal.
I want to achieve that when I click on the specific button, to show the name of the category in the modal as a message?
Categories
<div class="card mt-2">#foreach($categories as $category)
<ul class="list-group list-group-flush">
<li class="list-group-item">{{ $category->name}}
<a href="" class="btn btn-danger btn-sm ml-2 float-right"
onclick="handleDelete({{$category->id}})">Delete</a>
Edit
</li>
</ul>
#endforeach
</div>
From where I've tried to pass {{$category->name}} into div element, but It showing the last element from the loop.
Modal
<form action="" method="POST" id="deleteCategoryForm">
#csrf
#method('DELETE')
<div class="modal fade" id="deleteModalCenter" tabindex="-1" role="dialog" aria-labelledby="deleteModalCenterTitle"
aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalCenterTitle">Delete category</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
Are you sure you want to delete "{{$category->name}}" ?
</div>
<div class="modal-footer">
<button type="button" class="btn btn-light" data-dismiss="modal">Go Back</button>
<button type="submit" class="btn btn-danger">Yes, Delete</button>
</div>
</div>
</div>
</div>
</form>
JS Script
<script>
function handleDelete(id){
event.preventDefault();
var form = document.getElementById('deleteCategoryForm');
console.log('Delete', form);
form.action = '/categories/' + id;
$('#deleteModalCenter').modal('show');
}
</script>
Thanks in advance
i am making a function is when customer click the quickview button it will be open the modal have a infomation about that product, but i don't know how to do this, i try some method but not working, so please help me.
This is my view :
<div class="row">
<h4>Feauture Product</h4>
</div>
<form method="post">
<div class="row">
<div class="product">
<?php foreach ($infolist as $info_key){ ?>
<div class="col-sm-6 col-md-3">
<div class="thumbnail">
<img src="http://wingsacessorios.com.br/public/img/vertical/img-home05.jpg" class="img-responsive">
<div class="caption">
<h5 class="text-justify">Name product: <?php echo $info_key->name; ?></h5>
<p class="text-justify">Price: <?php echo $info_key->price.' VNĐ'; ?></p>
<p class="text-center"> </i> Buy Now<i class="fa fa-eye" aria-hidden="true"></i> Quick View</p>
</div>
</div>
</div>
<?php }?>
</div>
<!-- Small modal alert when click add cart -->
<div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
<div class="modal-dialog modal-sm" role="document">
<div class="modal-content">
<div class="modal-header" style="padding:5px 10px 5px 10px;">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel" style="background-color:transparent;color:#000000;">Alert from website !</h4>
</div>
<div class="modal-body">
<h5>Added product to your cart!</h5>
</div>
</div>
</div>
</div>
<!-- Modal quickview -->
<div class="modal fade" id="myModal" 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">Modal title</h4>
</div>
<div class="modal-body">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
if i put modal quickview code in for each loop it just display infomation of first product
To open what you have above you'll need to open the modal with
<!-- Button trigger modal -->
<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
Launch demo modal
</button>
pay special attention to the 'data-target'. that must match the ID of your modal div:
<div class="modal fade" id="myModal"... <---
If you have multiple products on the same page your best bet will be to generate modals programmatically with Bootstrap JS Modal.js plugin
http://getbootstrap.com/javascript/#modals
edit
This is one way to do what I believe you're looking for. I may have missed a variable echo, but the basics are there.
<?php foreach ($infolist as $info_key): ?>
<div class="col-sm-6 col-md-3">
<div class="thumbnail">
<img src="http://wingsacessorios.com.br/public/img/vertical/img-home05.jpg" class="img-responsive">
<div class="caption">
<h5 class="text-justify">Name product: some product</h5>
<p class="text-justify">Price: 12 VND</p>
<p class="text-center"> </i> Buy Now <i class="fa fa-eye" aria-hidden="true"></i> Quick View</p>
</div>
</div>
</div>
<!-- Small modal alert when click add cart -->
<div class="modal fade bs-example-modal-sm" id="cartModal<?php echo $info_key->id; ?>" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
<div class="modal-dialog modal-sm" role="document">
<div class="modal-content">
<div class="modal-header" style="padding:5px 10px 5px 10px;">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel" style="background-color:transparent;color:#000000;">Alert from website !</h4>
</div>
<div class="modal-body">
<h5>Added product <?php echo $info_key->id; ?> to your cart!</h5>
</div>
</div>
</div>
</div>
<!-- Modal quickview -->
<div class="modal fade" id="myModal<?php echo $info_key->id; ?>" 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">Modal title</h4>
</div>
<div class="modal-body">
<p>Product <?php echo $info_key->id; ?></p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
<?php endforeach ?>
I don't know what's wrong with the code, but i get the different result for the same query.
My select query (in the controller):
$this->db->select('*');
$this->db->from('vendor_location');
$query = $this->db->get();
$data['location'] = $query->result_array();
My partial view (modal bootstrap):
<div class="modal fade" id="add_driver_modal" 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">ADD DRIVER</h4>
</div>
<div class="modal-body" id='add'>
<div class="row" id="add_driver_form">
<?php var_dump($location);?>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-default" data-dismiss="modal">Close</button>
<button id="add" type="button" class="btn btn-primary btn-md" onclick=add_driver()>Add</button>
</div>
</div>
<div id="form_submit_result"></div>
</div>
</div>
<!-- Edit driver modal -->
<div class="modal fade" id="edit_driver_modal" 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">EDIT DRIVER</h4>
</div>
<form method="post" action="<?php echo base_url(); ?>portal/edit_driver">
<div class="modal-body" id='add'>
<div class="row" id="edit_driver_form">
<?php var_dump($location);?>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button id="save" type="submit" class="btn btn-primary btn-md">Save</button>
</div>
</div>
</div>
</div>
When I var_dump($location) in the add_driver_modal, I get the expected result (all records from vendor_location table). But I just get the last record (one row) in the edit_driver_modal. How could this happen?
I have a page where I want to launch 2 different modal windows. One for creating new users and one for editing existing users.
I show existing users in a clickable table and link to my modal #edit like this:
<tr data-id="<?php echo $value['id'];?>" data-toggle="modal" data-target="#edit" class="open-edit">
This opens my Bootstrap modal dialog:
<div class="modal fade" id="edit">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
I ommited the rest of the code.. I grab this modal on its id="edit".
This works like I want - when clicking on the table entry, the modal dialog gets opened with a form I created.
Now I created an exact copy of this modal dialog, only changed the id="edit" to id="create" and created this button:
<button class="btn btn-primary btn-me" data-toggle="modal" data-target="#create" >Create user<i class="fa fa-arrow-circle-right"></i></button>
I would think that it would now simply open my second modal dialog named #create, but instead it blanks out the screen, like when a modal dialog shows - but without showing any modal window/dialog.
Can anyone help me understand why this is happending or what I am doing wrong?
this code open 2 modal dialogs in the same page
<button type="button" class="btn btn-success btn-sm" style="width: 100%;" data-toggle="modal" data-target="#modal1">modal1</button>
<button type="button" class="btn btn-success btn-sm" style="width: 100%;" data-toggle="modal" data-target="#modal2">modal2</button>
<div class="modal hide fade" id="modal1" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
<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="myModalLabel"></h4>
</div>
<div class="modal-body">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Chiudi</button>
</div>
</div>
</div>
</div>
<div class="modal hide fade" id="modal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
<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="myModalLabel"></h4>
</div>
<div class="modal-body">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Chiudi</button>
</div>
</div>
</div>
</div>
you need to put it on two different div and it will work , i fixed it