We are using following JQuery code (JSF) to invoke Autocomplete. Everthing seems to work fine when user keys in data but when user copies and pastes Autocomplete will work only in second attempt. I am testing following code in IE 8. Any inputs are appreciated
<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>