2016-07-07 14 views
4

Hier ist ein einfaches Beispiel: http://codepen.io/spacejaguar/pen/KrvqNWFormular init und Feld init Ereignisse funktionieren nicht in parsley.js

html:

<form data-parsley-validate> 
    <label for="name">Name:</label> 
    <input type="text" name="name" required> 
    <br> 
    <input type="submit" value="validate"> 

    <p><small>This is a simplistic example, good to start from when giving examples of use of Parsley</small></p> 
</form> 

und JS

$(function() { 
    $('form').parsley() 
    .on('form:init', function() { 
     console.log('Form init', arguments); 
    }) 
    .on('field:init', function() { 
     console.log('Field init', arguments); 
    }) 
    .on('form:validate', function() { 
     console.log('Form validate', arguments); 
    }) 
    .on('form:submit', function() { 
     return false; // Don't submit form for this demo 
    }); 
}); 

Es scheint, dass Form: init oder Feld: init Callback-Funktionen werden überhaupt nicht aufgerufen, während jede andere funktioniert gut. Was mache ich falsch? Oder vielleicht ist es ein Fehler?

[EDIT]
Ich schaute in den Quellcode und einige Debug-Sachen, es scheint, dass init-Ereignis ausgelöst wird, bevor ein Listener angeschlossen wurde. Petersilie Instanz sieht gleich:

  • $ .fn.parsley genannt wird
    - neue ParsleyFactory erstellt wird, ruft init fn
    --- ParsleyFactory.prototype.init validates Config usw. und Anrufe binden fn
    ---- ParsleyFactory.prototype.bind entscheidet, welche Konstruktor zu erstellen (ParsleyForm, ParsleyField oder ParsleyMultiple)
    ----- neue ParsleyForm genannt wird, und gibt beispielsweise
    ---- ParsleyFactory.prototype.bind löst init Ereignis und gibt Instanzzurück --- ParsleyFactory.prototype.init kehrt Instanz
    - ParsleyFactory Konstruktor gibt Instanz
  • $ .fn.parsley Instanz
  • .on (gibt 'Feld: init', function() {... }) wird
+0

Interessant. Also wird '$ .Parsley.on ('form: init')' funktionieren, aber das ist die einzige Möglichkeit, das Ereignis zu fangen. Es wäre wahrscheinlich am besten, das Ereignis direkt nach der Initialisierung auszulösen (sagen wir mal 'setTimeout'). Lust auf eine PR schreiben? –

+0

Ich fürchte, ich kann das in naher Zukunft nicht, aber ich werde es später versuchen. – RamboBambo

Antwort

1

Ich hatte das gleiche Problem und dank Ihrer Nachforschungen über die Ereignisauslösung habe ich eine Lösung gefunden. Verbinden Sie einfach den Event-Handler mit dem Objekt window.Parsley und es wird gut funktionieren.

Zum Beispiel:

window.Parsley.on('form:init',() => console.log('form:init')) 
+0

Ja, es löst das Problem irgendwie, aber bedenken Sie, dass Sie auf diese Weise 'form: init' global binden und es für jede Petersilien-Instanz aufgerufen wird. – RamboBambo

+0

Das ist wahr. In diesem Fall hatte ich nur eine Form. Um ehrlich zu sein, ist mir die Ereignisbindung in Petersilie nicht wirklich klar. – Jonathan