javascript - Why is my submit form not being executed in my Meteor app? -


i've got html in meteor app:

<template name="addperson">    . . .    <input id="inputbuttonperson" name="inputbuttonperson" type="submit" value="save person"> </template> 

...and javascript event handler form submit:

template.addperson.events({'submit form': function(event, template) {     alert('reached addperson.submit form');     console.log('reached addperson.submit form');     event.preventdefault();     var firstname = template.find('#firstname').value;     . . . 

...yet "submit" button not firing; see no alert, nor console log text, nor there record added mongodb after mash submit button (inputbuttonperson).

why doesn't template's submit button event handler respond clicking of submit button?

the information provided not sufficient. i'll try construct whole picture out of put question.

let's pretend have template:

<template name="addperson">     <form action="" class="form" method="">         <input type="text" class="form-control" id="firstname" name="firstname">         <input type="submit" class="btn" id="inputbuttonperson" name="inputbuttonperson">     </form> </template> 

important:

  1. there form element. element bind to listen events fires.
  2. we have input firstname id can refer later.
  3. we don't bind value explicitly, however, it's possible bind reactive data source.
  4. i use syntax put submit element, although, use button element. doesn't matter.

and define event listeners:

template.addperson.events({     'submit form': function (event, template) {         console.log('reached addperson.submit form');         console.log(event.target.firstname.value);         event.preventdefault();     } }); 

few more things take account:

  1. we refer addperson property of template object, i.e. referring precisely template defined above.
  2. the event submit form means fires when user submits form. it's not simple button click. can fired either [type=submit] element or pressing return key in form field.
  3. the function bound event has 2 parameters: event object , template instance object. actually, no need use latter. event object sufficient 99% time.
  4. we console.log value of event.target.firstname. event.target object contains elements children of event target. since we're listening form's event, target form, event.target object contains form's children. it's possible access form's children names, hence event.target.firstname.
  5. the value property of particular target child extracts value attribute of dom element. input fields have values. event.target.firstname.value expression return whatever has been typed field @ moment event has been fired.
  6. and event.preventdefault() not redirected whatever url defined action of form.

this setup works perfectly. please code , see particular point have missed out. either misplace elements in form hierarchy, feel according problem you're having.


Comments

Popular posts from this blog

javascript - Chart.js (Radar Chart) different scaleLineColor for each scaleLine -

apache - Error with PHP mail(): Multiple or malformed newlines found in additional_header -

java - Android – MapFragment overlay button shadow, just like MyLocation button -