Question

我在表单上使用materialize-sass gem。使用自动完成功能获取供应商名称。表单上的其他字段是项目名称和数量，它们是嵌套资源。为此，我使用cocoon gem

由于某种原因，第一次页面加载，似乎一切正常。但添加更多字段似乎不起作用。我尝试使用下拉选择，但不显示项目列表。我用另一个自动完成替换它，主要字段显示但是自动完成功能不起作用。知道什么可能是错的吗？

请参阅下面的代码。

purchase_orders _forms.html.erb

＆＃13;

<div class="col s12">
	<%= simple_form_for(@purchase_order) do |f| %>
	<%= f.error_notification %>
	<div class="row">
		<div class="col s6">
			<%= f.input :vendor_name, input_html: { class: 'vendor_name autocomplete' } %>
		</div>
	</div>
	<section class="show-section">
		<div class="row">
			<div class="col l12"><h4>Item List</h4></div>
			<div class="col s12">
				<%= f.simple_fields_for :purchase_order_details do |purchase_order_detail| %>
				<%= render 'purchase_order_detail_fields', :f => purchase_order_detail %>
				<div class="links">
					<%= link_to_add_association 'Add More', f, :purchase_order_details %>
				</div>
				<% end %>
			</div>
		</div>
	</section>
	<%= f.button :submit %>
	<% end %>
</div>

＆＃13;

_purchase_order_detail_fields.html.erb

＆＃13;

<div class="nested-fields">
	<div class="row">
		<div class="col l6">
			<%#= f.input(:item_id, collection: Ingredient.is_active, label_method: :title, value_method: :id) %>
			<%= f.input :item_name, input_html: { class: 'item_name autocomplete' } %>
		</div>
		<div class="col l5">
			<%= f.input :item_quantity %>
		</div>
		<div class="col l1">
			<%= link_to_remove_association "delete", f, :class => "material-icons teal-text text-lighten-1" %>
		</div>
		<%#= f.hidden_field :item_type , :value=> params[:category_id] %>
	</div>
</div>

＆＃13;

Answer 1

检查他们使用的演示项目，更具体地说是他们使用的init.js我注意到两件事：如果你使用turbolinks你将不得不这样做，当你使用cocoon时你将不得不这样做类似的东西：

$('form').on('cocoon:before-insert', function(e, insertedItem) {
  $(insertedItem).find('select').material_select();
})

Rails materialize-sass表单，带有自动完成和cocoon gem嵌套资源

1 个答案: