gli eventi modali di base non funzionano - meteor, zurb-foundation

Il mio codice

{{#with profile}}

{{> foundation}}
{{/with}}


<template name="foundation">
<div id="userprofile" class="reveal-modal" data-reveal>
<h2 id="selectedProfileName">{{name}}</h2>
<div class="large-12 columns paddingtop">
<div class="large-3 columns">
<img id="selectedProfilePicture" src="/images/{{picurl}}" />
<p id="selectedProfileLink" ><a href="/accounts/profile/{{_id}}" >Open Profile</a></p>
</div>
</div>
<div class="columns right">
<div id="btnCancel" class="btnCancel button button-register small">Cancel</div>
<div id="btnConfirm" class="btnConfirm button button-register small" data={{_id}}>Okay</div>
</div>
<a class="close-reveal-modal">&#215;</a>
</div>
</template>

Sto aprendo il modale usando JS

$("#userprofile").foundation("reveal","open");

I miei eventi sono

Template.foundation.events({
"click .btnConfirm":function(evt){
console.log("confirm");
$("#curator_name").val("");
$("#confirmationText").html("");
},
"click .btnCancel":function(){
console.log("close");

},
});

Non stanno sparando, qualcuno ha affrontato lo stesso problema.

Ho provato a inserire tutto il codice modale nel modello principale e legare gli eventi, anche questo non funziona

risposte:

È abbastanza probabile che, come Semantic-UI ealcuni altri framework, le modalitā di Foundation vengono rimosse dal DOM e aggiunte in modo programmatico altrove (come alla fine del corpo). Se questo è il caso, i gestori di eventi registrati sul modello allegato non saranno più in grado di trovarli.

La soluzione è definire un modello entro il tuo modal e attacca gli eventi a questo. Qualcosa di simile a:

<template name="foundation">
<div id="userprofile" class="reveal-modal" data-reveal>
{{> foundationInner}}
</div>
</template>

<template name="foundationInner">
<h2 id="selectedProfileName">{{name}}</h2>
<div class="large-12 columns paddingtop">
...
</div>
<a class="close-reveal-modal">&#215;</a>
</template>

Quindi registrare tutti i gestori di eventi su foundationInner (che non si muove relativo alla sua vista genitore).

Se, ovviamente, in Fondazione non si verificano distacchi e riattacchi, allora è tutto diverso. Altro su questo problema Qui.

    Template.foundation.rendered = function() {
// your code to show the modal
$("#userprofile").foundation("reveal","open");

}