SemanticUI form validation breaks submit event

help
1

Hello,
It seems that once the code for the built-in semanticUI form validation is placed in the page, the submit event is no longer recognized by Meteor. As soon as I remove the code, it starts catching the event again.

I also created a github issue in the atmospherejs SemanticUI-CSS repo but I was wondering if anyone here can help me.

Is there anything I can do to make the submit event work while using SemanticUI form validation?

Thank you

2

I also ran into this… ended up using the onSuccess callback of the form
http://semantic-ui.com/behaviors/form.html#callbacks
instead of capturing the submit event in Meteor.

3

I use Semantic UI extensively but I’ve opted to use Collection2 and Simple-Schema packages from Atmosphere for validation. I find their validation works quite well and is reactive too.

4

If you are using the semantic-ui package (instead of just semanticui-css), this post on stackoverflow explains that the form element has to be cleared, reset, and also the error class has to be removed from the element containing the form (.canAdd):

function resetForm() {
  var candAdd = $('.candAdd');
  candAdd.form('reset');
  candAdd.form('clear');
  // remove the error class so it wont show error msg ( semantic-ui bug ? )
  candAdd.removeClass('error');
}
5

If you use Collection2 and Simple-Schema like @darkadept, I think you can just call .resetValidation().

Example /client/views/items/item.js

   'click .cancelItem': function(){
      Items.simpleSchema().namedContext('updateForm').resetValidation();
      Items.simpleSchema().namedContext('insertForm').resetValidation();
      Session.set('editItemId', null);
  },