#121: Support data-bv-onsuccess, data-bv-onerror attributes on form

dist/css/bootstrapValidator.min.css

@@ -2,7 +2,7 @@
  * BootstrapValidator (http://bootstrapvalidator.com)
  * The best jQuery plugin to validate form fields. Designed to use with Bootstrap 3
  *
- * @version     v0.5.0-dev, built on 2014-06-27 2:05:03 PM
+ * @version     v0.5.0-dev, built on 2014-06-29 9:01:15 AM
  * @author      https://twitter.com/nghuuphuoc
  * @copyright   (c) 2013 - 2014 Nguyen Huu Phuoc
  * @license     MIT

dist/js/bootstrapValidator.js

@@ -2,7 +2,7 @@
  * BootstrapValidator (http://bootstrapvalidator.com)
  * The best jQuery plugin to validate form fields. Designed to use with Bootstrap 3
  *
- * @version     v0.5.0-dev, built on 2014-06-27 2:05:03 PM
+ * @version     v0.5.0-dev, built on 2014-06-29 9:01:15 AM
  * @author      https://twitter.com/nghuuphuoc
  * @copyright   (c) 2013 - 2014 Nguyen Huu Phuoc
  * @license     MIT
@@ -61,6 +61,8 @@
                     submitButtons:  this.$form.attr('data-bv-submitbuttons'),
                     threshold:      this.$form.attr('data-bv-threshold'),
                     live:           this.$form.attr('data-bv-live'),
+                    onSuccess:      this.$form.attr('data-bv-onsuccess'),
+                    onError:        this.$form.attr('data-bv-onerror'),
                     fields:         {},
                     feedbackIcons: {
                         valid:      this.$form.attr('data-bv-feedbackicons-valid'),
@@ -107,6 +109,18 @@
             this.$form.trigger($.Event('init.form.bv'), {
                 options: this.options
             });
+
+            // Prepare the events
+            if (this.options.onSuccess) {
+                this.$form.on('success.form.bv', function(e) {
+                    $.fn.bootstrapValidator.helpers.call(that.options.onSuccess, [e]);
+                });
+            }
+            if (this.options.onError) {
+                this.$form.on('error.form.bv', function(e) {
+                    $.fn.bootstrapValidator.helpers.call(that.options.onError, [e]);
+                });
+            }
         },
 
         /**

src/js/bootstrapValidator.js

@@ -60,6 +60,8 @@
                     submitButtons:  this.$form.attr('data-bv-submitbuttons'),
                     threshold:      this.$form.attr('data-bv-threshold'),
                     live:           this.$form.attr('data-bv-live'),
+                    onSuccess:      this.$form.attr('data-bv-onsuccess'),
+                    onError:        this.$form.attr('data-bv-onerror'),
                     fields:         {},
                     feedbackIcons: {
                         valid:      this.$form.attr('data-bv-feedbackicons-valid'),
@@ -106,6 +108,18 @@
             this.$form.trigger($.Event('init.form.bv'), {
                 options: this.options
             });
+
+            // Prepare the events
+            if (this.options.onSuccess) {
+                this.$form.on('success.form.bv', function(e) {
+                    $.fn.bootstrapValidator.helpers.call(that.options.onSuccess, [e]);
+                });
+            }
+            if (this.options.onError) {
+                this.$form.on('error.form.bv', function(e) {
+                    $.fn.bootstrapValidator.helpers.call(that.options.onError, [e]);
+                });
+            }
         },
 
         /**

test/spec.js

@@ -54,6 +54,192 @@ describe('api', function() {
     });
 });
 
+var My = {
+    NameSpace: {
+        onEmailValid: function(e, data) {
+            $('#msg').html('My.NameSpace.onEmailValid() called, ' + data.field + ' is valid');
+        },
+
+        onEmailInvalid: function(e, data) {
+            $('#msg').html('My.NameSpace.onEmailInvalid() called, ' + data.field + ' is invalid');
+        },
+
+        onFormValid: function(e) {
+            $('#msg').html('My.NameSpace.onFormValid() called, form ' + $(e.target).attr('id') + ' is valid');
+        },
+
+        onFormInvalid: function(e) {
+            $('#msg').html('My.NameSpace.onFormInvalid() called, form ' + $(e.target).attr('id') + ' is invalid');
+        }
+    }
+};
+
+// ---
+// Form events
+// ---
+
+function onFormValid(e) {
+    $('#msg').html('form ' + $(e.target).attr('id') + ' is valid');
+};
+
+function onFormInvalid(e) {
+    $('#msg').html('form ' + $(e.target).attr('id') + ' is invalid');
+};
+
+describe('event form attribute callback global', function() {
+    beforeEach(function() {
+        $([
+            '<form class="form-horizontal" id="eventForm" data-bv-onsuccess="onFormValid" data-bv-onerror="onFormInvalid" >',
+                '<div id="msg"></div>',
+                '<div class="form-group">',
+                    '<input type="text" name="email" required data-bv-emailaddress />',
+                '</div>',
+            '</form>'
+        ].join('\n')).appendTo('body');
+
+        $('#eventForm').bootstrapValidator();
+
+        this.bv     = $('#eventForm').data('bootstrapValidator');
+        this.$email = this.bv.getFieldElements('email');
+    });
+
+    afterEach(function() {
+        $('#eventForm').bootstrapValidator('destroy').remove();
+    });
+
+    it('call data-bv-onsuccess', function() {
+        this.$email.val('email@domain.com');
+        this.bv.validate();
+        expect($('#msg').html()).toEqual('form eventForm is valid');
+    });
+
+    it('call data-bv-onerror', function() {
+        this.$email.val('email@domain');
+        this.bv.validate();
+        expect($('#msg').html()).toEqual('form eventForm is invalid');
+    });
+});
+
+describe('event form attribute callback namespace', function() {
+    beforeEach(function() {
+        $([
+            '<form class="form-horizontal" id="eventForm" data-bv-onsuccess="My.NameSpace.onFormValid" data-bv-onerror="My.NameSpace.onFormInvalid" >',
+                '<div id="msg"></div>',
+                '<div class="form-group">',
+                    '<input type="text" name="email" required data-bv-emailaddress />',
+                '</div>',
+            '</form>'
+        ].join('\n')).appendTo('body');
+
+        $('#eventForm').bootstrapValidator();
+
+        this.bv     = $('#eventForm').data('bootstrapValidator');
+        this.$email = this.bv.getFieldElements('email');
+    });
+
+    afterEach(function() {
+        $('#eventForm').bootstrapValidator('destroy').remove();
+    });
+
+    it('call data-bv-onsuccess', function() {
+        this.$email.val('email@domain.com');
+        this.bv.validate();
+        expect($('#msg').html()).toEqual('My.NameSpace.onFormValid() called, form eventForm is valid');
+    });
+
+    it('call data-bv-onerror', function() {
+        this.$email.val('email@domain');
+        this.bv.validate();
+        expect($('#msg').html()).toEqual('My.NameSpace.onFormInvalid() called, form eventForm is invalid');
+    });
+});
+
+describe('event form trigger', function() {
+    beforeEach(function() {
+        $([
+            '<form class="form-horizontal" id="eventForm">',
+                '<div id="msg"></div>',
+                '<div class="form-group">',
+                    '<input type="text" name="email" data-bv-emailaddress />',
+                '</div>',
+            '</form>'
+        ].join('\n')).appendTo('body');
+
+        $('#eventForm')
+            .bootstrapValidator()
+            .on('success.form.bv', function(e) {
+                $('#msg').html('form ' + $(e.target).attr('id') + ' triggered success.form.bv event');
+            })
+            .on('error.form.bv', function(e) {
+                $('#msg').html('form ' + $(e.target).attr('id') + ' triggered error.form.bv event');
+            });
+
+        this.bv     = $('#eventForm').data('bootstrapValidator');
+        this.$email = this.bv.getFieldElements('email');
+    });
+
+    afterEach(function() {
+        $('#eventForm').bootstrapValidator('destroy').remove();
+    });
+
+    it('trigger success.form.bv', function() {
+        this.$email.val('email@domain.com');
+        this.bv.validate();
+        expect($('#msg').html()).toEqual('form eventForm triggered success.form.bv event');
+    });
+
+    it('trigger error.form.bv', function() {
+        this.$email.val('email@domain');
+        this.bv.validate();
+        expect($('#msg').html()).toEqual('form eventForm triggered error.form.bv event');
+    });
+});
+
+describe('event form programmatically', function() {
+    beforeEach(function() {
+        $([
+            '<form class="form-horizontal" id="eventForm">',
+                '<div id="msg"></div>',
+                '<div class="form-group">',
+                    '<input type="text" name="email" data-bv-emailaddress />',
+                '</div>',
+            '</form>'
+        ].join('\n')).appendTo('body');
+
+        $('#eventForm').bootstrapValidator({
+            onSuccess: function(e) {
+                $('#msg').html('onSuccess() called');
+            },
+            onError: function(e) {
+                $('#msg').html('onError() called');
+            }
+        });
+
+        this.bv     = $('#eventForm').data('bootstrapValidator');
+        this.$email = this.bv.getFieldElements('email');
+    });
+
+    afterEach(function() {
+        $('#eventForm').bootstrapValidator('destroy').remove();
+    });
+
+    it('call onSuccess()', function() {
+        this.$email.val('email@domain.com');
+        this.bv.validate();
+        expect($('#msg').html()).toEqual('onSuccess() called');
+    });
+
+    it('call onError()', function() {
+        this.$email.val('email@domain');
+        this.bv.validate();
+        expect($('#msg').html()).toEqual('onError() called');
+    });
+});
+
+// ---
+// Field events
+// ---
+
 function onEmailValid(e, data) {
     $('#msg').html(data.field + ' is valid');
 };
@@ -64,18 +250,15 @@ function onEmailInvalid(e, data) {
 
 describe('event field attribute callback global', function() {
     beforeEach(function() {
-        var html = [
-            '<div class="container">',
-                '<form class="form-horizontal" id="eventForm">',
-                    '<div id="msg"></div>',
-                    '<div class="form-group">',
-                        '<input type="text" name="email" data-bv-emailaddress data-bv-onsuccess="onEmailValid" data-bv-onerror="onEmailInvalid" />',
-                    '</div>',
-                '</form>',
-            '</div>'
-        ].join('\n');
+        $([
+            '<form class="form-horizontal" id="eventForm">',
+                '<div id="msg"></div>',
+                '<div class="form-group">',
+                    '<input type="text" name="email" data-bv-emailaddress data-bv-onsuccess="onEmailValid" data-bv-onerror="onEmailInvalid" />',
+                '</div>',
+            '</form>'
+        ].join('\n')).appendTo('body');
 
-        $(html).appendTo('body');
         $('#eventForm').bootstrapValidator();
 
         this.bv     = $('#eventForm').data('bootstrapValidator');
@@ -83,7 +266,7 @@ describe('event field attribute callback global', function() {
     });
 
     afterEach(function() {
-        $('#eventForm').bootstrapValidator('destroy').parent().remove();
+        $('#eventForm').bootstrapValidator('destroy').remove();
     });
 
     it('call data-bv-onsuccess', function() {
@@ -99,32 +282,17 @@ describe('event field attribute callback global', function() {
     });
 });
 
-var My = {
-    NameSpace: {
-        onEmailValid: function(e, data) {
-            $('#msg').html('My.NameSpace.onEmailValid() called, ' + data.field + ' is valid');
-        },
-
-        onEmailInvalid: function(e, data) {
-            $('#msg').html('My.NameSpace.onEmailInvalid() called, ' + data.field + ' is invalid');
-        }
-    }
-};
-
 describe('event field attribute callback namespace', function() {
     beforeEach(function() {
-        var html = [
-            '<div class="container">',
-                '<form class="form-horizontal" id="eventForm">',
-                    '<div id="msg"></div>',
-                    '<div class="form-group">',
-                        '<input type="text" name="email" data-bv-emailaddress data-bv-onsuccess="My.NameSpace.onEmailValid" data-bv-onerror="My.NameSpace.onEmailInvalid" />',
-                    '</div>',
-                '</form>',
-            '</div>'
-        ].join('\n');
+        $([
+            '<form class="form-horizontal" id="eventForm">',
+                '<div id="msg"></div>',
+                '<div class="form-group">',
+                    '<input type="text" name="email" data-bv-emailaddress data-bv-onsuccess="My.NameSpace.onEmailValid" data-bv-onerror="My.NameSpace.onEmailInvalid" />',
+                '</div>',
+            '</form>'
+        ].join('\n')).appendTo('body');
 
-        $(html).appendTo('body');
         $('#eventForm').bootstrapValidator();
 
         this.bv     = $('#eventForm').data('bootstrapValidator');
@@ -132,7 +300,7 @@ describe('event field attribute callback namespace', function() {
     });
 
     afterEach(function() {
-        $('#eventForm').bootstrapValidator('destroy').parent().remove();
+        $('#eventForm').bootstrapValidator('destroy').remove();
     });
 
     it('call data-bv-onsuccess', function() {
@@ -150,18 +318,15 @@ describe('event field attribute callback namespace', function() {
 
 describe('event field trigger', function() {
     beforeEach(function() {
-        var html = [
-            '<div class="container">',
-                '<form class="form-horizontal" id="eventForm">',
-                    '<div id="msg"></div>',
-                    '<div class="form-group">',
-                        '<input type="text" name="email" data-bv-emailaddress />',
-                    '</div>',
-                '</form>',
-            '</div>'
-        ].join('\n');
+        $([
+            '<form class="form-horizontal" id="eventForm">',
+                '<div id="msg"></div>',
+                '<div class="form-group">',
+                    '<input type="text" name="email" data-bv-emailaddress />',
+                '</div>',
+            '</form>'
+        ].join('\n')).appendTo('body');
 
-        $(html).appendTo('body');
         $('#eventForm')
             .bootstrapValidator()
             .on('success.field.bv', '[name="email"]', function(e, data) {
@@ -176,7 +341,7 @@ describe('event field trigger', function() {
     });
 
     afterEach(function() {
-        $('#eventForm').bootstrapValidator('destroy').parent().remove();
+        $('#eventForm').bootstrapValidator('destroy').remove();
     });
 
     it('trigger success.field.bv', function() {
@@ -194,18 +359,15 @@ describe('event field trigger', function() {
 
 describe('event field programmatically', function() {
     beforeEach(function() {
-        var html = [
-            '<div class="container">',
-                '<form class="form-horizontal" id="eventForm">',
-                    '<div id="msg"></div>',
-                    '<div class="form-group">',
-                        '<input type="text" name="email" data-bv-emailaddress />',
-                    '</div>',
-                '</form>',
-            '</div>'
-        ].join('\n');
+        $([
+            '<form class="form-horizontal" id="eventForm">',
+                '<div id="msg"></div>',
+                '<div class="form-group">',
+                    '<input type="text" name="email" data-bv-emailaddress />',
+                '</div>',
+            '</form>'
+        ].join('\n')).appendTo('body');
 
-        $(html).appendTo('body');
         $('#eventForm').bootstrapValidator({
             fields: {
                 email: {
@@ -227,7 +389,7 @@ describe('event field programmatically', function() {
     });
 
     afterEach(function() {
-        $('#eventForm').bootstrapValidator('destroy').parent().remove();
+        $('#eventForm').bootstrapValidator('destroy').remove();
     });
 
     it('call onSuccess()', function() {

test/spec/event.js

@@ -1,3 +1,189 @@
+var My = {
+    NameSpace: {
+        onEmailValid: function(e, data) {
+            $('#msg').html('My.NameSpace.onEmailValid() called, ' + data.field + ' is valid');
+        },
+
+        onEmailInvalid: function(e, data) {
+            $('#msg').html('My.NameSpace.onEmailInvalid() called, ' + data.field + ' is invalid');
+        },
+
+        onFormValid: function(e) {
+            $('#msg').html('My.NameSpace.onFormValid() called, form ' + $(e.target).attr('id') + ' is valid');
+        },
+
+        onFormInvalid: function(e) {
+            $('#msg').html('My.NameSpace.onFormInvalid() called, form ' + $(e.target).attr('id') + ' is invalid');
+        }
+    }
+};
+
+// ---
+// Form events
+// ---
+
+function onFormValid(e) {
+    $('#msg').html('form ' + $(e.target).attr('id') + ' is valid');
+};
+
+function onFormInvalid(e) {
+    $('#msg').html('form ' + $(e.target).attr('id') + ' is invalid');
+};
+
+describe('event form attribute callback global', function() {
+    beforeEach(function() {
+        $([
+            '<form class="form-horizontal" id="eventForm" data-bv-onsuccess="onFormValid" data-bv-onerror="onFormInvalid" >',
+                '<div id="msg"></div>',
+                '<div class="form-group">',
+                    '<input type="text" name="email" required data-bv-emailaddress />',
+                '</div>',
+            '</form>'
+        ].join('\n')).appendTo('body');
+
+        $('#eventForm').bootstrapValidator();
+
+        this.bv     = $('#eventForm').data('bootstrapValidator');
+        this.$email = this.bv.getFieldElements('email');
+    });
+
+    afterEach(function() {
+        $('#eventForm').bootstrapValidator('destroy').remove();
+    });
+
+    it('call data-bv-onsuccess', function() {
+        this.$email.val('email@domain.com');
+        this.bv.validate();
+        expect($('#msg').html()).toEqual('form eventForm is valid');
+    });
+
+    it('call data-bv-onerror', function() {
+        this.$email.val('email@domain');
+        this.bv.validate();
+        expect($('#msg').html()).toEqual('form eventForm is invalid');
+    });
+});
+
+describe('event form attribute callback namespace', function() {
+    beforeEach(function() {
+        $([
+            '<form class="form-horizontal" id="eventForm" data-bv-onsuccess="My.NameSpace.onFormValid" data-bv-onerror="My.NameSpace.onFormInvalid" >',
+                '<div id="msg"></div>',
+                '<div class="form-group">',
+                    '<input type="text" name="email" required data-bv-emailaddress />',
+                '</div>',
+            '</form>'
+        ].join('\n')).appendTo('body');
+
+        $('#eventForm').bootstrapValidator();
+
+        this.bv     = $('#eventForm').data('bootstrapValidator');
+        this.$email = this.bv.getFieldElements('email');
+    });
+
+    afterEach(function() {
+        $('#eventForm').bootstrapValidator('destroy').remove();
+    });
+
+    it('call data-bv-onsuccess', function() {
+        this.$email.val('email@domain.com');
+        this.bv.validate();
+        expect($('#msg').html()).toEqual('My.NameSpace.onFormValid() called, form eventForm is valid');
+    });
+
+    it('call data-bv-onerror', function() {
+        this.$email.val('email@domain');
+        this.bv.validate();
+        expect($('#msg').html()).toEqual('My.NameSpace.onFormInvalid() called, form eventForm is invalid');
+    });
+});
+
+describe('event form trigger', function() {
+    beforeEach(function() {
+        $([
+            '<form class="form-horizontal" id="eventForm">',
+                '<div id="msg"></div>',
+                '<div class="form-group">',
+                    '<input type="text" name="email" data-bv-emailaddress />',
+                '</div>',
+            '</form>'
+        ].join('\n')).appendTo('body');
+
+        $('#eventForm')
+            .bootstrapValidator()
+            .on('success.form.bv', function(e) {
+                $('#msg').html('form ' + $(e.target).attr('id') + ' triggered success.form.bv event');
+            })
+            .on('error.form.bv', function(e) {
+                $('#msg').html('form ' + $(e.target).attr('id') + ' triggered error.form.bv event');
+            });
+
+        this.bv     = $('#eventForm').data('bootstrapValidator');
+        this.$email = this.bv.getFieldElements('email');
+    });
+
+    afterEach(function() {
+        $('#eventForm').bootstrapValidator('destroy').remove();
+    });
+
+    it('trigger success.form.bv', function() {
+        this.$email.val('email@domain.com');
+        this.bv.validate();
+        expect($('#msg').html()).toEqual('form eventForm triggered success.form.bv event');
+    });
+
+    it('trigger error.form.bv', function() {
+        this.$email.val('email@domain');
+        this.bv.validate();
+        expect($('#msg').html()).toEqual('form eventForm triggered error.form.bv event');
+    });
+});
+
+describe('event form programmatically', function() {
+    beforeEach(function() {
+        $([
+            '<form class="form-horizontal" id="eventForm">',
+                '<div id="msg"></div>',
+                '<div class="form-group">',
+                    '<input type="text" name="email" data-bv-emailaddress />',
+                '</div>',
+            '</form>'
+        ].join('\n')).appendTo('body');
+
+        $('#eventForm').bootstrapValidator({
+            onSuccess: function(e) {
+                $('#msg').html('onSuccess() called');
+            },
+            onError: function(e) {
+                $('#msg').html('onError() called');
+            }
+        });
+
+        this.bv     = $('#eventForm').data('bootstrapValidator');
+        this.$email = this.bv.getFieldElements('email');
+    });
+
+    afterEach(function() {
+        $('#eventForm').bootstrapValidator('destroy').remove();
+    });
+
+    it('call onSuccess()', function() {
+        this.$email.val('email@domain.com');
+        this.bv.validate();
+        expect($('#msg').html()).toEqual('onSuccess() called');
+    });
+
+    it('call onError()', function() {
+        this.$email.val('email@domain');
+        this.bv.validate();
+        expect($('#msg').html()).toEqual('onError() called');
+    });
+});
+
+// ---
+// Field events
+// ---
+
 function onEmailValid(e, data) {
     $('#msg').html(data.field + ' is valid');
 };
@@ -8,18 +194,15 @@ function onEmailInvalid(e, data) {
 
 describe('event field attribute callback global', function() {
     beforeEach(function() {
-        var html = [
-            '<div class="container">',
-                '<form class="form-horizontal" id="eventForm">',
-                    '<div id="msg"></div>',
-                    '<div class="form-group">',
-                        '<input type="text" name="email" data-bv-emailaddress data-bv-onsuccess="onEmailValid" data-bv-onerror="onEmailInvalid" />',
-                    '</div>',
-                '</form>',
-            '</div>'
-        ].join('\n');
-
-        $(html).appendTo('body');
+        $([
+            '<form class="form-horizontal" id="eventForm">',
+                '<div id="msg"></div>',
+                '<div class="form-group">',
+                    '<input type="text" name="email" data-bv-emailaddress data-bv-onsuccess="onEmailValid" data-bv-onerror="onEmailInvalid" />',
+                '</div>',
+            '</form>'
+        ].join('\n')).appendTo('body');
+
         $('#eventForm').bootstrapValidator();
 
         this.bv     = $('#eventForm').data('bootstrapValidator');
@@ -27,7 +210,7 @@ describe('event field attribute callback global', function() {
     });
 
     afterEach(function() {
-        $('#eventForm').bootstrapValidator('destroy').parent().remove();
+        $('#eventForm').bootstrapValidator('destroy').remove();
     });
 
     it('call data-bv-onsuccess', function() {
@@ -43,32 +226,17 @@ describe('event field attribute callback global', function() {
     });
 });
 
-var My = {
-    NameSpace: {
-        onEmailValid: function(e, data) {
-            $('#msg').html('My.NameSpace.onEmailValid() called, ' + data.field + ' is valid');
-        },
-
-        onEmailInvalid: function(e, data) {
-            $('#msg').html('My.NameSpace.onEmailInvalid() called, ' + data.field + ' is invalid');
-        }
-    }
-};
-
 describe('event field attribute callback namespace', function() {
     beforeEach(function() {
-        var html = [
-            '<div class="container">',
-                '<form class="form-horizontal" id="eventForm">',
-                    '<div id="msg"></div>',
-                    '<div class="form-group">',
-                        '<input type="text" name="email" data-bv-emailaddress data-bv-onsuccess="My.NameSpace.onEmailValid" data-bv-onerror="My.NameSpace.onEmailInvalid" />',
-                    '</div>',
-                '</form>',
-            '</div>'
-        ].join('\n');
-
-        $(html).appendTo('body');
+        $([
+            '<form class="form-horizontal" id="eventForm">',
+                '<div id="msg"></div>',
+                '<div class="form-group">',
+                    '<input type="text" name="email" data-bv-emailaddress data-bv-onsuccess="My.NameSpace.onEmailValid" data-bv-onerror="My.NameSpace.onEmailInvalid" />',
+                '</div>',
+            '</form>'
+        ].join('\n')).appendTo('body');
+
         $('#eventForm').bootstrapValidator();
 
         this.bv     = $('#eventForm').data('bootstrapValidator');
@@ -76,7 +244,7 @@ describe('event field attribute callback namespace', function() {
     });
 
     afterEach(function() {
-        $('#eventForm').bootstrapValidator('destroy').parent().remove();
+        $('#eventForm').bootstrapValidator('destroy').remove();
     });
 
     it('call data-bv-onsuccess', function() {
@@ -94,18 +262,15 @@ describe('event field attribute callback namespace', function() {
 
 describe('event field trigger', function() {
     beforeEach(function() {
-        var html = [
-            '<div class="container">',
-                '<form class="form-horizontal" id="eventForm">',
-                    '<div id="msg"></div>',
-                    '<div class="form-group">',
-                        '<input type="text" name="email" data-bv-emailaddress />',
-                    '</div>',
-                '</form>',
-            '</div>'
-        ].join('\n');
-
-        $(html).appendTo('body');
+        $([
+            '<form class="form-horizontal" id="eventForm">',
+                '<div id="msg"></div>',
+                '<div class="form-group">',
+                    '<input type="text" name="email" data-bv-emailaddress />',
+                '</div>',
+            '</form>'
+        ].join('\n')).appendTo('body');
+
         $('#eventForm')
             .bootstrapValidator()
             .on('success.field.bv', '[name="email"]', function(e, data) {
@@ -120,7 +285,7 @@ describe('event field trigger', function() {
     });
 
     afterEach(function() {
-        $('#eventForm').bootstrapValidator('destroy').parent().remove();
+        $('#eventForm').bootstrapValidator('destroy').remove();
     });
 
     it('trigger success.field.bv', function() {
@@ -138,18 +303,15 @@ describe('event field trigger', function() {
 
 describe('event field programmatically', function() {
     beforeEach(function() {
-        var html = [
-            '<div class="container">',
-                '<form class="form-horizontal" id="eventForm">',
-                    '<div id="msg"></div>',
-                    '<div class="form-group">',
-                        '<input type="text" name="email" data-bv-emailaddress />',
-                    '</div>',
-                '</form>',
-            '</div>'
-        ].join('\n');
-
-        $(html).appendTo('body');
+        $([
+            '<form class="form-horizontal" id="eventForm">',
+                '<div id="msg"></div>',
+                '<div class="form-group">',
+                    '<input type="text" name="email" data-bv-emailaddress />',
+                '</div>',
+            '</form>'
+        ].join('\n')).appendTo('body');
+
         $('#eventForm').bootstrapValidator({
             fields: {
                 email: {
@@ -171,7 +333,7 @@ describe('event field programmatically', function() {
     });
 
     afterEach(function() {
-        $('#eventForm').bootstrapValidator('destroy').parent().remove();
+        $('#eventForm').bootstrapValidator('destroy').remove();
     });
 
     it('call onSuccess()', function() {