This is jquery script for insert new row in a table and each new row containing 3 td text input, current time and current date

<script type="text/javascript">
    $(document).ready(function(){
            var $prototypeRow = $("#prototype").find("tr").eq(0);
        $(".addRow").click(function(){
            var tds = $prototypeRow.clone(true).insertAfter($(this).closest("tr")).find("td"), dt = new Date();
            tds.eq(1).find("input").val("textInputGoesHere");
            tds.eq(2).html(dt.getHours() + ":" + dt.getMinutes() + ":" + dt.getSeconds());
            tds.eq(3).html(dt.getDate() + ":" + (parseInt(dt.getMonth())+1) + ":" + dt.getFullYear());
            return false;
        });
        $(".removeRow").click(function(){
            if( confirm('Remove row?') ){
                $(this).closest("tr").remove();
            }
            return false;
        });
    });
    </script>

insert to this table:

<table id="prototype" style="display:none;">
<tr>
<td></td>
<td><input type="text" ></td>
<td><?php echo date("h:i:s");?></td>
<td><?php echo date("d-m-Y");?></td>
<td>
    <a href="#" class="removeRow"><img width="20px" height="20px" src="images/Remove32.PNG" title="remove" /></a></td>
</tr>
</table>
  <table id="tblGrid" cellspacing="0">
    <tr>
      <th>Instraction</th>
      <th>Result</th>
      <th>Time</th>
      <th>Date</th>
      <th>Add</th>
    </tr>
    <?php do { ?>
      <tr>
        <td><?php echo $row_instRecordset['instName']; ?></td>
        <td><?php echo $row_instRecordset['instValue']; ?></td>
        <td><?php echo $row_instRecordset['instTime']; ?></td>
        <td><?php echo $row_instRecordset['instDate']; ?></td>
        <td><a class="addRow"><img width="20px" height="20px" src="images/add_32.png"/></a></td>
      </tr>
      <?php } while ($row_instRecordset = mysql_fetch_assoc($instRecordset)); ?>
  </table>
  <a class="newOrder">Save</a>

I want (after clicking save button) to replace text input with it's value (change <input> to <p>)

$('#textinputid').replaceWith("<p>" + $(this).val() + "</p>");

it has been solved by changing this line 6 to:

tds.eq(1).find("input").val();

and assigning id 'save' to the button save then adding this:

$('#save').click(function () { 
      $("#tblGrid input").each(function(){
         $(this).replaceWith("<p>" + $(this).val() + "</p>");
      });
});

Now it works :)

Thank you Jaseva.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.