// index.blade
<a class="btn btn-primary pull-right addProjectModal" data-toggle="modal" data-target="#ProjectModal" href="projects/jsModal"><i class="fa fa-pencil"></i> Add Project</a>
<!-- Modal -->
<div class="modal fade" id="ProjectModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content" id="frmAddProject"></div>
</div>
</div>
// projectcontroller
public function loadJsModalForm() {
return View::make('frmModals.frmProject');
}
// view/modal.from
{{ Form::open(array('url'=>'projects/jsModal', 'class'=>'frmCreateProject')) }}
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title" id="myModalLabel">Create Project</h4>
</div>
<div class="modal-body">
<div class="row">
<div class="col-lg-12">
<div class="form-group">
{{ Form::label('Project Title') }}
{{ Form::text('project_title', null, array('class'=>'form-control', 'placeholder'=>'Project title')) }}
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
{{ Form::submit('Submit', array('class'=>'btn btn-primary')) }}
</div>
{{ Form::close() }}
// JS file
function openMdoal(link, div){
$(link).on('click', function(e){
e.preventDefault();
$('#'+div).html('<div style="text-align:center;"><img src="../img/spinner.gif"/><br/><br/><h3 class="text-primary">Loading Form...</h3></div>');
$(div).load(
$(this).attr('href'),
function(response, status, xhr) {
if (status === 'error') {
//console.log('got here');
$(div).html('<p>Sorry, but there was an error:' + xhr.status + ' ' + xhr.statusText+ '</p>');
}
return this;
}
);
});
}
$(document).ready(function(){
openMdoal('.addProjectModal', '#frmAddProject');
});
// route
Route::get('projects/jsModal', 'ProjectsController@loadJsModalForm');
anybody here provide the right file structure and route setting.
thanks.
Hey man, why don't you just http://bootboxjs.com/ or https://github.com/jschr/bootstrap-modal. We better don't reinvent the wheel. :D
Sign in to participate in this thread!
The Laravel portal for problem solving, knowledge sharing and community building.
The community