Callback after cancelling/resetting an edit, rather than before

[conorhub]

I'm familiar with using the onreset parameter to provide added behaviour to cancelled edits. This occurs just before the container is repopulated with the original value and I can't find a way to take control of what occurs when resetting - only run functions before it happens.

Is there a means to either:

Access the original value and modify it or else have a callback to when the original value has finished populating the editable container, so I can then call a function to modify it. Currently if I try the second approach inside a function called by onreset, it's overridden once reset completes. Even the following would be great:

$('.editable').editable(function(value, settings) {
    var data = jeditableSubmitChange(value);
    return(data);
}, {
    type      : 'textarea',
    event     : 'edit',
    loadurl   : 'services/fetchsource.php',
    cancel    : 'Cancel',
    submit    : 'Confirm',
    loadtext  : 'Loading...',
    indicator : 'Saving...',
    tooltip   : 'Click to edit...',
    cssclass  : 'liveform',
    cancelcssclass : 'button',
    submitcssclass : 'button',
    onreset   : jeditableCancel
});

function jeditableCancel(settings, original_value) {
    // return original_value;
    var modified_value = modifyFunction(original_value);
    return modified_value;
}

[NicolasCARPi]

Hello,

One way I found to solve your issue is to add an onresetcallback function:

diff --git a/src/jquery.jeditable.js b/src/jquery.jeditable.js
index d959ce7..de4a011 100644
--- a/src/jquery.jeditable.js
+++ b/src/jquery.jeditable.js
@@ -109,6 +109,7 @@
         var onedit   = settings.onedit   || function() { };
         var onsubmit = settings.onsubmit || function() { };
         var onreset  = settings.onreset  || function() { };
+        var onresetcallback  = settings.onresetcallback  || function() { };
         var onerror  = settings.onerror  || reset;
         var before   = settings.before || false;

@@ -456,6 +457,10 @@
                         if (settings.tooltip) {
                             $(self).attr('title', settings.tooltip);
                         }
+
+                        if (settings.onresetcallback) {
+                            self.innerHTML = onresetcallback.apply(form, [settings, self]);
+                        }
                     }
                 }
             };

And in your code:

                onresetcallback: function(settings, original) {
                    return original.innerText.toUpperCase());
               }

This allows you to successfully replace the original text on reset event.

If that solution is satisfying, I can add it to the code.

[conorhub]

@NicolasCARPi If it is as straightforward as that, I would very much appreciate it. It would certainly cater to my situation (as niche as it is). Thanks for the speedy reply, suggestion, and providing such a useful plugin.

---

I'm out of my depth here so expect some nativity on my part:

I amended your changes tojquery.jeditable.js with the addition of declaring form like so:

if (settings.onresetcallback) {
        var form = $('<form />');
        self.innerHTML = onresetcallback.apply(form, [settings, self]);
}

I can confirm that adding a setting of:

onresetcallback  : function(settings, original) {
            var parsedText = jeditableCancel(settings, original);
            return parsedText;
        }

Does call the following function successfully:

function jeditableCancel(settings, original) {
        console.log("Confirmation of jeditableCancel function being called");
    var modifiedText = "Test String"
    return modifiedText;
}

However, the original, unmodified text appears in the end. If I run a console log for self.innerHTML it returns "Test String" but this isn't ultimately what is output. You may be well aware of this and I'm probably getting ahead of myself but I thought it was worth noting, incase.

---

A final note that I've realised that if (settings.onresetcallback) {} is being called on page load and not when I cancel an editable form.

[NicolasCARPi]

Thanks for […] providing such a useful plugin.

Oh I'm just the maintainer here. The hard work was done by @tuupola and others. The repo was abandonned by the author, so I asked him if I could maintain it (because I use it in my project) and he kindly transferred the repo to me.

This also means that I'm not really into adding features, but more about fixing bugs and making sure it works with latest jquery version.

That is to say that I will not add the onresetcallback option myself. If you wish to do a PR, I'll consider it but right now as you're the only user requesting this feature, I prefer not to include it.

Cheers, ~Nico

[conorhub]

Sorry for the misunderstanding Nicoloas, though I'll still pass thanks your way for maintaining it.

Also excuse any allusions I made to adding features, I may have leaned in that direction after you originally said:

If that solution is satisfying, I can add it to the code.

Which gave me the impression it was something you were possibly going to do. I understand that this is a niche requirement so there's no need to do so on my behalf if it doesn't benefit many.

I'm pretty mediocre at this stuff and you code you suggested should work is fairly out of scope for some variables it thinks should be available such as self and form, as well as calling itself immediately on page load and affecting the text elements. I'm back tracking again to target them correctly (sorry for the delay) but am wondering if it may be better in the long run for me to make my own small library (for the long-term's sake) if I'm stretching all of the optional parameters here and trying to use some not even included (my niche use is that I'm loading and saving data distinct from what the viewer sees and thinks they're editing. Jeditable takes care of the loading and most of the saving, but can't return the pseudo text correctly if the user cancels).

If I've any success with your example I'll report back, so this is available on the tiny chance somebody else is looking for similar. Thanks again