Add a class to your table. When you click on a row, iterate through each cell in that row.

If there is noinput elemenet, then get the content of the cell, clear the content and add aninput element with the text.

Here is a working jsFiddle.

Warning: you should handle the name of the input values, and you should care about html tags in the value of the cells, if there are not only pure texts.


  <table >
    <td >This is a text</td>
    <td >Another text</td>


$('table.editable').on('click', 'tr', function () {
    $(this).find('td').each(function () {
        if ($(this).find('input').length < 1) {
        let html = $(this).html();
        $(this).append('<input name="value[]" value="' + html + '" />');

People are also looking for solutions to the problem: php - Highlighting row with same date AND almost same time


Didn't find the answer?

Our community is visited by hundreds of web development professionals every day. Ask your question and get a quick answer for free.

Ask a Question

Write quick answer

Do you know the answer to this question? Write a quick response to it. With your help, we will make our community stronger.

Similar questions

Find the answer in similar questions on our website.