CODEWITHSUNDEEP
javascriptjqueryjquery-eventsjeditable
Astronaut
Astronaut

Reputation: 7031

How to add event listeners to jEditable input?

How do I add an event listener to a jEditable input?

By default the ENTER key is used to submit, but I need to have other keys as well to submit value?

 $('.editable').editable(function(value, settings) { 
     console.log(this);
     console.log(value);
     console.log(settings);
     return(value);
  }, { 
     width: "100%"
     onblur: 'submit'
 });

Upvotes: 3

Views: 1995

Answers (2)

creaweb80
creaweb80

Reputation: 13

Jason's solution can't work : jEditable adds form and input on event (click, dbleclick...) so when you executes the function on document ready, they don't exists !

You can modify jEditable adding this code before input.keydown :

input.keyup(function(e){if (e.keyCode === 32 || e.keyCode === 35) alert('Time to submit!');});

Upvotes: 0

Jason Towne
Jason Towne

Reputation: 8050

You could add a keypress event listener to the document to listen for those additional keys being pressed.

jEditable adds a form with a class of editable to the page whenever you start to edit something. Using .on() to register the event listener will make sure the handler gets fired even when the form block is added to the page dynamically.

Here's a working example.

This just shows how you can determine when "space" or "#" are pressed. You'll have to modify the code to work for you.

<form class="editable">
  <input type="text" class="editable" />
</form>​

$(document).ready(function() {
    $('form.editable').on('keypress', function(e) {
        if (e.keyCode === 32 || e.keyCode === 35) alert('Time to submit!');
    });
});​

Upvotes: 2

Related Questions