Update form submit depending on selected row

Question

I am a novice but I am trying to pull this thing together.

I am trying to build a billing system. Within the DB, each invoice has a PK with items such as invoice date, due date, etc. I have another table that lists the items (itemID is the PK) with a relationship between a Invoice ID in both tables. My issue is with the Items table.

In cases where only one item is on the invoice, I can update records. However, my problem is when I have more than one entry, I can only edit the last entry in the row.

Here is a illustration of what my table looks like. The Green arrow indicates the last row in the items list (which I can update); the red arrow indicates the row I cannot update.

As you can see, I am able to get the individual itemID into a variable to display alongside the form submit button:

                        <td>
                        <input type="submit" name="submit_items" value="Submit" />'
                        .$row->item_id.'
                        </td> 

I am wondering how would I "link" / "associate" the individual item id so it will run the corresponding MySQL. For example, I'm looking for the MySQL query to update itemID row 4164 when I click the submit button for itemID 4164. Currently, my code is only updating the last itemID.

Here is the MySQL query which is able to update the final item:

      UPDATE o70vm_invoices_items SET 
                invoice_id = $invoiceID, 
                name = '$program',
                `desc` ='$forWeek', 
                value = $value,
                amount = $qty

                WHERE id=$id

I have tried to change the WHERE statement to this:

               WHERE id=".$row->item_id.""

However, no item is displayed. I think I am pretty close. Been working at it for a the few days. If there is a way to alter the code to automatically get the row ID of where the form submit button is located, I will be a major step closer to completing this project. A step I can't seem to do by myself. Thanks if anyone is listening. :)

Any suggestions on how to handle this operation, so much appreciated.

Here is my complete code, in case there are many questions I have not answered with enough detail:

            $queryItems = "select 
        o.`id` as 'item_id',
        o.`invoice_id` as 'invoice_id_on_items',
        o.`name` as 'program',
        o.`value` as 'fee',
        o.`amount` as 'qty',
        o.`desc` as 'forweek',
        group_concat( o.`desc` separator ' & ' ) as 'forweekgroup',          
        round( sum( ( o.`value` ) * ( o.`amount` ) ),2 ) as 'inv-total'
        from `o70vm_invoices_items` o
        where o.`invoice_id` = $invoiceSelected
        GROUP BY o.id";

  // storing the result of this MySQL query
$resultItems = mysql_query( $queryItems );

echo'

<form action="" method="post">
<div>';


echo "<h2>Invoice Items</h2>";

if( $resultItems ){
    echo '
        <table>
            <tr>
                <th scope="col">Invoice ID</th>
                <th scope="col">Item ID</th>
                <th scope="col">For Services Rendered</th>
                <th scope="col">Program</th>
                <th scope="col">Fee</th>
                <th scope="col">Quantity</th>
                <th scope="col">Total Fees</th>
                <th scope="col">Edit</th>

            </tr>';

    $id=0; /* Each field / element that has an id must have a unique id ~ use a counter to achieve this */

    $Invoice_Amount=0.00;

    while( $row = mysql_fetch_object( $resultItems ) ){

        $id++;/* Increment the id counter */

        echo '
            <tr>

                <td>'.$row->invoice_id_on_items.'</td>

                <input type="hidden" title="'.$row->invoice_id_on_items.'" name="invoice_id" size="10" id="invoice_id" value="' . $row->invoice_id_on_items. '" />

                <td>'.$row->item_id.'</td>

                <input type="hidden" title="'.$row->item_id.'" name="id" size="13" id="id" value="'.$row->item_id. '" />

                <td>
                    <input type="text" title="'.$row->forweek.'" name="desc" size="15" id="desc" value="' . $row->forweek. '" />
                </td>
                <td>
                    <input type="text" title="'.$row->program.'" name="name" size="50" id="name" value="' . $row->program. '" />
                </td>
                <td>
                    <input type="number" title="'.$row->fee.'" name="value" size="3" id="value" value="' . $row->fee. '" />
                </td>
                <td>
                    <input type="number" title="'.$row->qty.'" name="amount" size="3" id="amount" value="' . $row->qty. '" />
                </td>
                ';
                $Fee = floatval($row->fee);
                $Qty = floatval($row->qty);
                $ItemFee=$Fee*$Qty;
                echo '
                <td>
                    <input type="text" title="'.$ItemFee.'" name="total_fee" size="3" id="total_fee" value="' . $ItemFee. '" />
                </td>


                        <td>
                        <input type="submit" name="submit_items" value="Submit" />'
                        .$row->item_id.'
                        </td>


                    </tr>';



            $Invoice_Amount+=$ItemFee;
    }

    echo '
        <tr>
        <td colspan=6></td>                     
        <td>$'.$Invoice_Amount.'</td>
        </tr></table>

        </div>
        </form>';
} else {/* Do not give away too much information and degrade gracefully */
    echo "We can't seem to pull the data information on this one, baby.  Sorry.  Code must be wrong.";
    echo "Error:".mysql_error();
}

            /*
            EDIT RECORD START
            */

            // get variables from the URL/form
            $id = $_POST['id'];
            $invoiceID = htmlentities($_POST['invoice_id'], ENT_QUOTES);
            $program = htmlentities($_POST['name'], ENT_QUOTES);
            $forWeek = htmlentities($_POST['desc'], ENT_QUOTES);
            $value = htmlentities($_POST['value'], ENT_QUOTES);
            $qty = htmlentities($_POST['amount'], ENT_QUOTES);

            //NOTE: desc is a MySQL reserved word so we need to `desc` 
                $stmt = "UPDATE o70vm_invoices_items SET 
                invoice_id = $invoiceID, 
                name = '$program',
                `desc` ='$forWeek', 
                value = $value,
                amount = $qty

                WHERE id=$id";

