We are using following JQuery code (within JSF) to invoke Autocomplete. Everything seems to work fine when user keys in data but when user copies and pastes Autocomplete will be invoked on second attempt. I am testing following code in IE 8. Any inputs are appreciated
<pre>
<code>
<script type="text/javascript">
$(function () {
$(document).on('keyup.autocomplete','##{resp.workItemResponse.wiResponseId}', function() {
$('##{resp.workItemResponse.wiResponseId}').autocomplete({
minLength: 3,
source: function( request, response){
$.ajax({
type: 'GET',
url: "/iaportal/autoCompleteServlet",
cache: false,
delay: 200,
data: {
'respId':'#{resp.workItemResponse.wiResponseId}',
'type': '#{autoCompleteType}',
'term':request.term
},
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(data){
response($.map(data.acctNum, function (item) {
return {
label: item.label,
value: item.label
}
}));
},
error: function(message){
alert("error "+message);
}
});
},
select: function( event, ui ) {
var selectedObj = ui.item;
var text = selectedObj.value;
$('.autoComplete#{resp.workItemResponse.wiResponseId}').attr('value', text);
$('.autoComplete#{resp.workItemResponse.wiResponseId}').trigger('change');
}
});
$('##{resp.workItemResponse.wiResponseId}').keyup(function(){
var text = this.value;
if(text == '' || text.length == 0){
$('.autoComplete#{resp.workItemResponse.wiResponseId}').attr('value', "");
$('.autoComplete#{resp.workItemResponse.wiResponseId}').trigger('change');
}
});
}); // on Ends
var textElem;
$(document).on('paste','##{resp.workItemResponse.wiResponseId}',function() {
textElem = this;
setTimeout(invokeOnPaste , 100);
});
function invokeOnPaste(){
var text = $(textElem).val();
if(text.length == 14){
$('.autoComplete#{resp.workItemResponse.wiResponseId}').attr('value', text);
$('.autoComplete#{resp.workItemResponse.wiResponseId}').trigger('change');
} else if(text.length != 0){
$('##{resp.workItemResponse.wiResponseId}').trigger('search','autocomplete');
}
}
});
</script>
</code>
</pre>