如何在solr中实现自动提示?

How to implement auto suggest in solr?

我是 solr 场景的新手,我在 solr 中索引了一个名为 "displayName" 的字段。现在我想在 solr 中实现自动建议,它应该从这个字段中检索单词作为建议如何做?

在solrconfig.xml中更改以下内容

之前

 <searchComponent name="suggest" class="solr.SuggestComponent">
      <lst name="suggester">
        <str name="name">mySuggester</str>
        <str name="lookupImpl">FuzzyLookupFactory</str>      
        <str name="dictionaryImpl">DocumentDictionaryFactory</str>
        <str name="field">name_s</str>
        <str name="weightField">price</str>
        <str name="suggestAnalyzerFieldType">text_general</str>
        <str name="buildOnStartup">false</str>
      </lst>
    </searchComponent>

    <requestHandler name="/suggest" class="solr.SearchHandler" 
                    startup="lazy" >
      <lst name="defaults">
        <str name="suggest">true</str>
        <str name="suggest.count">10</str>
      </lst>
      <arr name="components">
        <str>suggest</str>
      </arr>
  </requestHandler>

在JSP

中尝试以下代码
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>jQuery UI Autocomplete - Default functionality</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">

  <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<style>
  em{
    width: auto;
    height: auto;
    background-color: yellow;
    overflow:auto;
  }


.ui-menu .ui-menu-item {

    float: left;
    clear: left;
}
/*
.ui-menu .ui-menu-item {
/*  margin:0; */
    padding: 0;
    zoom: 1;
    float: left;
    clear: left;
    width: 100%;
}
*/

 </style>

  <script>
  $(function() {
      $( "#tabs" ).tabs();
       $("#displayTabl").load("http://localhost:8080/Search/table.jsp" );

    $("#autoname").keyup(function(){
  //    $("#autoname").bind('input keyup',function(){
         var name = $("#autoname").val();
        // alert("name"+name);
         $('#results').html("");

          $.ajax({
              type:"GET",
              url: "http://localhost:8983/solr/search/suggest",
              data: "suggest=true&suggest.build=true&suggest.dictionary=mySuggester&wt=json&suggest.q="+name,
              success: function (data1) {
                  console.log(data1);
                  if (data1 != null) {
                      var data = JSON.parse(data1);
                      var parentNode = data.suggest.mySuggester;
                      var suggestionsNode = null;
                //    alert("parentNode="+parentNode);
                      for (var key in parentNode) {
                        //  alert("key="+key);
                          suggestionsNode = parentNode[key].suggestions;
                         if(suggestionsNode!=null)
                              break;
                      }
                      var autocomplete_data = [];
                      $.each(suggestionsNode, function (i, val) {
                          autocomplete_data.push(val.term);
                      });
                    //  console.log(autocomplete_data);
                      $("#autoname").autocomplete({
                            source: autocomplete_data  ,
                            select: function(event,ui){

                                 $("#autoname").val(ui.item.label);
                                 $.ajax({
                                        type: "GET",
                                         url: "http://localhost:8080/Search/search.html",
                                    //   dataType:"json",
                                         data: "name=" + ui.item.label,
                                         success: function(response){
                                              console.log(response);
                                            var txt = "";   
                                        $("#tableShow").html("");
                                          txt+="<tr><th bgcolor=\"#996533\" width=\"250\">Record Id</th><th bgcolor=\"#996533\" width=\"250\">Exam/Non Exam</th><th bgcolor=\"#996533\" width=\"125\">Mobile</th></tr>";
                                            var dataJ = JSON.parse(response);


                                             var results = dataJ._results;
                                             for(var key in results){
                                                var globalName = results[key].name;
                                                txt += "<tr ><td>"+results[key].id+"</td><td id="+results[key].id+">"+results[key].name+"</td><td>"+results[key].mobile+"</td></tr>";
                                             }
                                            if(txt != ""){
                                             $("#tableShow").append(txt);
                                         }
                                            //Highlighting Starts Here
                                           var highlight = {};
                                          $("#tableShow tr").each(function(){
                                                 var $secondCell = $('td:eq(1)', this);
                                              $.each(dataJ._highlighting, function(i, hitem){
                                                  if($secondCell.attr('id')==i){
                                                     $secondCell.html(hitem.name[0]);
                                                  }
                                              });
                                              });
                                          //Highlighting ends here


                                            console.log(dataJ);
                                                // we have the response

                                                 },
                                                 error: function(e){
                                                 alert('Error here: ' + e);
                                             }

                                     });

                            }
                        })


                  }
              },
              error: function(result) {
                  alert("Error");
              }
          })

    }); //Key Press Ends

    $("#search").click(function () {

         var name = $("#autoname").val();

         $.ajax({
                type: "GET",
                 url: "http://localhost:8080/Search/search.html",
            //   dataType:"json",
                 data: "name=" + name,
                 success: function(response){
                      console.log(response);
                    var txt = "";   
                $("#tableShow").html("");
                  txt+="<tr><th bgcolor=\"#996533\" width=\"250\">Record Id</th><th bgcolor=\"#996533\" width=\"250\">Exam/Non Exam</th><th bgcolor=\"#996533\" width=\"125\">Mobile</th></tr>";
                    var dataJ = JSON.parse(response);


                     var results = dataJ._results;
                     for(var key in results){
                        var globalName = results[key].name;
                        txt += "<tr ><td>"+results[key].id+"</td><td id="+results[key].id+">"+results[key].name+"</td><td>"+results[key].mobile+"</td></tr>";
                     }
                    if(txt != ""){
                     $("#tableShow").append(txt);
                 }
                    //Highlighting Starts Here
                       var highlight = {};
                      $("#tableShow tr").each(function(){
                             var $secondCell = $('td:eq(1)', this);
                          $.each(dataJ._highlighting, function(i, hitem){
                              if($secondCell.attr('id')==i){
                                 $secondCell.html(hitem.name[0]);
                              }
                          });
                          });
                      //Highlighting ends here


                    console.log(dataJ);
                        // we have the response

                         },
                         error: function(e){
                         alert('Error here: ' + e);
                     }

             });
     }); //Search Click Ends

  });
  </script>
</head>
<body>

<div class="ui-widget">
  <label for="tags"> </label>
  <input id="autoname">
  <input type="button" name="search" id="search" value="Search" />
  <div id="tabs" style="border:none;padding:0;">
  <ul>
    <li><a href="#tabs-1">Engagement Record</a></li>

  </ul>
  <div id="tabs-1">
    <ol id="displayTabl"></ol>

  </div>

</div>
</div>


</body>
</html>