auto_freak
New Member
I have a very simple table structure\[code\]<table width='50%' align='center' id='tabs'> <tr> <td>1.00</td> <td>5.23</td> <td>6.12</td> </tr> <tr> <td>2</td> <td>2.45</td> <td>2.45</td> </tr> <tr> <td>3.12</td> <td>2.98</td> <td>2.09</td> </tr></table>\[/code\]and here is my code which allows only to enter numeric in textinput with two places after dot i.e it allows only numbers like eg 2.12 and the problem is if i click on table cell a textbox appears in that cell and i can edit numbers but when i click on table cell it should focus on textbox and after editing numbers as and when i come out of editing that blur event should work.\[code\]$("table td").click( function(e){ if($(this).find('input').length){ return ; } var input = $("<input type='text' size='5' />").val( $(this).text() ); $(this).empty().append(input); $(this).find('input') .focus(function(e){ if($(this).val()=='0.00' || $(this).val()=='0'){$(this).val('');} }).keydown(function(event){ if ( event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 27 || event.keyCode == 190 || event.keyCode == 13 || // Allow: Ctrl+A (event.keyCode == 65 && event.ctrlKey === true) || // Allow: home, end, left, right (event.keyCode >= 35 && event.keyCode <= 39)) { // let it happen, don't do anything return; } else { // Ensure that it is a number and stop the keypress if (event.shiftKey || (event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105 )) { event.preventDefault(); } } }).blur( function( e ){ if($(this).val()!=""){ if (!isNaN(parseFloat($(this).val()))) { var val1=parseFloat($(this).val()).toFixed(2); $(this).val(val1); $(this).parent('td').text( $(this).val() ); } } else{ $(this).parent('td').text("0.00"); } }); }); $(function() { $('table tr td').hover(function() { $(this).css('background-color', '#FFFFB0'); }, function() { $(this).css('background-color', '#F4F4F4'); }); });\[/code\]Please see JS FIDDLE HERE