0

我有一个使用 Ryan Bates nested_form 插件的页面。当您具有基于一个模型的表单以及属于另一个模型的附加字段时,将使用该插件。例如,如果我有一个创建类别的表单,同时我想将项目添加到新类别,我的表单将包含类别模型的输入字段和我想要分配给新类别的项目的输入字段。

Ryan 的插件使用 jQuery 创建一个添加额外输入字段的按钮,因为用户可能会在类别中添加 2 项或 10 项。

就我而言,我正在将人员添加到报告中。这是通过“链接”完成的。我的嵌套表单运行良好,但我也希望这些新输入字段能够自动完成。为此,我使用了 jQuery UI 1.8 自动完成小部件。它在我的应用程序的其他部分运行良好。但它不适用于这种嵌套形式。

问题似乎是我的 javascript 使文本字段可自动完成,在文档准备好时加载一次。

然后,当我在我的nested_form 中添加新的文本字段时,自动完成小部件不会附加到这些文本字段,因为它已经加载了一次。

我可能是错的,但这只是我的猜测。任何人都可以建议做什么。下面是我的自动完成代码(我没有显示nested_form javascript,因为它都隐藏在插件中,我真的不想更改任何内容。知道它可以工作就足够了,现在我需要制作我的自动完成小部件适用于此)。

这是带有 javascript 的页面:

<script>
// origin_person auto selector
    $(function() {

    $('[id$=origin_id]').autocomplete({
    minLength: 2,
    source: '/people.json',
    focus: function(event, ui) {
        $('[id$=origin_id]').val(ui.item.person.given_name);
        return false;
    },
    select: function(event, ui) {
        $('[id$=origin_id]').val(ui.item.person.given_name);
   $('[id^=hidden_origin]').val(ui.item.person.id);
        return false;
    }
})

.data( "autocomplete" )._renderItem = function( ul, item ) {
    return $( "<li></li>" )
        .data( "item.autocomplete", item )
        .append( "<a>" + item.person.given_name + "</a>" )
        .appendTo( ul );
};
});
</script>

<!-- Start of form partial for my new report view -->

<% f.fields_for :links do |link_form| %>
  <%= link_form.text_field :origin_id %>
  <%= link_form.text_field :rcvd_id %> 

<%= link_form.link_to_remove "Remove this link" %> 

<% end %>

<%= f.link_to_add "Add a link", :links %>
<!-- The above link_to_add helper is part of the nested_form plugin. 
Using jQuery it will insert the following fields. Notice that the IDs 
are also dynamic which I am trying to connect to. -->

<!-- <input type="text" size="30" name="report[links_attributes][1278921811834][origin_id]" 
      id="report_links_attributes_1278921811834_origin_id" class="ui-autocomplete-input" 
      autocomplete="off" role="textbox" aria-autocomplete="list" aria-haspopup="true">

      <input name="link[origin_id]" id="hidden_origin_id" class="ui-autocomplete-input" 
      autocomplete="off" role="textbox" aria-autocomplete="list" aria-haspopup="true">
-->

请指出我如何让​​我的自动完成以获取新插入的文本字段的正确方向。

戴尔

4

2 回答 2

1

戴尔,只是在黑暗中刺伤。鉴于以下情况:

$(function() { $('[id$=origin_id]').autocomplete({...});

该函数可以与.liveor.livequery事件一起使用吗?如果是这样,这可以让您保持完整性,而无需进一步更改代码。

于 2010-07-12T14:37:38.680 回答
0

使用 YUI :-D :-D

http://bubbling-library.com/eng/api/docs/plugins/dispatcher

或者,这个问题可能会对您有所帮助:

jQuery 中有 onAvailable() 函数吗?

于 2010-07-12T14:21:52.623 回答