0

我有一个表，用户可以在其中动态添加行。其中一个字段，我的日期字段，对于添加的所有行必须相同。我已经在所有其他行上克隆了日期字段，并在创建的行上将该字段设为只读，但我想知道是否有一种方法可以在其中添加一些代码，如果用户回到第一个行并更改收据日期，则用户添加的所有行也将更新为新日期。

<table border="0" width="825px" cellspacing="0" cellpadding="5" name="receipts" id = "receipts">
<thead>
    <tr>
        <th class="colheader" width="125px">Receipt #</th>
        <th class="colheader" width="120px">Date</th>
        <th class="colheader" width="120px">Category</th>
        <th class="colheader" width="120px">Description</th>
        <th class="colheader" width="120px">Amount</th>
        <th class="colheader" width="145px"><span class="boldblacklinks"><a href="#" id="add">[Add +]</a></span></th>
    </tr>
</thead>
    <tbody class="lineBdy">
        <tr id="line_1" class="spacer">
            <td><input type="text" class="receipt fieldclasssm" id="recLineReceipt[]" name="recLineReceipt[]" size="7" value = "<?=$receiptNumber?>"/></td>
            <td><input type="text" class="date fieldclasssm" id="recLineDate[]" name="recLineDate[]" size="10" value = "<?=date("m/d/Y", strtotime($today))?>"/></td>
            <td><select name="selectCategory[]" class="fieldclasssm">
                        <option value = "">Select a Category...</option>
                        <?php //Get Categories

                        $getCats = mysql_query("SELECT id, nominalName FROM expense_nominalCodes ORDER BY id") or die("Get Cats: " . mysql_error());

                        if(mysql_num_rows($getCats) > 0)
                            {
                            while($catData = mysql_fetch_array($getCats))
                                {
                                echo '<option value = "'.$catData['id'].'">'.$catData['nominalName'] . '</option>';
                                }
                            }
                        ?>
                </select>
            </td>
            <td><input type="text" class="lineDescr fieldclasssm" name="recLineDescr[]" id="recLineDescr[]" value = "<?=$_POST['recLineDescr']?>" size="40" /></td>
            <td colspan = "2"><input type="text" class="amt fieldclasssm" name="recLineAmount[]" id="recLineAmount[]" value = "<?=$_POST['recLineAmount']?>" size="12" /></td>
        </tr>
    </tbody>
</table>
<div align="center"><br /><br /><input type="submit" name = "saveAdd" class="btn" value = "Save & Add Another Receipt" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="submit" name = "saveAdd" class="btn" value = "Save as Draft" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="submit" class="btn"name="saveDraft" value = "Save & Finalize Expense Report" /><br /><br /></div>


<script type="text/javascript">

//Add new table row & clone date field
$('#add').on('click', function(){
   addReceiptItem();
    $('.date').focus(function() {
        $(this).select();
    });
    $('.receipt').focus(function() {
        $(this).select();
    }); 
});

function addReceiptItem(){
     var lastID = $('tr[id*="line_"]').length,    
         newTds = $('tr[id="line_' + lastID + '"] td').clone(),
         newRow = document.createElement('tr');

    // add new id and class to row, append cloned tds
    $(newRow)
        .attr('id', 'line_' + (lastID + 1 ))
        .attr('class', 'spacer')
        .append(newTds);

    //empty out the fields, except the one you want to keep populated
    // $(newRow).find('input').not(':eq(0)').val('');

     // $(newRow).find('input').not(':eq(0)').val('');


    $(newRow).find('input').not(':eq(0)').not(':eq(0)').val('');
    $(newRow).find('class').not(':eq(0)').not(':eq(0)').val('');

    //add the new row to the table body
    $('tbody.lineBdy').append(newRow);
    $('.receipt').attr('readonly', true);
    $('.date').attr('readonly', true);
    };
4

1 回答 1

0

如果这些字段都有date类，你可以调用类似的东西

$('#someUpdateButton').click(function(){
  $('.date').val($('.date:nth-of-type(1)').val())
});

一个工作小提琴

于 2013-07-01T17:38:22.970 回答