I'm using foundation reveals within my application to send information via AJAX. Everything is working but upon the modal closing I want to change some text. How do you fire a function when a modal closes with Foundation 6? Any help would be great, my current code is as follows:
$("#share_modal").foundation('reveal', 'close', function() {
alert("closed");
});
I'm getting the error
Uncaught ReferenceError: We're sorry, 'reveal' is not an available method for this element.
But the element I'm referring to is the .reveal
<div class="reveal" id="share_modal" data-reveal data-options="closeOnClick:true; closeOnEsc: true;">
<div class="row">
With Foundation 6, the events are a little different.
(function ($, window, undefined) {
'use strict';
$('[data-reveal]').on('closed.zf.reveal', function () {
var modal = $(this);
alert('closed');
});
$(document).foundation();
})(jQuery, this);
That will target all reveals. If you want to target just #share_modal change the selector from $('[data-reveal]')
to $('#share_modal')
or you can use modal.id
to check the element id. It may be modal.attr('id')
Reference: http://foundation.zurb.com/sites/docs/reveal.html#js-events