无法将字符串注入Trix编辑器

时间:2018-08-28 10:26:32

标签: ruby-on-rails basecamp trix

我有一个Rails 5应用程序表单。表格旁边有一个按钮。只要单击一个按钮,表单就会自动填写。效果很好。但是,现在我想使用Trix editor向text_area字段添加一些编辑选项。表单中的notes字段是trix_editor。

但是,当我单击按钮自动填写表格时,它不会将内容注入到Trix编辑器中。我如何确定会发生这种情况?

这是training_form

.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 :(得分:1)

要将内容插入到Trix编辑器中,您需要使用Trix API:

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

有关更多信息,请参见documentation