1

我有一个带有使用 jQuery-UI 自动完成小部件的文本字段的表单。我正在使用 AJAX 和 Ruby on Rails 将此表单作为部分加载<li id="activity_<%= activity.id %>"><%= link_to activity.address, edit_activity_path(activity), :remote => true %></li>

由于表单是在 document.ready 之后加载的，因此自动完成 jQuery 小部件没有绑定到 DOM 元素。

由于这不是 jQuery AJAX 调用，因此我认为在 Ajax 调用之后没有可以用来绑定自动完成小部件的成功回调。

我不确定如何使用我在自动完成小部件中看到的 .on() 函数，因为语法是 $('selector').autocomplete

有人可以帮忙吗？

这是 edit.js.erb 文件：

$("#activity_form").html("<%= escape_javascript(render(:partial => "form"))%>");

这是我将自动完成小部件绑定到我的文本字段的 jQuery 代码。

jQuery ->       
$('[type="text"][name*="[geocode_location]"]').autocomplete
  source: (request, response) ->
    $.ajax 
      url: "http://ws.geonames.org/searchJSON"
      dataType: "jsonp"
      data: 
        featureClass: "P"
        style: "full"
        maxRows: 12
        name_startsWith: request.term

      success: (data) ->
        response $.map(data.geonames, (item) ->
          label: item.name + ((if item.adminName1 then ", " + item.adminName1 else "")) + ", " + item.countryName
          value: item.lat + ", " + item.lng
        )
  minLength: 2

  open: ->
    $(this).removeClass("ui-corner-all").addClass "ui-corner-top"

  close: ->
    $(this).removeClass("ui-corner-top").addClass "ui-corner-all"
  focus: (event, ui) ->
    event.preventDefault()
    $(this).val ui.item.label      
  select: (event, ui) ->
    event.preventDefault()
    $(this).val ui.item.label
    $(this).siblings('[name*="[geocode_ll]"]').val ui.item.value
4

3 回答 3

2

我在这里读到了每个 Rails Ajax 调用可以绑定到的 6 个自定义事件，包括 ajax:success，只要有成功的 ajax 请求就会触发。

http://net.tutsplus.com/tutorials/javascript-ajax/using-unobtrusive-javascript-and-ajax-with-rails-3/

所以我做了 $(this).bind "ajax:success" ，它允许 $(this) 在这种情况下是整个窗口，在任何 "ajax:success" 事件之后触发一些其他功能。

所以，我最终这样做了：

jQuery ->
  $(this).bind "ajax:success", -> 
    jQuery ->       
      $('[type="text"][name*="[geocode_location]"]').autocomplete
       --REST OF CODE--
于 2012-11-06T22:38:52.250 回答
1

我有一个类似的情况，在 ajax 调用后渲染包含自动完成输入字段的部分时，自动完成不再起作用。我正在使用rails3-jquery-autocomplete宝石。

问题很简单，所有自动完成输入字段仅在初始文档加载时绑定到自动完成功能。要再次绑定新的自动完成字段，只需调用以下函数：

jQuery('input[data-autocomplete]').railsAutocomplete();
于 2013-02-02T19:09:51.633 回答
0

$('[type="text"][name*="[geocode_location]"]').live("autocomplete", function(){ your code})

请试试。

于 2012-11-06T12:57:50.857 回答