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

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

typeahead jquery

0

njwin07 · 技术社区 · 11 年前

这是我使用并尝试了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 回复 | 直到 11 年前

1

0

Marques 11 年前

您可以尝试以下操作:

 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]);

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