Почему эта функция отправки в Meteorjs не работает?

Question

У меня есть форма, которая состоит из 7 вопросов. Я спрашиваю их отдельно, используя display: none. Но проблема в том, что функция отправки не работает. Когда я нажимаю на него, он просто перенаправляет обратно на первый вопрос, и URL-адрес обращается к - http://localhost:3000/?problem=&why1=&why2=&why3=&why4=&why5=&solution=&submit-all=Answer. Мне очень нужна помощь в этом, пожалуйста. Ниже приведен код HTML-шаблона и функция отправки JavaScript для отправки в коллекцию «Проблемы».

<template name="submitProblem"> 
 
    <div class="container"> 
 
    <div class="main-page"> 
 
     <form class="text-center"> 
 
     <div id="submit-problem"> 
 
      <input autofocus="autofocus" type="text" name="problem" id="problem" placeholder="What's the problem ?"/> 
 
      <input type="button" id="route" value="Find Its Route" class="route btn btn-sample"> 
 
     </div> 
 

 
     ... 
 
     submit-why1 - submit-why4 
 
     ... 
 

 
     <div id="submit-why5" class="hidden"> 
 
      <input autofocus="autofocus" type="text" id="why5" class="" name="why5" placeholder="This problem exists, because..."/> 
 
      <input type="button" value="Answer" class="btn-success btn answer5"> 
 
      <button class="btn back5 back-btn"><i class="fa fa-arrow-left fa-3x"></i></button> 
 
     </div> 
 

 
     <div id="submit-solution" class="hidden"> 
 
      <input autofocus="autofocus" type="text" name="solution" id="solution" placeholder="What could be the best solution ?"/> 
 
      
 
      <input type="submit" id="submit-all" name="submit-all" value="Answer" class="btn btn-primary submit-all"> 
 

 
      <button class="btn back6 back-btn"><i class="fa fa-arrow-left fa-3x"></i></button> 
 
     </div> 
 
     </form> 
 
    </div> 
 
    </div> 
 
</template>

Template.submitProblem.events({ 
 
    'submit .submit-all':function() { 
 
    event.preventDefault(); 
 
    var problem = $(event.target).find('[name=problem]').val(); 
 
    var why1 = $(event.target).find('[name=why1]').val(); 
 
    var why2 = $(event.target).find('[name=why2]').val(); 
 
    var why3 = $(event.target).find('[name=why3]').val(); 
 
    var why4 = $(event.target).find('[name=why4]').val(); 
 
    var why5 = $(event.target).find('[name=why5]').val(); 
 
    var solution = $(event.target).find('[name=solution]').val(); 
 

 
    Problems.insert({ 
 
     problem: problem, 
 
     why1: why1, 
 
     why2: why2, 
 
     why3: why3, 
 
     why4: why4, 
 
     why5: why5, 
 
     solution: solution, 
 
     submitdate: new Date() 
 
    }); 
 

 
    console.log(problem + why1 + why2 + why3 + why4 + why5 + solution); 
 

 
    Router.go('submitted'); 
 
    } 
 
});

Answer 1

Вам нужно пройти event в качестве первого параметра обработчика:

submit: function(event) { 
    event.preventDefault(); 
    ... 

В противном случае это не будет определено, действие по умолчанию (POST) не будет предотвращено, и ваша страница будет перезагружена.