Question

我正在尝试在Rails 3.2应用程序中实现select2。

具体来说，我想使用模板显示带有国家标志+国家/地区名称的国家/地区选择字段。

我有一个国家/地区模型和用户模型。我的国家/地区模型具有:code属性。我正在使用CSS精灵来显示基于:code属性的标志。

<img class="flag flag-#{country.code}">

在用户表单中

<%= f.collection_select :country_id, Country.order(:name), :id, :name, include_blank: true %>

并在user.js.coffee.erb中我有

jQuery ->  
    format = (country) ->
        "<img class='flag flag-#{country.code}' src='#'/>" + country.name       
    $('#prerep_country_id').select2
        placeholder: "Select a country",
        allowClear: true,
        formatResult: format,
        formatSelection: format

我无法将它们捆绑在一起（可能是我正在学习资产管道和js.erb如何工作的一部分）。

目前，选择字段使用select2呈现，但仅包含国家/地区列表。没有格式化。

如何将每个国家/地区传递给format = (country)函数，以便使用该标记进行格式化？

感谢您的任何指示。

Answer 1

来自fine manual：

formatSelection

用于渲染当前选择的函数。
formatSelection(object)

，object参数为

从query函数返回的选定结果对象。

再过一点，我们会看到query的全部内容，特别是：

结果对象的数组。默认渲染器需要具有id和text键的对象。即使使用自定义渲染器，也需要id属性。

如果我们查看一个示例（http://jsfiddle.net/ambiguous/a73gc/），我们会看到您的format函数正在传递country对象id和{{1}密钥。另一方面，你正在看text，但那里什么都没有，你就会产生这样的图像：

country.code

所以你没有得到任何旗帜。

请改为尝试：

<img class='flag flag-' src='#'/>

您的format = (country) -> "<img class='flag flag-#{country.id}' src='#'/>" + country.name #--------------------------------^^ CSS中可能已经有height和width，所以我们不必担心标记有多大。

另外，如果您使用的是HTML5，则可能会丢失XML样式的img.flag自动关闭标记内容，只需/>即可。

如何在Rails中为select2模板传递模型属性到coffeescript

1 个答案: