Fixed forms submission in IE (fixes getgrav#19)

CHANGELOG.md

@@ -1,3 +1,9 @@
+# v0.2.1
+## XX/XX/2015
+
+1. [](#bugfix)
+    * Fixed form submission not working in IE
+
 # v0.2.0
 ## 08/06/2015
 

themes/grav/js/form-attr.polyfill.js

@@ -0,0 +1,78 @@
+(function($) {
+    $(function() {
+        /**
+         * polyfill for html5 form attr
+         */
+
+        // detect if browser supports this
+        var sampleElement = $('[form]').get(0);
+        var isIE11 = !(window.ActiveXObject) && "ActiveXObject" in window;
+        if (sampleElement && window.HTMLFormElement && sampleElement.form instanceof HTMLFormElement && !isIE11) {
+            // browser supports it, no need to fix
+            return;
+        }
+
+        /**
+         * Append a field to a form
+         *
+         */
+        $.fn.appendField = function(data) {
+            // for form only
+            if (!this.is('form')) return;
+
+            // wrap data
+            if (!$.isArray(data) && data.name && data.value) {
+                data = [data];
+            }
+
+            var $form = this;
+
+            // attach new params
+            $.each(data, function(i, item) {
+                $('<input/>')
+                    .attr('type', 'hidden')
+                    .attr('name', item.name)
+                    .val(item.value).appendTo($form);
+            });
+
+            return $form;
+        };
+
+        /**
+         * Find all input fields with form attribute point to jQuery object
+         *
+         */
+        $('form[id]').submit(function(e) {
+            // serialize data
+            var data = $('[form=' + this.id + ']').serializeArray();
+            // append data to form
+            $(this).appendField(data);
+        }).each(function() {
+            var form    = this,
+                $fields = $('[form=' + this.id + ']');
+
+            $fields.filter('button, input').filter('[type=reset],[type=submit]').click(function() {
+                var type = this.type.toLowerCase();
+                if (type === 'reset') {
+                    // reset form
+                    form.reset();
+                    // for elements outside form
+                    $fields.each(function() {
+                        this.value = this.defaultValue;
+                        this.checked = this.defaultChecked;
+                    }).filter('select').each(function() {
+                        $(this).find('option').each(function() {
+                            this.selected = this.defaultSelected;
+                        });
+                    });
+                } else if (type.match(/^submit|image$/i)) {
+                    $(form).appendField({
+                        name: this.name,
+                        value: this.value
+                    }).submit();
+                }
+            });
+        });
+    });
+
+})(jQuery);

themes/grav/scss/template/_forms.scss

@@ -352,7 +352,7 @@ form {
             content:"\f00c";
             font-family: "FontAwesome";
             font-size: 1.2rem;
-            line-height: 1.5rem;
+            line-height: 1;
             text-align: center;
         }
 

themes/grav/templates/partials/base.html.twig

@@ -56,6 +56,10 @@
         {% do assets.addJs(theme_url~'/js/forms/fields/toggle.js') %}
         {% do assets.addJs(theme_url~'/js/forms.js') %}
 
+        {% if browser.getBrowser == 'msie' %}
+            {% do assets.addJs(theme_url~'/js/form-attr.polyfill.js') %}
+        {% endif %}
+
         {{ assets.js() }}
     {% endblock %}
 {% endblock %}