adding ng:submit directive for use with forms

IgorMinar · mhevery · commit 04a4d8b061d9 · 2010-10-23T14:22:54.000-07:00
- allows for binding angular expressions to onsubmit events
- prevent default submit action (page reload)
diff --git a/src/directives.js b/src/directives.js
@@ -218,6 +218,25 @@ angularDirective("ng:click", function(expression, element){
   };
 });
 
+
+/**
+ * Enables binding angular expressions to onsubmit events.
+ *
+ * Additionally it prevents the default action (which for form means sending the request to the
+ * server and reloading the current page).
+ */
+angularDirective("ng:submit", function(expression, element) {
+  return function(element) {
+    var self = this;
+    element.bind('submit', function(event) {
+      self.$tryEval(expression, element);
+      self.$root.$eval();
+      event.preventDefault();
+    });
+  };
+});
+
+
 angularDirective("ng:watch", function(expression, element){
   return function(element){
     var self = this;
diff --git a/test/directivesSpec.js b/test/directivesSpec.js
@@ -195,6 +195,20 @@ describe("directives", function(){
     });
   });
 
+
+  describe('ng:submit', function() {
+    it('should get called on form submit', function() {
+      var scope = compile('<form action="" ng:submit="submitted = true">' +
+                            '<input id="submit" type="submit"/>' +
+                          '</form>');
+      scope.$eval();
+      expect(scope.submitted).not.toBeDefined();
+
+      browserTrigger(element.children()[0]);
+      expect(scope.submitted).toEqual(true);
+    });
+  });
+
   it('should ng:class', function(){
     var scope = compile('<div class="existing" ng:class="[\'A\', \'B\']"></div>');
     scope.$eval();
