Jeditable is a great jQuery plugin for when you want to do those neat HTML text fields that turn into input boxes when you click on them, almost like the fields in the GMail contact editor. Whilst working on our all-singing and dancing super interactive web-based time-management tool, we ran into a bug with tho onblur=submit mode of Jeditable. In this mode, clicking anywhere outside of the dynamic input box submits the text. However, clicking on the cancel button would cause a full page reload, something that is less than desirable for highly-interactive single-page HTML apps.

We fixed this bug with a smal patch that you can download here. The fix very simply sets an attribute on the form when the user presses the cancel button. In the blur event handler it checks for this variable and does NOT submit if it’s set.

I also posted a comment concerning this on the Jeditable website.

If this by any chance helps you, pipe up in the comments! We’ll be posting more of these little tidbits in the future.

Tagged with:
 

2 Responses to Programming: Fix for cancel button weirdness with jQuery Jeditable onblur=submit

  1. Simon says:

    This helped me out, cheers!

    Strangely the annoying submit on cancel click didn’t happen in IE8 or Firefox, only Chrome.

  2. Jakub says:

    Thanks from 2014!

    Really helpful :)

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>