Passing value from jQuery Modal into last input box

I’ve created a modal window, containing a table with rows of input boxes and buttons:

<table class="datatable tablesort selectable paginate full" width="100%">

                       <tbody>
                                                        <tr id="row_1">
                             <td><strong><input type="text" value="120040965" id="icpcode">
     <button type="button" id="btnSave" class="btn btn-primary">Insert</button></strong>
                               <p>GRAND VOYAGER WIPER MOTOR REAR 04-08 £35.00</p>
                              </td>
                           </tr>                               <tr id="row_2">
                             <td><strong><input type="text" value="120040966" id="icpcode">
     <button type="button" id="btnSave" class="btn btn-primary">Insert</button></strong>
                               <p>CHRYSLER GRAND VOYAGER WIPER MOTOR FRONT 01-08 £30.00</p>
                              </td>
                           </tr>                               <tr id="row_3">
                             <td><strong><input type="text" value="120040964" id="icpcode">
     <button type="button" id="btnSave" class="btn btn-primary">Insert</button></strong>
                               <p>CHRYSLER GRAND VOYAGER MK2 01-08 2.8 CRD GEARBOX AUTOMATIC £500.00</p>
                              </td>
                           </tr>                               <tr id="row_4">
                             <td><strong><input type="text" value="120040963" id="icpcode">
     <button type="button" id="btnSave" class="btn btn-primary">Insert</button></strong>
                               <p>CHRYSLER GRAND VOYAGER MK2 STOW  £80.00</p>
                              </td>
                           </tr>                               <tr id="row_5">
                             <td><strong><input type="text" value="120040962" id="icpcode">
     <button type="button" id="btnSave" class="btn btn-primary">Insert</button></strong>
                               <p>CHRYSLER GRAND VOYAGER MK2 01-08 WISHBONE DRIVER SIDE £15.00</p>
                              </td>
                           </tr>                           </tbody>
          </table>

I then use jQuery to insert the value of the inputbox (icpcode) into the last row of another table and close the open modal and focus on that inputbox:

$('#btnSave').click(function() {
var value = $('#icpcode').val();

$('#tablemain tbody tr:last #itemlookup').val(value);
$('#tablemain tbody tr:last #itemlookup').focus();
$('#productlookup').modal('hide');
});

My problem is that only the first button works, so I need a solution that enables the selected row’s value to pass back. I have incremented the tr id, but I’m not sure what I need to do… but I’m presuming it needs something involving $.(this) and also incrementing the inputbox/button. It might be easier to do away with the button and have the row itself to have an onclick? Either way I appreciate any help!

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s