2015-06-24 11 views
5

Nuovo a Meteor e apprezzare qualsiasi aiuto - hanno lottato con questo. Così ho un modello che viene disegnata in modo condizionale:Meteor.js - impostazione di messa a fuoco per formare il campo di input su refact template

{{#if creating}} 
    <form class="form-create"> 
    <input name="name" type="text" id="mainInput"> 
    <button type="submit">Submit</button> 
    <a class="cancel" href="#">Cancel</a> 
    </form> 
{{else}} 
    <a class="create" href="#">Create</a> 
    {{/if}} 

Questo funziona bene - cliccando sul link di ancoraggio convocazione della forma per mezzo della variabile reattivo sessione "creare", annullare il modulo convocazione l'ancora di nuovo.

Il mio problema è quando appare il modulo, mi piacerebbe impostare l'input (#mainInput) per mettere a fuoco. Ora, questo codice funziona se mi cablarlo fino a un pulsante o qualcosa del genere (che predispone l'ingresso per concentrarsi quindi so il jquery lavora - per esempio:

"click .focusBtn": function(e, tpl) { 

    tpl.$("#mainInput").focus(); 
    tpl.$("#mainInput").select(); //might as well select the entire thing too 

},

Ma, posso' t focalizzare l'attenzione su una messa a fuoco sullo schermo per ridisegnare dall'ancora al modulo!

Ho provato ad agganciarlo nel codice della variabile di sessione (Creazione), in modo che ogni volta che si creasse la modifica (console.log I vedere l'interruttore Creazione da vero a falso, I convalida Creazione è vero, chiamare lo stato attivo da quel blocco helper, ma senza modifiche)

Ho anche provato un tracker alla sessione var creazione - come questo, senza alcun risultato, messa a fuoco non viene raggiunta:

Tracker.autorun(function() { 
    var creating = Session.get('creating'); 
    console.log('Autorun is auto-running!'); 
    console.log(creating); 

    if (creating) { 
     $('#mainInput').focus(); // I tried documentbyID, etc but nothing 
    } 
}); 

mi rendo conto che potrebbe avere qualcosa a che fare con Tracker, o forse c'è un "hook" di cui non sono a conoscenza (ho provato il template renderizzato ma questo sembra funzionare solo sulla creazione iniziale, una volta) Sto leggendo la guida ora, ma ancora nuovo a questo e qualsiasi aiuto/guida è apprezzato. Grazie!

risposta

6

che erano sulla strada giusta, è sufficiente utilizzare una registrazione Tracker.afterFlush callback per eseguire la chiamata focus quando Meteor avuto la possibilità di rendere l'ingresso dopo la variabile Session stata invalidata e il blocco {{#if}} percorso aiutante Spacebars prescelto.

Tracker.autorun(function() { 
    var creating = Session.get('creating'); 
    if (creating) { 
    Tracker.afterFlush(function(){ 
     $('#mainInput').focus(); 
    }); 
    } 
}); 
+0

funziona come un fascino! Rocce di meteore (e anche tu)! Grazie. – jd1138

+0

Un altro metodo dal nulla .. ma funziona! – TyrionGraphiste

2

Prova ad aggiungere autofocus

<input name="name" type="text" id="mainInput" autofocus> 
+0

Ho provato anche quello! Grande funzionalità - Ma si concentra solo sull'estrazione iniziale e mai più tardi (passa da annulla/crea). – jd1138

+0

Cool, non lo sapevo! – Rijk

Problemi correlati