Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/429.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/85.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript rails中的自动完成_Javascript_Jquery_Ruby On Rails_Ruby On Rails 4_Coffeescript - Fatal编程技术网

Javascript rails中的自动完成

Javascript rails中的自动完成,javascript,jquery,ruby-on-rails,ruby-on-rails-4,coffeescript,Javascript,Jquery,Ruby On Rails,Ruby On Rails 4,Coffeescript,在我的rails应用程序中,这个字段带有autocomplete <%= f.label :company_name, class: "profile_label" %><br /> <%= f.text_field :company_name, data: {autocomplete_source: Company.order(:name).map(&:name) },:autocomplete => :off, class: 'autocompl

在我的rails应用程序中,这个字段带有autocomplete

<%= f.label :company_name, class: "profile_label"  %><br />
<%= f.text_field :company_name, data: {autocomplete_source: Company.order(:name).map(&:name) },:autocomplete => :off, class: 'autocomplete-experience form-control profileform-botttom' %>
jQuery ->
  $('.autocomplete-experience').autocomplete
    source: $('.autocomplete-experience').data('autocomplete-source')
    select: (event,ui) -> $("input.xx").val(ui.item.id)
这只适用于第一个字段。当我添加另一个字段时,我认为添加方法的链接自动完成对第二个字段不起作用。这是为什么?我如何解决

更新

这是用于添加字段的代码

$('form').on 'click', '.add_fields', (event) ->
    time = new Date().getTime()
    regexp = new RegExp($(this).data('id'), 'g')
    $(this).before($(this).data('fields').replace(regexp, time))
    event.preventDefault()
警告信息

> SyntaxError: expected expression, got '<' edit:1069:2 Use of
> getPreventDefault() is deprecated.  Use defaultPrevented instead. edit
> SyntaxError: expected expression, got '<' edit:2:2 SyntaxError:
> expected expression, got '<' edit:2:2

$.autocomplete
调用将只对DOM中所有的元素有效。动态添加字段后,应再次调用
autocomplete

setup_autocomplete = ->
  $('.autocomplete-experience').autocomplete
    source: $('.autocomplete-experience').data('autocomplete-source')
    select: (event,ui) -> $("input.xx").val(ui.item.id)

jQuery ->
  setup_autocomplete()

$('form').on 'click', '.add_fields', (event) ->
  time = new Date().getTime()
  regexp = new RegExp($(this).data('id'), 'g')
  $(this).before($(this).data('fields').replace(regexp, time))
  event.preventDefault()
  setup_autocomplete()

如何添加第二个字段?如果通过javascript添加,可能需要再次调用autocomplete函数。是的,我通过coffeescript添加了它,您可以在更新时看到代码。在页面中创建新HTML元素后,您需要回忆
$('.autocomplete experience')。autocomplete
。在表单的“添加字段”事件的末尾添加
$('.autocomplete experience').autocomplete
,它应该在新添加的字段上部署autocomplete。@Yoshiji先生,我已经尝试了您的解决方案,但没有效果。您是否收到任何javascript错误/警告消息?(请参阅浏览器控制台)我已经尝试了您的解决方案,但没有成功,仅第一个字段有效。您的第二个字段具有相同的类
自动完成体验
?是的,它是一个动态字段,因此第二个字段将与第一个字段具有相同的类
setup_autocomplete = ->
  $('.autocomplete-experience').autocomplete
    source: $('.autocomplete-experience').data('autocomplete-source')
    select: (event,ui) -> $("input.xx").val(ui.item.id)

jQuery ->
  setup_autocomplete()

$('form').on 'click', '.add_fields', (event) ->
  time = new Date().getTime()
  regexp = new RegExp($(this).data('id'), 'g')
  $(this).before($(this).data('fields').replace(regexp, time))
  event.preventDefault()
  setup_autocomplete()