搜索自动完成导轨4

时间:2015-04-27 07:49:03

标签: javascript jquery css ruby-on-rails

JS:

<script>

$(function() {
    var availableTags = [
      "NSDL",
      "CDSL",
      "ROCA",
      "NSE",
      "SEBI"      
    ];
    $( "#search" ).autocomplete({
      source: availableTags
    });
  });

</script>

<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

<link rel="stylesheet" href="/resources/demos/style.css">

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">

_index.js.erb

<%= form_tag service_requests_path, method: :get,:id=>"search_form" do %>  
<%= text_field_tag :search , nil, class: 'form-control input-breathe', required: true, placeholder: 'Searching for...', :autocomplete=> :on%><%end%>

我想只使用文本框进行搜索,而不使用任何按钮。现在我从文本框中获取所有值。但问题是,当我选择任何标签时,它应该搜索包含该标签的所有服务请求。我怎么能这样做?

1 个答案:

答案 0 :(得分:2)

您只需要向表单添加事件侦听器,以便每当用户选择任何标记时,表单都应自动提交。

var availableTags = [
  "NSDL",
  "CDSL",
  "ROCA",
  "NSE",
  "SEBI"      
];
$( "#search" ).autocomplete({
  source: availableTags,
  select: function(event, ui){
        $('#search').val(ui.item.value)
        $('#search_form').submit()
  }
});

Jquery自动完成插件提供选择回调,只要选择了标记,就会自动调用该回调。所以提交您的搜索表单。我假设你的搜索表单有id os'search_form'。请将其替换为您申请表格的身份。