enh #6 - FormData

loveorigami · Apr 24, 2018 · b77479a · b77479a
1 parent e5978ff
commit b77479a
Show file tree

Hide file tree

Showing 3 changed files with 67 additions and 25 deletions.
diff --git a/README.md b/README.md
@@ -109,19 +109,14 @@ echo ModalAjax::widget([
 ```
 
 ### Index View - Update (Multi Modal Mode)
-Grid example with data-scenario
-```html
-<a class="btn" href="/site/update?id=10" title="Edit ID-10" data-scenario="hello">Hello</a>
-<a class="btn" href="/site/update?id=20" title="Edit ID-20" data-scenario="goodbye">Goodbye</a>
-```
+
 Modal Ajax with events
 ```php
 use lo\widgets\modal\ModalAjax;
 
 echo ModalAjax::widget([
     'id' => 'updateCompany',
     'selector' => 'a.btn', // all buttons in grid view with href attribute
-    'ajaxSubmit' => true, // Submit the contained form as ajax, true by default
 
     'options' => ['class' => 'header-primary'],
     'pjaxContainer' => '#grid-company-pjax',
@@ -146,6 +141,27 @@ echo ModalAjax::widget([
     ]
 
 ]);
+
+//Grid example with data-scenario
+
+Pjax::begin([
+    'id' => 'grid-company-pjax',
+    'timeout' => 5000,
+]); 
+
+echo GridView::widget([
+    'dataProvider' => $dataProvider,
+    'columns' => [
+	      ......................
+		// Action buttons  
+		// <a class="btn" href="/site/update?id=10" title="Edit ID-10" data-scenario="hello">Hello</a>
+		// <a class="btn" href="/site/update?id=20" title="Edit ID-20" data-scenario="goodbye">Goodbye</a>
+          ......................
+    ],
+]); 
+
+Pjax::end();
+
 ```
 
 

diff --git a/composer.json b/composer.json
@@ -8,7 +8,7 @@
     "ajax-modal"
   ],
   "homepage": "https://github.com/loveorigami/yii2-modal-ajax",
-  "version": "2.1",
+  "version": "2.2",
   "type": "yii2-extension",
   "license": "MIT",
   "authors": [

diff --git a/src/assets/js/kb-modal-ajax.js b/src/assets/js/kb-modal-ajax.js
@@ -152,27 +152,53 @@
     ModalAjax.prototype.formSubmit = function () {
         var form = jQuery(this.element).find('form');
         var self = this;
-        // Convert form to ajax submit
-        jQuery.ajax({
-            method: form.attr('method'),
-            url: form.attr('action'),
-            data: form.serialize(),
-            context: this,
-            beforeSend: function (xhr, settings) {
-                jQuery(self.element).triggerHandler('kbModalBeforeSubmit', [xhr, settings]);
-            },
-            success: function (data, status, xhr) {
-                var contentType = xhr.getResponseHeader('content-type') || '';
-                if (contentType.indexOf('html') > -1) {
-                    // Assume form contains errors if html
-                    this.injectHtml(data);
-                    status = false;
+        if (form.attr('method') !== 'GET' && window.FormData !== undefined) {
+
+            // Convert form to ajax submit
+            jQuery.ajax({
+                method: form.attr('method'),
+                url: form.attr('action'),
+                data: new FormData(form[0]),
+                processData: false,
+                contentType: false,
+                context: this,
+                beforeSend: function (xhr, settings) {
+                    jQuery(self.element).triggerHandler('kbModalBeforeSubmit', [xhr, settings]);
+                },
+                success: function (data, status, xhr) {
+                    var contentType = xhr.getResponseHeader('content-type') || '';
+                    if (contentType.indexOf('html') > -1) {
+                        // Assume form contains errors if html
+                        this.injectHtml(data);
+                        status = false;
+                    }
+                    jQuery(self.element).triggerHandler('kbModalSubmit', [data, status, xhr, this.selector]);
                 }
-                jQuery(self.element).triggerHandler('kbModalSubmit', [data, status, xhr, this.selector]);
-            }
-        });
+            });
+        } else {
+            // Convert form to ajax submit
+            jQuery.ajax({
+                method: form.attr('method'),
+                url: form.attr('action'),
+                data: form.serialize(),
+                context: this,
+                beforeSend: function (xhr, settings) {
+                    jQuery(self.element).triggerHandler('kbModalBeforeSubmit', [xhr, settings]);
+                },
+                success: function (data, status, xhr) {
+                    var contentType = xhr.getResponseHeader('content-type') || '';
+                    if (contentType.indexOf('html') > -1) {
+                        // Assume form contains errors if html
+                        this.injectHtml(data);
+                        status = false;
+                    }
+                    jQuery(self.element).triggerHandler('kbModalSubmit', [data, status, xhr, this.selector]);
+                }
+            });
+        }
 
         return false;
+
     };
 
     $.fn[pluginName] = function (options) {