Rails 表单中的 jQuery 自动完成答案

【问题标题】：jQuery autocompletion in a Rails formRails 表单中的 jQuery 自动完成
【发布时间】：2012-03-23 03:19:17
【问题描述】：

我有一个用于电子邮件的 Rails 表单，我想在 Receiver 字段中自动完成。这是我所做的：

= f.label :recipient_id, "Send to:"
= text_field_tag :recipient_id, nil
:javascript
 $(function() {
    $( "#recipient_id" ).autocomplete({
        source: "#{escape_javascript url_for(:action => 'recipient_autocomplete',
                     :controller => 'sent')}",
        minLength: 2,
        select: function( event, ui ) {
            $('input#recipient_id').attr('value', ui.item.value);
            ui.item.value = ui.item.label
        }
    });
});

在我的控制器中，我有：

  def recipient_autocomplete
    @users= User.all(:conditions => ['first_name LIKE ? OR last_name LIKE?', 
      "%#{params[:term]}%", "%#{params[:term]}%"])
    render :json => @users.collect {|x| {:label=>x.full_name, :value=>x.id}}.compact
  end

json 调用工作正常并显示全名 OK。这是元素：

<input type="text" name="recipient_id" id="recipient_id" class="ui-autocomplete-input"
  autocomplete="off" role="textbox" aria-autocomplete="list" 
  aria-haspopup="true" value="158">

但是，当我点击发送（相当于提交）时，发送的是收件人全名而不是receipient_id。

如何让 Rails 表单获取输入字段的值（上例中为 158）而不是其标签？

【问题讨论】：

标签： jquery ruby-on-rails forms autocomplete

【解决方案1】：

嗯，HTML 规范说 text_field 的文本是它要返回的值。但是您可以像这样使用hidden_field 传递_id，

= f.label :recipient_id, "Send to:"
= text_field_tag :recipient_name, nil
= hidden_field_tag :recipient_id, nil
:javascript
 $(function() {
    $( "#recipient_id" ).autocomplete({
        source: "#{escape_javascript url_for(:action => 'recipient_autocomplete',
                     :controller => 'sent')}",
        minLength: 2,
        select: function( event, ui ) {
            $('input#recipient_name').val(ui.item.label);
            $('input#recipient_id').val(ui.item.value);
        }
    });
});

来自This JqueryUI page

【讨论】：

【解决方案2】：

你有一个非常好的 rails cast here 关于这个

【讨论】：