Bootstrap modal and Ajax content
June 8, 2012index.html
<script type="text/javascript">
$(function() {
$('[data-toggle="modal"]').click(function(e) {
e.preventDefault();
var href = $(this).attr('href');
if (href.indexOf('#') == 0) {
$(href).modal('open');
} else {
$.get(href, function(data) {
$('<div class="modal">' + data + '</div>').modal();
});
}
});
});
</script>
<a href="/beta/detail/{{ result.host_id }}" data-toggle="modal">{{ result.host_name }}</a>
result.html
<div class="modal-header">
<a class="close" data-dismiss="modal" >×</a>
<h3>{{ result.host_name }}</h3>
</div>
<div class="modal-body">
{{ result.host_name }}
</div>
Comments