datatable.directory/resources/assets/js/components/DraftNotePage.js

import { query } from './table-editor-utils'

export default function (opts) {
  let $note = $('#field-note')
  let $submit = $('#submit-button')
  let $emptyPrompt = $('#empty-note-prompt')
  let lastText = $note.val().trim()

  let handler = _.debounce(function () {
    query(opts.route, {
      action: 'note.set',
      text: lastText
    })
  }, 350)

  $note.on('input', () => {
    let text = $note.val().trim()
    if (text !== lastText) {
      lastText = text
      handler()

      let empty = text.length === 0
      if (opts.anyChanges) {
        $submit.toggleClass('disabled', empty)
      }

      // Hide prompt text if anything is written
      $emptyPrompt.toggleClass('hidden', !empty)
    }
  })

  // prevent submit with empty note
  $submit.on('click', (e) => {
    if ($note.val().trim().length === 0) {
      e.preventDefault()
    }
  })
}