39

I'm using the best_in_place gem on several textareas and sometimes (seemingly randomly) the textarea 'jumps' and triggers the blur event when I click save, prompting the "discard your changes" warning.

Here's the code:

<p>
  Administrator Notes (<%= link_to 'Edit', '#', id: 'edit_notes_link', onclick:
  'event.preventDefault()' %>)
</p>
<div class="panel radius">
  <%= best_in_place [:admin, @booking], :notes, type: :textarea, ok_button:
  'Save', cancel_button: 'Cancel', activator: '#edit_notes_link', display_with:
  :simple_format, nil: '<i>None</i>' %>
</div>

And here's a GIF of the behaviour:

(And the video that GIF was taken from)

I'm guessing that there's some JavaScript skulduggery going on somewhere but I don't know where to begin debugging it. If you've seen Best in Place behave like this or you have some pointers for how to debug it then I'd really appreciate some help.

Raghul SK
  • 1,256
  • 5
  • 22
  • 30
Simon
  • 1,716
  • 1
  • 21
  • 37

4 Answers4

1

If you are using firebug try turning on log events to get more information. Here is an article explaining it http://www.softwareishard.com/blog/firebug/firebug-tip-log-dom-events/

romelmederos
  • 198
  • 3
  • 5
1

I was running into the same issue, and just removed the ok_button. It seems to be working fine now.

stevenspiel
  • 5,775
  • 13
  • 60
  • 89
1

I haven't used best-in-place gem but I had a similar requirement. I've used x-editable

Worked really well.

venkatareddy
  • 755
  • 5
  • 14
1

Would recommend breaking down the DOM breakpoint actions and checking the logs first if you are using the basic chrome dev tools , if you have to absolutely use best-in-place. Will help you isolate the issue.

But if not, X-editable is a bit more easier to use.

Priyanjana
  • 11
  • 2