How to disable/activate a dblclick Jquery event

Asked

Viewed 240 times

2

Good morning guys, next, I’m wanting to do a quick CRUD mode, in editing, for example, ADM gives 2 clicks in the field to be edited, and the field becomes editable with 2 buttons to the right, one to confirm and one to cancel.

What I’ve been doing is:

https://jsfiddle.net/gn5pmjzc/

Make the following example:

Give 2 clicks on Roberto Afonso, now give 2 clicks on it again. Note that the text is deleted.

My idea was, prevent this "dlbClick" from running, until the X or V icon was clicked, then remained normal..

How can I do?

Thank you to those who answer!

javascript jquery events

1 answer

2


Since you’re already adding class celulaEmEdicao when the dlbClick occurs, so you can simply check if the class is there and stop the execution if it is.

Thus:

$("td").dblclick(function(e) {
    var originalContent = $(this).text();
    if ($(this).hasClass("celulaEmEdicao")) return e.preventDefault();
    $(this).addClass("celulaEmEdicao");
    // etc...

  • Ahaam, we have a little problem.. Icons to accept editing or not, are not appearing. What happens is that: https://jsfiddle.net/gn5pmjzc/2/ I put the function when clicking outside the "EDIT" closes, now if I need to edit again, do not change the "text" of the input. Because technically you had him cancel that... :(

  • Someone else can help?

  • @Hermus these icons come from where? I think this is CSS right? Boostrap maybe?

  • It is a framework called SEMANTIC-UI.... But the problem is JS even, after "locking" the event, it does not enable use again :/

  • 1

    @Hermus cleaned up your code a little https://jsfiddle.net/gn5pmjzc/3/ but I still don’t understand what doesn’t work. You can try?

  • Old, that was basically it, this example worked perfectly, with the exception that in the console is showing me this error, every time I give 2 clicks in td: Uncaught Typeerror: e.preventDefault is not a Function -- jquery-3.1.0.js:5110

  • I replaced this with: if ($el.hasClass("cellulaEmEdical")) Return Event.preventDefault(); Thank you so much for your help and the time Sergio. Thank you

Show 2 more comments

Browser other questions tagged javascript jquery events

You are not signed in. Login or sign up in order to post.