@dile/crud 0.0.45 → 0.0.47

package/components/ajax/src/DileAjax.js

@@ -9,22 +9,32 @@ export class DileAjax extends DileAxios(DileI18nMixin(LitElement)) {
       method: { type: String },
       url: { type: String },
       statusSuccessCodes: { type: Array },
+      sendDataAsFormData: { type: Boolean },
     }
   }
 
   constructor() {
     super();
-    this.data = {};
     this.method = 'post';
     this.url = '';
     this.statusSuccessCodes = [200, 201];
   }
 
+  get computedData() {
+    if(this.formData) {
+      return this.formData;
+    }
+    return this.data || {};
+  }
+
   generateRequest() {
     let request;
+    if(this.sendDataAsFormData) {
+      this._prepareFormData();
+    }
     switch(this.method.toLowerCase().trim()) {
       case 'post':
-        request = this.axiosInstance.post(this.url, this.data);
+        request = this.axiosInstance.post(this.url, this.computedData);
         break;
       case 'get':
         request = this.axiosInstance.get(this.url, {
@@ -32,13 +42,13 @@ export class DileAjax extends DileAxios(DileI18nMixin(LitElement)) {
         });
         break;
       case 'put':
-        request = this.axiosInstance.put(this.url, this.data);
+        request = this.axiosInstance.put(this.url, this.computedData);
         break;
       case 'delete':
-        request = this.axiosInstance.delete(this.url, this.data);
+        request = this.axiosInstance.delete(this.url, this.computedData);
         break;
       case 'patch':
-        request = this.axiosInstance.patch(this.url, this.data);
+        request = this.axiosInstance.patch(this.url, this.computedData);
         break
     }
     request.then((response) => {
@@ -62,6 +72,9 @@ export class DileAjax extends DileAxios(DileI18nMixin(LitElement)) {
     .catch(err => {
       this.describeError(err);
     }) 
+    .finally(() => {
+      this.formData = null;
+    });
   }
 
   describeError(err) {
@@ -110,5 +123,23 @@ export class DileAjax extends DileAxios(DileI18nMixin(LitElement)) {
       } 
     }));
   }
+
+  _prepareFormData() {
+    this._createFormData();
+    this._addObjectToFormData(this.data);
+  }
+
+  _createFormData() {
+    this.formData = new FormData();
+  }
+
+  _addObjectToFormData(data) {
+    if (!this.formData) {
+      this.createFormData();
+    }
+    for (const key in data) {
+      this.formData.append(key, data[key]);
+    }
+  }
 }
 

package/components/ajax-form/src/DileAjaxForm.js

@@ -18,7 +18,7 @@ export class DileAjaxForm extends DileI18nMixin(LitElement) {
                 --dile-button-font-size: 0.875rem;
             }
             .actions {
-                margin-top: var(--dile-ajax-form-actions-margin-top, 1.2rem);
+                margin-top: var(--dile-ajax-form-actions-margin-top, 1rem);
                 padding-left: 3px;
             }
         `
@@ -36,6 +36,7 @@ export class DileAjaxForm extends DileI18nMixin(LitElement) {
         formIdentifier: { type: String, },
         setDataOnInit: { type: Boolean },
         responseAdapter: { type: Object },
+        sendDataAsFormData: { type: Boolean },
       };
     }
 
@@ -98,6 +99,7 @@ export class DileAjaxForm extends DileI18nMixin(LitElement) {
                 @ajax-success="${this.doSuccessSave}"
                 @ajax-error="${this.doErrorSave}"
                 language="${this.language}"
+                ?sendDataAsFormData=${this.sendDataAsFormData}
             ></dile-ajax>
         `
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dile/crud",
-  "version": "0.0.45",
+  "version": "0.0.47",
   "description": "Components to create a generic crud system based on Web Components and Lit",
   "main": "index.js",
   "scripts": {
@@ -24,12 +24,12 @@
   },
   "homepage": "https://dile-components.polydile.com/",
   "dependencies": {
-    "@dile/ui": "^2.1.22",
+    "@dile/ui": "^2.1.24",
     "axios": "^1.7.2",
     "lit": "^2.7.0 || ^3.0.0"
   },
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "1b91b1404247bf86e6b04ea12793d5d6235a5f50"
+  "gitHead": "a4a717f1aa0deee5f86b7c74b53a9ccaee11552d"
 }