Question

I have a field with the id of “task_alignment” that has a value the user will be typing that needs to be added into the span below. The span has a value of 12 for the sake of example in the code below.. I can’t seem to get this working.

<tr>
<td> Aligned To </td> 
<td class="task_table_item_last">
<input type='text' size='95' id='task_alignment' name='task_alignment' value='<?php echo $task_alignment; ?>'>
</td>
<td class="edit_taskicon"><img class="edit_icon_trigger" src="img/add.png"></td>
</tr>

<tr>
<td></td> 
<td class="aligncode_start">
    <span>12</span>

</td> 
</tr>

I have tried using the code below but it doesn’t do anything:

<script>
$(document).ready(function() {
    var $aligncode_newitem = $('<span id="aligncode_newitem">'#task_alignment '</span>'),
        $('.edit_icon_trigger').click(function() {
            $("#task_alignment").clone(aligncode_newitem);
        });
});​
</script>

Answer 1

Try:

$('.edit_icon_trigger').click(doit);
$('#task_alignment').keypress(function() {
    if (event.which == 13) {
        event.preventDefault();
        doit();
    }
});
function doit() {
    $("td.aligncode_start").html($("td.aligncode_start").html() + ' <span>' + $('#task_alignment').val() + '</span>');
    $('#task_alignment').val('').focus();
}​

jsFiddle example