Невозможно вставить строку в Trix Editor - PullRequest
0 голосов
/ 28 августа 2018

У меня есть форма приложения Rails 5. Рядом с формой есть кнопка. При каждом нажатии кнопки форма автоматически заполняется. Работает очень хорошо. Однако теперь я хочу использовать Trix editor , чтобы добавить некоторые опции редактирования в поле text_area. Поле notes в форме является trix_editor.

Однако, когда я нажимаю кнопку для автоматического заполнения формы, она не внедряет содержимое в редактор Trix. Как я могу убедиться, что это произойдет?

Вот форма тренировки

.panel-body
  .form-group.has-feedback
    .text-muted
      = f.label 'Name the workout'
    = f.text_field :title, class: 'form-control'

  .form-group.has-feedback
    .text-muted
      = f.label :kind, 'Swim, Bike or Run?'
    = f.select :kind, Workout.kinds.keys.to_a.map { |s| [s.humanize, s] }, {}, class: 'form-control bootstrap-select'

  .form-group.has-feedback
    .text-muted
      = f.label :kind, 'Distance (km)'
    = f.number_field :distance, class: 'form-control', step: :any

  .form-group.has-feedback
    .text-muted
      = f.label :kind, 'Duration (Minutes)'
    = f.number_field :duration, class: 'form-control'

  .form-group.has-feedback
    .text-muted
      = f.label :kind, 'Notes'
    = f.trix_editor :notes

  .form-group.has-feedback
    .text-muted
      = f.label 'Insert Youtube or Vimeo link'
    = f.text_field :video, class: 'form-control'

Вот кнопка, которая запускает автоматическое заполнение

a data-type="useTemplate" data-title=template.title data-kind=template.kind data-distance=template.distance data-duration=template.duration data-notes=template.notes data-video=template.video class="text-default"

а вот CoffeeScript:

$ ->
  $('a[data-type="useTemplate"]').click (e) ->
    $('#workout_title').val(e.target.dataset.title)
    $('#workout_kind').val(e.target.dataset.kind)
    $('#workout_distance').val(e.target.dataset.distance)
    $('#workout_duration').val(e.target.dataset.duration)
    $('#workout_notes').val(e.target.dataset.notes)
    $('#workout_video').val(e.target.dataset.video)

Любая помощь будет высоко ценится!

1 Ответ

0 голосов
/ 28 августа 2018

Чтобы вставить контент в редактор trix, вам нужно использовать Trix API:

// Assuming #workout_notes is a <trix-editor> element.
$("#workout_notes").get(0).editor.insertString(e.target.dataset.notes)

См. документацию для получения дополнительной информации.

...