如何自动提交使用Twitter Bootstrap typeahead()选择的选项?
http://twitter.github.com/bootstrap/javascript.html#typeahead
如何自动提交使用Twitter Bootstrap typeahead()选择的选项?
http://twitter.github.com/bootstrap/javascript.html#typeahead
有一种干净的方法使用 updater
回调函数:
input.typeahead({
'source' : ['foo', 'bar'],
'updater' : function(item) {
this.$element[0].value = item;
this.$element[0].form.submit();
return item;
}
});
$('#search-box.typeahead').typeahead({ hint: true, highlight: true, minLength: 1 }, { name: 'states', displayKey: 'value', source: substringMatcher(states), updater:function(item){ this.$element [0] .value = item; this.$element [0] .form.submit(); 返回项目; } });
- TheTechGuy$('#my-input')
.typeahead({/* put you options here */})
.on('typeahead:selected', function(e){
e.target.form.submit();
});
可能不是最好的解决方案,但我在本地尝试了一下,它可以工作。
如果你的typeahead看起来像这样...
<form id="test-form" method="post" action="">
<input id="test-input" type="text" data-provide="typeahead"
data-source='["1","2',"3"]' />
</form>
<script type="text/javascript">
$('#test-input').change(function() {
$('#test-form').submit();
});
</script>
显然有几个git合并请求。这个可以解决问题,并允许您向typeahead发送一个对象数组:https://github.com/twitter/bootstrap/pull/1751
$('#prefetch').typeahead({
hint: true,
highlight: true,
minLength: 1
},
{
name: 'trees',
source: trees,
limit: 15
}).on('typeahead:selected', function(e) {
var result = $('#prefetch').val()
$('#formpane input[name=\"myID\"]').val(result)
});
供参考,这是HTML代码:
<body>
<div id="formpane">
<form action="/thanks" method="POST">
<input class="typeahead" type="text" placeholder="select categories" id="prefetch">
<button type="submit">Submit</button>
<input type="hidden" name="myID" />
</form>
</div>
<script type="text/javascript" src="js_file_above.js"></script>
</body>
$('input.myTypeaheadInput').blur(function(e) {
window.setTimeout(function() {
window.console && console.log('Works with clicking on li item and navigating with the keyboard. Yay!');
}, 50);
});