语义用户界面-获取搜索查询

本教程将介绍语义用户界面-获取搜索查询的处理方法,这篇教程是从别的地方看到的,然后加了一些国外程序员的疑问与解答,希望能对你有所帮助,好了,下面开始学习吧。

语义用户界面-获取搜索查询 教程 第1张

问题描述

我使用的是语义用户界面,更具体地说是ui fluid seach。我声明如下:

  <div id="inputIDtextfield" class="ui fluid search" style="width: 250px">
<div class="ui icon input">
 <input id="inputValue" style="width: 250px" class="prompt" type="text" placeholder="Onekey_ID">
 <i class="search icon"></i>
</div>
<div class="results"></div>
  </div>

我需要向RESTful server发送请求,并将搜索查询作为正文的一部分,这就是问题所在-我不确定怎么检索正在搜索的查询。我尝试如下:

$('#inputIDtextfield')
 .search({
  minCharacters: 3,
  searchOnFocus: false,
  searchDelay: 500,
  apiSettings : {
url : '/rest/get-hcp-suggest',
method: 'POST',
data: JSON.stringify({
 'search': document.getElementById('inputValue').value
}),
contentType: "application/json; charset=utf-8",
dataType: "json",

onResponse: function(response){
 console.log(response);
 var convertedResponse = {
  results : []
 };

 // translate response to work with search
 $.each(response, function(index, item) {
  // add result to category
  convertedResponse.results.push({
title : item.name,
description : item.onekey_id,
  });
 });
 return convertedResponse;
},
  },
 });
}

但在此部分:

data: JSON.stringify({
 'search': document.getElementById('inputValue').value
}),

document.getElementById('inputValue').value始终为空。

怎么检索搜索查询?

推荐答案

我将请求的数据设置在apiSettingsbeforeSend方法中,解决了这个问题,如下所示:

beforeSend: function(settings) {
 settings.data = JSON.stringify({
  'search': document.getElementById('inputValue').value
 });

 return settings;
}

有关语义的更多信息UI API usage page。

好了关于语义用户界面-获取搜索查询的教程就到这里就结束了,希望趣模板源码网找到的这篇技术文章能帮助到大家,更多技术教程可以在站内搜索。