CODEWITHSUNDEEP
javascriptjquerykeyboardevent-handlingjquery-events
Kavya Shree
Kavya Shree

Reputation: 1032

Issue on tab press using Javascript

I want to call add() function when I typed something in amount field and I press tab means it will call that. But the field next to amount is in readonly mode, so its not calling that function properly. I tried the code like below please anyone suggest me solution:

$('#price_1').on( 'keyup', function( e ) {
if( e.which == 9 ) {
var i=$('table tr').length;
html = '<tr>';
html += '<td><input class="case" type="checkbox"/></td>';
html += '<td><input type="text" data-type="productName" autocomplete="" name="itemName[]" id="itemName_'+i+'" id="productList" class="form-control autocomplete_txt item2" tabindex="0" value=""style="text-align:center;" autofocus></td>';
html += '<td><input type="number" name="quantity[]" id="quantity_'+i+'" class="form-control changesNo" autocomplete="off" tabindex="0" onkeypress="return IsNumber(event);" ondrop="return false;" onpaste="return false;"></td>';
html += '<td><input type="number" name="price[]" id="price_'+i+'" class="price1 form-control changesNo" autocomplete="off" tabindex="0" onkeypress="return IsNumber(event);" ondrop="return false;" onpaste="return false;"></td>'; 
html += '<td><input type="number" name="total[]" id="total_'+i+'" class="form-control totalLinePrice" autocomplete="off" tabindex="-1" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;" readonly></td>';
html += '</tr>';
$('table').append(html); 
$(".item2").autocomplete({
source: "https://www.duminex.com/product/search",
select: function( event, ui ) { 
var a = i - 1;
$('#id').val(ui.item.id); 
$('#price_' + a).val(ui.item.price);
}
});
i++;
}
});
<td><input type="text" tabindex="6" name="price[]" id="price_1" class="form-control changesNo" autocomplete="off" onkeypress="return IsNumber(event);" onpaste="return false;" required="required" ></td>

<td><input type="text" name="total[]" id="total_1" class="form-control totalLinePrice" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;" required="required" ></td>

enter image description here

Upvotes: 0

Views: 58

Answers (1)

Keerthi Kumar P
Keerthi Kumar P

Reputation: 1604

Apparently, keyup gets called after the field loses focus. So registering on the amount field will not help. Reference:

jQuery: keyup for TAB-key?

Also, is there any requirement like, the add() function has to happen on Tab press only and not if user clicks on anywhere outside the amount field ? Or is it fine if it happens on the field losing focus ? Like clicking some where on the field also... Including TAB press...

Upvotes: 1

Related Questions