代码之家  ›  专栏  ›  技术社区  ›  njwin07

typeahead发送请求,但不显示获取的结果

  •  0
  • njwin07  · 技术社区  · 9 年前

    这是我使用并尝试了4个小时的代码,可以看到一个ajax请求带来了jason reults,但在输入字段中不建议使用

    $('#user-search').typeahead({
    name: 'user-search',
    remote: '/search.php?query=%QUERY' 
    });
    
    var student = new Bloodhound({
      datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
      queryTokenizer: Bloodhound.tokenizers.whitespace,
      remote: {
        url: 'php/search_groups.php',
        wildcard: '%QUERY'
      }
    });
    
    student.initialize();
    
    $('#students').typeahead(null, {
      name: 'students',
      displayKey: 'value',
      source: student,
    });
    
    <div class="form-group">
          <label for="tags">
     Assign To</label>
           <input  id="students" type="text" class="typeahead form-control" value="" name="students" placeholder="Specify for special students" />
    </div>[![enter image description here][1]][1]
    
    1 回复  |  直到 9 年前
        1
  •  0
  •   Marques    9 年前

    您可以尝试以下操作:

     var students = new Bloodhound({
      datumTokenizer: function(d) { return Bloodhound.tokenizers.whitespace(d.name);},
      queryTokenizer: Bloodhound.tokenizers.whitespace,
      valueKey: 'name',
      remote: {
        url: 'php/search_groups.php?search=%QUERY',
        wildcard: '%QUERY',
        filter: function (students) {
          // Map the remote source JSON array to a JavaScript object array
          return $.map(students.data, function (student) {
              return student;
          });
        }
      }
    });
    student.initialize();
    

    要将Typeahead分配给输入,可以执行以下操作:

    $('.add-employment-city').typeahead({
          hint: true,
          highlight: true,
          minLength: 1
        },{
          name: 'students',
          displayKey: 'name',
          source:students.ttAdapter(),
        });
    

    在PHP文件中,您应该输入以下内容:

    $search = $_GET['search'];
    $students = //USE YOUR SQL CODE TO SEARCH
    
    return json_encode(['data'=>$students]);
    

    提示:将结果名用复数形式(学生),因为你经常会收到很多结果。