Last active
August 29, 2015 13:56
-
-
Save zealot128/9032226 to your computer and use it in GitHub Desktop.
Bootstrap-modal with ajax links. Just put class js-modal on links. All links inside that modal and the form are submitted remotly
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
$ -> | |
$(document).on 'click', '.js-modal, #js-modal .modal-body a', (e)-> | |
return true if $(this).data('toggle') | |
e.preventDefault() | |
modal = """ | |
<div class='modal fade container' id='js-modal' role="dialog" > | |
<div class='no-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"></h4> | |
</div> | |
<div class='modal-body'></div> | |
<div class='modal-footer'></div> | |
</div> | |
</div> | |
</div> | |
""" | |
modal = $(modal) | |
self = $(this) | |
$.get self.attr('href'), (data)-> | |
data = $('<div>'+data+'</div>') | |
#modal.find('.modal-title').html( self.attr('title') ) | |
footer_provided = data.find('#modal-footer') | |
if footer_provided.length > 0 | |
modal.find('.modal-footer').html footer_provided.remove().html() | |
modal.find('.modal-body').html data.html() | |
if $('#js-modal').length == 0 | |
$('body').append(modal) | |
$('#js-modal').modal(show: true) | |
else | |
$('#js-modal').html modal.html() | |
$('#js-modal').trigger('modal-changed', self.attr('href')) | |
if !$('#js-modal').is(':visible') | |
$('#js-modal').modal(show: true) | |
return false | |
$(document).on 'submit', '#js-modal form', (e)-> | |
e.preventDefault() | |
form = $(this) | |
$.ajax | |
url: form.attr("action") | |
type: if form.attr('method') == 'GET' then 'GET' else 'POST' | |
data: form.serialize() | |
complete: (d,e)-> | |
$('#js-modal').find('.modal-body').html d.responseText | |
$('#js-modal').trigger('modal-changed', form.attr('action')) | |
return false |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment