use asynchronous loop when $(document).foundation()

[rkoberg]

I am trying to use foundation as-is in a react/redux app and would like to have a top/App level call to $(document).foundation() (or perhaps a new $(document).foundation('ifNew')) on componentDidUpdate (which means often). If the each/loop that does the plugin creation was async it would not matter how often it is called (??) and you can remove the warning for if ($el.data('zfPlugin')) and just return. I think this could solve several problems for SPAs.

In foundation.core there is:

      // Localize the search to all elements inside elem, as well as elem itself, unless elem === document
      var $elem = $(elem).find('[data-'+name+']').addBack('[data-'+name+']');

      // For each plugin found, initialize it
      $elem.each(function() {
        var $el = $(this),

(Ideally, the find would look for '[data-zf-'+name+']')

Perhaps something like:

function processElems($elem, process) {
    setTimeout(function() {
        process($elem.shift());
        if($elem.length > 0) {
            setTimeout(arguments.callee, 25);
        }
    }, 25);
}

[rkoberg]

One thing I forgot to include (assume this is probably a known issue) was that reInit does not work. foundation.core does not recorgnize jquery elements, that have already been set up with foundation() passsed in to the above iterate.

[Owlbertz]

If you need to re-initialize only a specific part of your page, the lower example on this page may help you.

[colin-marshall]

@ncoden does this tie into #10900 at all?

[ncoden]

@colin-marshall No. The problem here is not how to reflow but could be reflow asynchronously ?