在编辑表单中填充Select2字段

Question

我是一个业余爱好者开发人员。我在新的/编辑Rails表单中使用了基本的Select2 ajax，并且我无法弄清楚如何在编辑表单中重新填充它。 song_creditor_1是一个字符串，但它是作为Fan模型的ID输入的。

形式：

<%= f.input :song_creditor_1, label: 'Song Creditor 1', as: :select, input_html: { id: "song_creditor_1", include_hidden: false } %> 

脚本

function templateDropDownFormat (item) { 
    return item.text; 
    } 

    function templateSelectionFormat (item) { 
    return item.text; 
    } 

    $("#song_creditor_1").select2({ 
    placeholder: "Search", 
    ajax: { 
     url: "/songs", 
     dataType: 'json', 
     delay: 250, 
     data: function (params) { 
     return { 
      q: params.term, // search term 
      page: params.page 
     }; 
     }, 

     processResults: function (data, params) { 
     // parse the results into the format expected by Select2 
     // since we are using custom formatting functions we do not need to 
     // alter the remote JSON data, except to indicate that infinite 
     // scrolling can be used 
     params.page = params.page || 1; 
     return { 
      results: $.map(data, function(cnut) { 
       return { 
       text: cnut.name + ", " + cnut.city + ", " + cnut.country + " (" + cnut.account_type + ")", 
       id: cnut.id, 
       }; 
      }), 
      pagination: { 
      more: (params.page * 30) < data.total_count 
      } 
     }; 
     }, 
     cache: true 
    }, 
    escapeMarkup: function (markup) { return markup; }, // let our custom formatter work 
    minimumInputLength: 1, 
    templateResult: templateDropDownFormat, // omitted for brevity, see the source of this page 
    templateSelection: templateSelectionFormat// omitted for brevity, see the source of this page 
    }); 

Answer 1

好吧，我只是一个业余爱好者，这是我的第一个网站，所以这个答案是不漂亮，但它是我如何解决它。如果表单中存在错误，则问题是必须重新填充字段中的数据，所以我只是在“创建”期间将该特定属性拉出来并将其称为@ creditor1。

var $select1 = $('#song_creditor_1'); 

    function templateDropDownFormat (item) { 
    return item.text; 
    } 

    function templateSelectionFormat (item) { 
    return item.text; 
    } 

    $select1.select2({ 
    ajax: { 
     url: "/songs", 
     dataType: 'json', 
     delay: 250, 
     data: function (params) { 
     return { 
      q: params.term, // search term 
      page: params.page 
     }; 
     }, 

     processResults: function (data, params) { 
     // parse the results into the format expected by Select2 
     // since we are using custom formatting functions we do not need to 
     // alter the remote JSON data, except to indicate that infinite 
     // scrolling can be used 
     params.page = params.page || 1; 
     return { 
      results: $.map(data, function(cnut) { 
       return { 
       text: cnut.name + ", " + cnut.city + ", " + cnut.country + " (" + cnut.account_type + ")", 
       id: cnut.id, 
       }; 
      }), 
      pagination: { 
      more: (params.page * 30) < data.total_count 
      } 
     }; 
     }, 
     cache: true 
    }, 
    escapeMarkup: function (markup) { return markup; }, // let our custom formatter work 
    minimumInputLength: 1, 
    templateResult: templateDropDownFormat, // omitted for brevity, see the source of this page 
    templateSelection: templateSelectionFormat// omitted for brevity, see the source of this page 
    }); 


<% if params[:action] === "edit" && @creditor1_real || params[:action] === "update" && @creditor1_real %> 
    var $option1 = $('<option selected><%= @creditor1_real.name %>, <%= @creditor1_real.city %>, <%= @creditor1_real.country %></option>').val("<%= @creditor1_real.id %>"); 

    $select1.append($option1).trigger('change'); 

<% elsif params[:action] === "create" && @creditor1 || params[:action] === "new" && @creditor1 %> 
    var $option1 = $('<option selected><%= @creditor1.name %>, <%= @creditor1.city %>, <%= @creditor1.country %></option>').val("<%= @creditor1.id %>"); 

    $select1.append($option1).trigger('change'); 

<% else %> 
    var $option1 = $('<option selected>Search</option>'); 

    $select1.append($option1).trigger('change'); 
<% end %>