I want to create modal for update one of the column value from bootstrap table. here is the html code for opening modal.
<a href='' id='upload_link' data-id='$row->id' data-toggle='modal' data-target='#myModal'>Upload</a>
This is My Modal Code. In modal I have form and i want to pass data-id value in form action with route {!! Form::open(['route' => ['path_here',data-id] , 'files' => 'true','method' => 'get']) !!} so that i can update value of that particular record. How to pass data-id value in form action. How to do so ! please Help..
<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Title</h4>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
{!! Form::open(['route' => ['path_here',data-id] , 'files' => 'true','method' => 'get']) !!}
{!! Form::close() !!}
</div>
<!-- <div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div> -->
</div>
</div>
</div>
Related
I have facing this error when try to add new categories to store the data, but it seen show me _token error?
CategoriesController.php
public function store(Request $request)
{
Category::create($request->all());
return back();
}
index.blade.php
<a class="btn btn-primary pull-right navbar-right" data-toggle="modal" href="#category">Add Category</a>
<div class="modal fade" id="category">
<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">Add New</h4>
</div>
{!! Form::open(['route' => 'category.store', 'method' => 'post']) !!}
<div class="modal-body">
<div class="form-group">
{{ Form::label('name', 'Title') }}
{{ Form::text('name', null, array('class' => 'form-control')) }}
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary">Save changes</button>
</div>
{!! Form::close() !!}
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
Add
protected $fillable = ['name'];
under your Category class.
And use
Category::create($request->only(['name']));
instead of $request->all() which tries to write to categories._token column inside your Category model combined with create().
You should try this:
<a class="btn btn-primary pull-right navbar-right" data-toggle="modal" href="#category">Add Category</a>
<div class="modal fade" id="category">
<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">Add New</h4>
</div>
{!! Form::open(['route' => 'category.store', 'method' => 'post']) !!}
{!! csrf_field() !!}
<div class="modal-body">
<div class="form-group">
{{ Form::label('name', 'Title') }}
{{ Form::text('name', null, array('class' => 'form-control')) }}
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary">Save changes</button>
</div>
{!! Form::close() !!}
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
you can also add
protected $guarded = [];
to your model and then you can use mass assignment.
I have a delete button beside my projects that shows a popup modal for confirmation whenever the button is clicked on. I want the yes button in the modal to then delete the project whenever this button is clicked on.
I'm calling the modal into the projects/show view with #include. The modal does appear when the button is clicked using the following jquery but the yes button when pressed is not deleting the project.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
$(".delete").on("submit", function(e){
e.preventDefault();
$('#myModal').modal('show');
});
});
The delete button beside projects:
{!! Form::open(['route' => ['projects.destroy', $projects->id], 'class' => 'delete', 'method' => 'DELETE']) !!}
{!!Form::button('<span class="glyphicon glyphicon-remove"></span>', ['class' => 'btn btn-danger btn-md', 'type' => 'submit'])!!}
{!! Form::close() !!}
Modal code:
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog modal-md" 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 text-center" id="myModalLabel">Delete Confirmation</h4>
</div>
<div class="modal-body text-center">
Are you sure you want to delete this project?
</div>
<div class="modal-footer">
<button type="submit" id="delete-btn" class="btn btn-default" >Yes</button>
<button type="button" class="btn btn-primary" data-dismiss="modal">Cancel</button>
</div>
</div>
</div>
</div>
ProjectController:
<?php
namespace App\Http\Controllers;
use App\project;
use App\Http\Requests;
use Illuminate\Http\Request;
use Session;
class ProjectsController extends Controller
{
public function destroy($id){
$project = Project::find($id);
$project->delete();
Session::flash('success', 'The project was successfully deleted!');
return redirect()->route('projects.show', $project->project_id);
}
}
Change the submit button in your modal to this:
{!! Form::open(['route' => ['projects.destroy', $projects->id], 'class' => 'delete', 'method' => 'DELETE']) !!}
<button type="submit" id="delete-btn" class="btn btn-default" >Yes</button>
{!! Form::close() !!}
The best solution is to remove your implementation of the delete button you have now and make it a normal button. Let that button pop up the modal and replace your "Yes" button with an actual remove button like I did above.
I am doing project in laravel. I have multiple records in databse which I have displayed in laravel's blade file using foreach loop. Each record have pending button. Whenever user clicks on pending button it opens a html modal. I want that record id inside the modal but it always take first record id. My blade file looks like,
#foreach($providerData as $newprovider)
<h4>Name:{{$newprovider->name}}</h4>
<button class="btn btn-default" data-toggle="modal" data-target="#Pendingnote">Pending</button>
{!! Form::model( $newprovider->id ,['method' => 'PATCH','action'=>['superadminController#pendingProvider', $newprovider->id]]) !!}
<div class="modal fade" id="Pendingnote" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Note {!! $newprovider->id !!}</h4>
</div>
<div class="modal-body">
<input type="text" class="form-control" name="note" value="{{ old('note') }}">
</div>
<div class="modal-footer">
{!! Form::submit('Add', ['class' => 'btn btn-default']) !!}
</div>
</div>
</div>
<input type="hidden" name="_token" value="{{ csrf_token() }}">
</div>
{!! Form::close() !!}
#endforeach
Whichever record is clicked, it always returns $newprovider->id as first record's id. I don't know where I am getting wrong. Please help and thanks in advance.
Do these things in order to get the modals work.
Edit the button to:
<button class="btn btn-default" data-toggle="modal" data-target="#Pendingnote{{$newprovider->id}}">Pending</button>
And the modal container to:
<div class="modal fade" id="Pendingnote{{$newprovider->id}}" role="dialog">
All modal-triggering buttons have data-target="#Pendingnote", which means they all trigger the first modal with that id they can find.
You could try for instance removing the data-target attribute and trigger the modal with a bit of jQuery, like:
$('button[data-toggle]').on('click', function () {
$(this).next('form').find('.modal').modal('show');
});
I would suggest anyway to have the forminside the modal instead. So the jQuery would be:
$('button[data-toggle]').on('click', function () {
$(this).next('.modal').modal('show');
});
Lastly, take a look at this: http://getbootstrap.com/javascript/#modals-related-target
I am trying to use a bootstrap modal to confirm delete operation. I am using Cakephp 3 and am new to it.
So far I am able to create this much.
If i can successfully replace with the id of the button that was clicked, Then the issue will be solved
UsersController.php
public function delete($id)
{
$this->request->allowMethod(['post', 'delete']);
$user= $this->Users->get($id);
if ($this->Users->delete($user)) {
$this->Flash->success(__('The user with id: {0} has been deleted.', h($id)));
return $this->redirect(['action' => 'index']);
}
}
index.ctp
<?= $this->Html->tag('i','',['class' => 'fa fa-times fa-fw icon-delete deleteUser', 'data-toggle' => 'modal', 'data-target' => '#confirmModal' , 'id' => $user->user_id ]) ?>
<!-- Modal -->
<div class="modal fade" id="confirmModal" tabindex="-1" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body">Are you sure?</div>
<div class="modal-footer">
<?= $this->Form->postLink(
$this->Html->tag('button','Delete',['class' => 'btn btn-default pull-right']),
['action' => 'delete', <id_here>],
['escape' => false])
?>
<button type="button" class="btn btn-default pull-right" data-dismiss="modal">Cancel</button>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
<!-- /.modal -->
The generated markup for the delete button part in the modal is
<form action="/boot/users/delete/ABCD20090004" name="post_56e141b0297cc915184088" style="display:none;" method="post"><input name="_method" value="POST"></form>
<a href="#" onclick="document.post_56e141b0297cc915184088.submit(); event.returnValue = false; return false;">
<button class="btn btn-default pull-right">Delete</button>
</a>
Try:
<?= $this->Form->postLink(
$this->Html->tag('button','Delete',['class' => 'btn btn-default pull-right']),
['action' => 'delete',array('id'=>$user->user_id)],
['escape' => false])
?>
Note: you will need a modal for each element in your list(loop)
Pass the user id of the record to be deleted on the delete button on the modal as opposed to the delete button you are clicking on to display the modal. Modify the index.ctp as follows
Do not pass the user id at this point
<?= $this->Html->tag('i','',['class' => 'fa fa-times fa-fw icon-delete deleteUser', 'data-toggle' => 'modal', 'data-target' => '#confirmModal']) ?>
Pass the id on the delete button below
<!-- Modal -->
<div class="modal fade" id="confirmModal" tabindex="-1" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body">Are you sure?</div>
<div class="modal-footer">
<?= $this->Form->postLink(__('Delete'), ['action' => 'delete', $user->id], ['class' => 'btn btn-default pull-right']); ?>
<button type="button" class="btn btn-default pull-right" data-dismiss="modal">Cancel</button>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
<!-- /.modal -->
Also, do not forget to initialize the modal
<script>
$(document).ready(function () {
$('#confirmModal').modal('show');
});
</script>
I'm trying to update an existing row in my table using a form in a bootstrap modal. But nothing changes when I attempt it. I have an html table with a list of cars and in each row a button "Change Status" that opens the bootstrap modal with the id="myModal_{{ $car->id }}" and with the form inside it to edit the status of a car in repair.
Here's my modal:
<!-- Modal -->
<div class="modal fade" id="myModal_{{ $car->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">Breyta stöðu bíls</h4>
</div>
<div class="modal-body">
<div class="form-group">
<h3>Breyta stöðu fyrir {{ $car->LicencePlate }}</h3>
</div>
{!! Form::open(['url' => 'create']) !!}
<div class="form-group">
{!! Form::label('Status', 'Status: ') !!}
{!! Form::select('Status', [
null => ' -- Veldu Stöðu bíls -- ',
'Í Biðröð' => 'Í Biðröð',
'Í Viðgerð' => 'Í Viðgerð',
'Tilbúinn' => 'Tilbúinn'
], null, ['class' => 'form-control']) !!}
</div>
<div class="form-group">
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
{!! Form::submit('Skrá stöðu', ['class' => 'btn btn-primary']) !!}
</div>
{!! Form::close() !!}
</div>
</div>
</div>
Update method in CarController:
public function CarEdit($id, Requests\CreateCarsRequest $request)
{
$edit = Car::update($request->all());
return redirect::back();
}
My Route to that method:
Route::post('/dashboard', 'CarController#CarEdit');
You should do this:
['action' => 'CarController#CarEdit']
Also, you're using mass assignment, so you must fill $fillable array in your Car model to make it work:
https://laravel.com/docs/5.1/eloquent#mass-assignment
I was able to fix this with the help of my colleagues. What I did was I created a new requet called UpdateCarRequest where the LicencePlate field was not unique. And edited my method like so:
public function CarEdit(Requests\UpdateCarRequest $request)
{
$edit = Car::where('LicencePlate', '=', $request->LicencePlate)->first();
$edit->update($request->all());
return redirect('/dashboard');
}
I also added a hidden field in the form with the value $car->LicencePlate.