更改HTML表中的数据库值

I have written a control panel for managing devices, however as we have imported hundreds of them, there are a lot of values that need to be manually set. I have an overview page that shows the most import information and I am looking at some way to allow the end-user to change those values by clicking them.

Right now they are just text in TD cells pulled from the Database. Would it be possible to do something like double clicking the cell changes it to a drop-down box of options and then when deselected it automatically saves it to the database?

I have been searching Google and Stack Overflow but I am not even sure what to search for to get an idea of how to accomplish this.

enter image description here

To do this you must (short version):

  1. Handle click event on your value from table
  2. Change(hide text and display input) text for input with setted value
  3. Handle blur event on your input
  4. If some changes have been made, send Request (by AJAX) to your php actions which save value in database. Or do nothing if there were no changes.
  5. Change(hide input and display text ) input to text