QfqForm.js: Handle delete button click.

javascript/src/Form.js

@@ -67,7 +67,7 @@ if (!QfqNS) {
     n.Form.prototype.submitTo = function (to) {
         $.post(to, this.$form.serialize())
             .done(this.ajaxSuccessHandler.bind(this))
-            .fail(this.ajaxFailureHandler.bind(this));
+            .fail(this.submitFailureHandler.bind(this));
     };
 
     /**
@@ -87,7 +87,7 @@ if (!QfqNS) {
      *
      * @private
      */
-    n.Form.prototype.ajaxFailureHandler = function (jqXHR, textStatus, errorThrown) {
+    n.Form.prototype.submitFailureHandler = function (jqXHR, textStatus, errorThrown) {
         this.userSubmitFailureHandlers.call(this, textStatus, jqXHR, errorThrown);
     };
 

javascript/src/QfqForm.js

@@ -11,9 +11,10 @@ if (!QfqNS) {
 (function (n) {
     'use strict';
 
-    n.QfqForm = function (formId, submitTo) {
+    n.QfqForm = function (formId, submitTo, deleteUrl) {
         this.formId = formId;
         this.submitTo = submitTo;
+        this.deleteUrl = deleteUrl;
         this.form = new n.Form(this.formId);
         this.bsTabs = null;
 
@@ -22,7 +23,7 @@ if (!QfqNS) {
         this.form.addChangeHandler(this.changeHandler.bind(this));
         this.form.addResetHandler(this.resetHandler.bind(this));
         this.form.addSubmitSuccessHandler(this.submitSuccessDispatcher.bind(this));
-        this.form.addSubmitFailureHandler(this.submitFailureDispatcher.bind(this));
+        this.form.addSubmitFailureHandler(this.submitFailureHandler.bind(this));
 
         this.getSaveButton().click(this.handleSaveClick.bind(this));
         this.getCloseButton().click(this.handleCloseClick.bind(this));
@@ -76,8 +77,73 @@ if (!QfqNS) {
      */
     n.QfqForm.prototype.handleDeleteClick = function () {
         QfqNS.Log.debug("delete click");
+        $.post(this.deleteUrl)
+            .done(this.ajaxDeleteSuccessDispatcher.bind(this))
+            .fail(this.ajaxDeleteFailureHandler.bind(this));
     };
 
+    /**
+     *
+     * @param data
+     * @param textStatus
+     * @param jqXHR
+     *
+     * @private
+     */
+    n.QfqForm.prototype.ajaxDeleteSuccessDispatcher = function (data, textStatus, jqXHR) {
+        if (!data.status) {
+            throw new Error("No 'status' property 'data'");
+        }
+
+        switch (data.status) {
+            case "error":
+                this.handleLogicDeleteError(data);
+                break;
+            case "success":
+                this.handleDeleteSuccess(data);
+                break;
+            default:
+                throw new Error("Status '" + data.status + "' unknown.");
+        }
+    };
+
+    /**
+     *
+     * @param data
+     *
+     * @private
+     */
+    n.QfqForm.prototype.handleDeleteSuccess = function (data) {
+        if (!data.redirect || data.redirect === "client") {
+            window.history.back();
+            return;
+        }
+
+        if (data.redirect === "no") {
+            var alert = new QfqNS.Alert("redirect=='no' not allowed", "error");
+            alert.show();
+            return;
+        }
+
+        if (data.redirect === "url" || data['redirect-url']) {
+            window.location = data['redirect-url'];
+            return;
+        }
+    };
+
+    /**
+     *
+     * @param data
+     *
+     * @private
+     */
+    n.QfqForm.prototype.handleLogicDeleteError = function (data) {
+        if (!data.message) {
+            throw Error("Status is 'error' but required 'message' attribute is missing.");
+        }
+        var alert = new QfqNS.Alert(data.message, "error");
+        alert.show();
+    };
 
     /**
      *
@@ -151,12 +217,29 @@ if (!QfqNS) {
      *
      * @private
      */
-    n.QfqForm.prototype.submitFailureDispatcher = function (jqXHR, textStatus, errorThrown) {
+    n.QfqForm.prototype.submitFailureHandler = function (form, textStatus, jqXHR, errorThrown) {
+        this.showAjaxError(errorThrown);
+    };
+
+    /**
+     *
+     * @param jqXHR
+     * @param textStatus
+     * @param errorThrown
+     *
+     * @private
+     */
+    n.QfqForm.prototype.ajaxDeleteFailureHandler = function (jqXHR, textStatus, errorThrown) {
+        this.showAjaxError(errorThrown);
+    };
+
+    n.QfqForm.prototype.showAjaxError = function (errorThrown) {
         var alert = new QfqNS.Alert("Error:<br> " +
-            errorThrown.status + ": " + errorThrown.statusText, "error");
+            errorThrown, "error");
         alert.show();
     };
 
+
     /**
      * @private
      */

javascript/src/QfqPage.js

@@ -18,13 +18,14 @@ if (!QfqNS) {
                 tabsId: "qfqTabs",
                 formId: "qfqForm",
                 submitTo: "typo3conf/ext/qfq/qfq/api/save.php",
+                deleteUrl: "typo3conf/ext/qfq/qfq/api/delete.php",
                 pageState: new QfqNS.PageState()
             }, settings
         );
 
         this.bsTabs = new QfqNS.BSTabs(this.settings.tabsId);
         try {
-            this.qfqForm = new QfqNS.QfqForm(this.settings.formId, this.settings.submitTo);
+            this.qfqForm = new QfqNS.QfqForm(this.settings.formId, this.settings.submitTo, this.settings.deleteUrl);
             this.qfqForm.setBsTabs(this.bsTabs);
         } catch (e) {
             QfqNS.Log.error(e.message);

mockup/api/delete_client_redirect.json

+{
+  "status": "success",
+  "message": "successfully deleted item",
+  "redirect": "client"
+}
\ No newline at end of file

mockup/api/delete_error.json

+{
+  "status": "error",
+  "message": "error deleting item"
+}
\ No newline at end of file

mockup/api/delete_no_redirect.json

+{
+  "status": "success",
+  "message": "successfully deleted item",
+  "redirect": "no"
+}
\ No newline at end of file

mockup/api/delete_server_redirect.json

+{
+  "status": "success",
+  "message": "successfully deleted item",
+  "redirect": "url",
+  "redirect-url": "http://www.google.ch"
+}
\ No newline at end of file

mockup/personmock.html

@@ -16,6 +16,7 @@
 </head>
 <body>
 
+<label>Submit to
 <select name="submitTo" id="submitTo">
     <option>404 error</option>
     <option>save_error_matno.json</option>
@@ -24,6 +25,17 @@
     <option>save_server_redirect.json</option>
     <option>save_client_redirect.json</option>
 </select>
+</label>
+
+<label>Delete URL
+    <select name="deleteUrl" id="deleteUrl">
+        <option>404 error</option>
+        <option>delete_client_redirect.json</option>
+        <option>delete_error.json</option>
+        <option>delete_no_redirect.json</option>
+        <option>delete_server_redirect.json</option>
+    </select>
+</label>
 
 
 <div class="container-fluid">
@@ -946,7 +958,8 @@
         var qfqPage = new QfqNS.QfqPage({
             tabsId: 'myTabs',
             formId: 'myForm',
-            submitTo: $("#submitTo").val()
+            submitTo: 'api/' + $("#submitTo").val(),
+            deleteUrl: 'api/' + $("#deleteUrl").val()
         });
 
         $("#submitTo").on("change", function (evt) {
@@ -954,6 +967,11 @@
             qfqPage.qfqForm.submitTo = 'api/' + $(evt.target).val();
         });
 
+        $("#deleteUrl").on("change", function (evt) {
+            qfqPage.settings.deleteUrl = 'api/' + $(evt.target).val();
+            qfqPage.qfqForm.deleteUrl = 'api/' + $(evt.target).val();
+        });
+
         QfqNS.Log.level = 0;
     });
 </script>