I working on laravel project and I have many modals that I will using in my project so I decided to put modals code in another folder . my view code is
<button type="button" class="btn btn-success" data-toggle="modal" data-
target="#AddUserMoodal"><i class="fa fa-edit" aria-hidden="true"></i>
when I pressing on this button I want to open AddModal which is in modals folder this is code of /modals/addmodal.blade.php
<div id="addModal" 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">×</button>
<h4 class="modal-title"></h4>
</div>
<div class="modal-body">
<form class="form-horizontal" role="form">
<div class="form-group">
<label class="control-label col-sm-2" for="title">Title:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="title_add" autofocus>
<small>Min: 2, Max: 32, only text</small>
<p class="errorTitle text-center alert alert-danger hidden"></p>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="content">Content:</label>
<div class="col-sm-10">
<textarea class="form-control" id="content_add" cols="40" rows="5"></textarea>
<small>Min: 2, Max: 128, only text</small>
<p class="errorContent text-center alert alert-danger hidden"></p>
</div>
</div>
</form>
<div class="modal-footer">
<button type="button" class="btn btn-success add" data-dismiss="modal">
<span id="" class='glyphicon glyphicon-check'></span> Add
</button>
<button type="button" class="btn btn-warning" data-dismiss="modal">
<span class='glyphicon glyphicon-remove'></span> Close
</button>
</div>
</div>
</div>
</div>
</div>
but I don't know how to do that .what is the route will be for it
suppose you are in home page : home.blade.php
, use include
<body>
@include('models/addmodal')
</body>
If your modal is dynamic , and you want to pass data to modal :
<body>
@include('models/addmodal',['title'=>$title,'data'=>$data])
</body>
and in your addmodal
<div id="addModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
{{$title}}
</div>
</div>
</div>
</div>
Take a look at the @include directive.
Side note:
Just for reference, back in the old of Laravel you could solve it like this:
// routes.php (which is web.php now)
Route::get('view-component/{name}', function ($name) {
return view($name);
});
// In your view
{{ route('view-component/user-form') }}
You just need to include your blade file with
@include('path.to.your.blade')
You can have your HTML structure in parts and just include them as above.
Check Laravel documentation for blade: https://laravel.com/docs/5.6/blade#including-sub-views