Thomas Venturini
Thomas Venturini

Reputation: 3750

$(document).foundation(); not working

I try to get my elements, that I load via ajax back to work but when I try to reinitialize the events on them, it simply doesn't work. I tried to insert $(document).foundation(); on different places in my code but nope :(

Here an example:

    $.ajax({
        url: 'dashboard/ajax/links/get',
        method: 'post',
        data: {
            _token: $('input[name=_token]').val()
        },
        success: function(data) {
            $('.links-container').html(data);
            $(document).foundation();
        }
    });

Any ideas?

Update

Another example

// open edit link modal
$('.item-link-edit').on('click',function(e){
    e.preventDefault();
    // get item id
    var id = getItemId(this);
    // open modal and load content
    $('#edit-link-modal').foundation('reveal','open',{
        url: 'dashboard/ajax/links/modals/edit',
        data: {
            id: id
        },
        success: function() {
            setTimeout(function(){
                $(document).foundation();
                console.log('reinit');
            },1000);
        }
    });
}); 

still not working :/

Upvotes: 0

Views: 3343

Answers (1)

mec
mec

Reputation: 77

You need to use reflow if you add new content to the DOM.

$(document).foundation('reflow');

Reflow will make Foundation check the DOM for any elements and re-apply any listeners to them. If you dont want to reflow everything you can specify the module you want to re-apply;

$(document).foundation('orbit', 'reflow'); // orbit, for an example

Further documentation can be found here: http://foundation.zurb.com/docs/javascript.html

Upvotes: 1

Related Questions