我试图在我的表单应用程序中使用jquery Tokeninput插件来自动完成pouporse。
问题是,在我的java脚本中,上下文ID是dinamically生成的,所以我不知道如何指定它工作,即使我在视图字段中使用paremeter:id也没有识别。
我尝试将其用于单个非动态字段并且工作得很好。 编辑视图存在问题。 当我来编辑时,每个字段都会显示该项目的所有结果。
因此,如果我有3个字段,则3显示所有3个字段。
我的观点是
/views/comps/new.html.erb
<h1>Cadastrar nova composicao:</h1>
<%= form_for(@comp) do |f| %>
<%= render 'fields', :f => f %>
<div class="actions">
<%= f.submit "Salvar" %>
</div>
<% end %>
/views/comps/_fields.html.erb
<%= render 'shared/error_messages', :object => f.object %>
<br>
<table class="field">
<tr>
<td><%= f.label :nome, "Nome" %></td>
<td><%= f.text_field :nome %></td>
<td><%= f.label :projetoorigem_id, "Projeto de origem" %></td>
<td><%= f.text_field :projetoorigem_id %></td>
</tr>
<tr>
<td><%= f.label :user_id, "Autor" %></td>
<td><%= f.text_field :user_id %></td>
<td><%= f.label :unidade_id, "Unidade" %></td>
<td><%= f.text_field :unidade_id %></td>
</tr>
<tr>
<td><%= f.label :tipo, "Tipo" %></td>
<td><%= f.text_field :tipo %></td>
<td><%= f.label :valor, "Valor" %></td>
<td><%= f.text_field :valor %></td>
</tr>
</table>
<div id="add" class="none">
Insumos da composicao
</br>
<ol>
<div>
<%= link_to_add_fields (image_tag "add.jpg"), f, :insumos_comp_rels %>
<%= f.fields_for :insumos_comp_rels do |builder| %>
<%= render "insumos_comp_rel_fields", :f => builder %>
<% end %>
</div>
</div>
</ol>
/views/comps/_insumos_comp_rel_fields.html/erb
<li class="fields">
<%= link_to_remove_fields (image_tag "delete.jpg"), f %>
<%= f.text_field :insumo_id, :id => "insumo_id" %>
<%= f.collection_select(:clifor_id, Clifor.all, :id, :nome_fantasia)%>
<%= f.collection_select(:modelo_id, Modelo.all, :id, :nome)%>
<%= f.collection_select(:unidade_id, Unidade.all, :id, :simbolo)%>
<%= f.text_field :valor %>
<%= f.text_field :quantidade %>
</li>
jQuery文件是:
/application.js
function remove_fields(link) {
$(link).prev("input[type=hidden]").val("1");
$(link).closest(".fields").hide();
}
function add_fields(link, association, content) {
var new_id = new Date().getTime();
var regexp = new RegExp("new_" + association, "g")
$(link).parent().after(content.replace(regexp, new_id));
}
$(function(){
$("#insumo_id", $(this)).tokenInput("/insumos.json", {
propertyToSearch: "nome",
tokenLimit: 1,
theme: "facebook",
searchingText: "Procurando...",
hintText: "Digite o que deseja procurar"
});
})
任何想法都会非常夸张。
答案 0 :(得分:0)
它可能不起作用,因为你只调用'tokenInput'一次(在DOM-load上)。您还应该在单击link_to_add_fields
链接时调用它(因此调用add_fields
函数时)。同样重要的是#insumo_id
不是ID,而是类。它是动态的,因此应避免使用相同的ID。这是所有这些的JS:
function remove_fields(link) {
$(link).prev("input[type=hidden]").val("1");
$(link).closest(".fields").hide();
}
function add_fields(link, association, content) {
var new_id = new Date().getTime();
var regexp = new RegExp("new_" + association, "g")
$(link).parent().after(content.replace(regexp, new_id));
insumosTokenInput();
}
function insumosTokenInput() {
$(".insumo_id:not(.token_input)").each(function() {
$this = $(this);
$this.addClass("token_input");
$this.tokenInput("/insumos.json", {
propertyToSearch: "nome",
tokenLimit: 1,
theme: "facebook",
searchingText: "Procurando...",
hintText: "Digite o que deseja procurar"
});
});
}
$(function(){
insumosTokenInput();
});
我希望它有所帮助!