'Restrict table data 'contenteditable' attribute to only Integer

The below code allows me to edit the table data row but may i know how can i restrict it to only integers.

Thank you in advance for your time :)

<td contenteditable="true" class="product_rate"></td>


Solution 1:[1]

Well, you can try reading the keyCode of the onkeypress event, determining whether it is a number (0-9) or not and then returning true or false respectively

<td onkeypress = "return testCharacter(event);" contenteditable="true" class="product_rate"></td>

function testCharacter(event) {
  if ((event.keyCode >= 48 && event.keyCode <= 57) || event.keyCode === 13) {
    return true;
  } else {
    return false;
  }

}

Solution 2:[2]

if ((event.keyCode >= 48 && event.keyCode <= 57) || event.keyCode === 13)

those numbers are the assci code in decimal: https://www.ascii-code.com/

48 is for the 0; 57 is for the 9; 45 is for the -

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Manav
Solution 2 fabian orduña