Bloodhound的新Typeahead是如何处理错误的
How is error handling done with the new Typeahead with Bloodhound?
我遇到一个问题,当用户联合会话到期时,Typeahead会停止工作。我希望能够在Typeahead的"远程"调用失败时执行操作。特别是Typeahead是如何处理的?是否存在类似于典型ajax调用中的"错误"回调?这是我目前拥有的代码:
var hints = new Bloodhound({
datumTokenizer: Bloodhound.tokenizers.obj.whitespace("value"),
queryTokenizer: Bloodhound.tokenizers.whitespace,
remote: {
url: "/ProjectAssociation/CountryLookup?query=%QUERY",
wildcard: "%QUERY"
}
});
$("#assocStoragesSelection").typeahead(null, {
name: "nations",
limit: 90,
valueKey: "ShortCode",
displayKey: "Name",
source: hints,
templates: {
empty: [
"<div class='noitems'>",
"No Items Found",
"</div>"
].join("'n")
}
});
处理错误的"正确"方法是使用prepare
函数向AJAX调用添加错误处理程序。如果您正在使用wildcard
选项,请注意prepare
会覆盖它
例如,你可以打开这个:
new Bloodhound({
remote: {
url: REMOTE_URL,
wildcard: '%s'
}
});
进入这个:
new Bloodhound({
remote: {
url: REMOTE_URL,
prepare: function(query, settings) {
return $.extend(settings, {
url: settings.url.replace('%s', encodeURIComponent(query)),
error: function(jqxhr, textStatus, errorThrown) {
// show error message
},
success: function(data, textStatus, jqxhr) {
// hide error message
}
});
}
}
});
prepare
返回的对象用作jQuery.ajax()
的设置对象,因此您可以参考其文档。
Typeahead的Bloodhound建议引擎缺乏在远程源出现问题时通知用户的设施。
您可以使用Typeahead的源代码选项(请参阅此处),而不是使用Bloodhound来获取建议。通过在此处指定源,您可以处理错误并向用户显示合适的消息。
我在这里创建了一个示例:
http://jsfiddle.net/Fresh/oqL0g7jh/
答案的关键部分是如下所示的源选项代码:
$('.typeahead').typeahead(null, {
name: 'movies',
display: 'value',
source: function(query, syncResults, asyncResults) {
$.get(_url + query, function(movies) {
var results = $.map(movies.results, function(movie) {
return {
value: movie.original_title
}
});
asyncResults(results);
}).fail(function() {
$('#error').text('Error occurred during request!');
setTimeout("$('#error').text('');", 4000);
});
}
source选项使用jQuery的get方法来检索数据。发生的任何错误都由延迟对象的fail方法处理。在这种方法中,您可以适当地处理任何错误,并向用户显示合适的消息。由于源函数由三个参数指定,这导致Typeahead将此调用默认为异步调用,因此调用:
asyncResults(results);
尝试此代码
var hints = new Bloodhound({
datumTokenizer: Bloodhound.tokenizers.obj.whitespace("value"),
queryTokenizer: Bloodhound.tokenizers.whitespace,
remote: {
url: "/ProjectAssociation/CountryLookup?query=%QUERY",
wildcard: "%QUERY",
ajax: {
error: function(jqXHR) {
//do some thing
}
}
}
});
相关文章:
- 是否存在Javascript Liferay Service库的文档?如何处理错误情况
- RxJS:在循环中处理错误.js自定义驱动程序
- 通过 AJAX 检索 Blob 时处理错误消息
- Chai正如承诺:当承诺抛出错误时,处理错误
- 如何处理错误'控制台未定义'在powershell中
- Bloodhound的新Typeahead是如何处理错误的
- 请求管道处理错误
- Angular Jasmine SpyOn$resource处理错误
- 如何或如何使用firebase有效地处理错误
- 以处理错误的方式启动javascript承诺蓝鸟链
- JavaScript Regex over CSS:如何处理错误的类
- 模态中的 Django 形式:动态重定向和处理错误
- 在 Angular 中使用拦截器处理错误的通用方法
- Angular JSON-RPC:处理错误
- AngularJS - 处理错误错误:[ng:areq] 在此特殊情况下 (?)
- 绕过 javascript 的 chrome 和 FF 后台选项卡处理错误
- 如何使用 Q 和 JS 捕获或失败来处理错误
- 使用 window.onerror 和 try-catch 块处理错误之间的差异
- jQuery $.get 在处理错误时返回白色错误页
- 处理错误后提交索引数据库事务