Answer 1

Pseudo code to guide you in updating the row you want rather than all rows in one hit. No doubt there are lots of other methods too...

while( $row = mysql_fetch_object( $resultItems ) ){
    /*
        Copied quickly so if there are cells missing you should get the idea
    */
    echo '
        <tr data-id="'.$row->item_id.'">
            <td>'.$row->invoice_id_on_items.'</td>
            <td>'.$row->item_id.'</td>
            <td><input type="text" title="'.$row->forweek.'" name="desc_'.$row->item_id.'" size="15" id="desc" value="' . $row->forweek. '" /></td>
            <td><input type="text" title="'.$row->program.'" name="name_'.$row->item_id.'" size="50" id="name" value="' . $row->program. '" /></td>
            <td><input type="number" title="'.$row->fee.'" name="value_'.$row->item_id.'" size="3" id="value_'.$row->item_id.'" value="' . $row->fee. '" /></td>
            <td><input type="number" title="'.$row->qty.'" name="amount_'.$row->item_id.'" size="3" id="amount_'.$row->item_id.'" value="' . $row->qty. '" /></td>
            <td>
                <input type=\'button\' value=\'Submit\' />
                /* Notice it is now a simple button */
                <input type="hidden" title="'.$row->item_id.'" name="id_'.$row->item_id.'" size="13" id="id_'.$row->item_id.'" value="'.$row->item_id. '" />
                <input type="hidden" title="'.$row->invoice_id_on_items.'" name="invoice_id_'.$row->item_id.'" size="10" id="invoice_id_'.$row->item_id.'" value="' . $row->invoice_id_on_items. '" />
            </td>
        </tr>';
}

In the head section, something like the following: ( this is untested but the idea is that it will send the data via ajax request to the receiving script that does the processing of the data ~ ie: the form action )

<script>

  function initialise(){/* establish listeners for button click events */
    var col=document.querySelectorAll('input[type="button"]');
    if( col )for( var n in col ){
        if( col[n] && typeof(col[n]))=='object' && col[n].nodeType==1 ) col[n].addEventListener('click',processclicks,false );
    }
  }


  function cbprocclick(r){
      alert( r );
  }


  function processclicks(event){/* Process the button click */
    var el=typeof(event.target)!='undefined' ? event.target : event.srcElement;
    var parent=el.parentNode.parentNode;
    var id=parent.dataset.id;
    var callback=cbprocclick;

    var col=parent.querySelectorAll('input');
    var fd=new FormData();

    for( var n in col ) fd.append( n, col[n] );

    /* Forgot the custom field for the ID */
    fd.append( 'record_id', id );

    var request = new XMLHttpRequest();
    /* here you can setup a callback to handle messages sent back */
    if( request.status==200 && request.readystate==4 ){
        callback.call( this, request.responseText ); /* etc */
    }
    request.open( "POST", "http://example.com/scriptname.php" );
    request.send( fd );
  }

    document.addEventListener( 'DOMContentLoaded', initialise, false );
</script>

When data is submitted each of the fields will have the record ID appended to the end - example: desc_4 etc The javascript function processclicks has a custom field ( sorry, forgot to include that yesterday evening ) called record_id which is the $row->item_id - so at the receiving end you should be able to retrieve the records using this record_id

If you are posting to the same page, I'd suggest that the code that handles the actual data entry to the db is at the top of the page and then a structure like the following:

if( $_SERVER['REQUEST_METHOD']=='POST' ){
    if( isset( $_POST['record_id'] ) ){
          /* Make sure we discard any output ther emay have been to this point */
            @ob_clean();

        /* For debugging, try: */
        print_r($_POST);
        /* Use the console to see what your request looks like and also the response */


        /* The record id sent as custom field */
        $recordid=$_POST['record_id'];

        /* The records sent in the request */
        $description = htmlentities( $_POST['desc_'.$recordid], ENT_QUOTES );
        $invoiceid = htmlentities( $_POST[ 'invoice_id_'.$record_id ], ENT_QUOTES );
        $program = htmlentities( $_POST[ 'name_'.$record_id ], ENT_QUOTES );
        $fee = htmlentities( $_POST[ 'value_'.$record_id ], ENT_QUOTES );
        $qty = htmlentities( $_POST[ 'amount_'.$record_id ], ENT_QUOTES );


        /* Then construct your sql */
        $sql="update `o70vm_invoices_items` set 
                    `invoice_id` = '$invoiceid', 
                    `name` = '$program',
                    `desc` = '$description', 
                    `value` = '$fee',
                    `amount` = '$qty'
                    where `id`='$recordid';";           


        /* 
          Because you are posting data via ajax 
          you only want to submit data, not load the 
          entire page again
        */
        exit();
    }
}