how to copy values to field in aura:iteration dynamically using Radio button with multiple rows

Question

Here I'm trying to copy values from the output text table data to respect of their field which are price and Qty

Please take look at the below picture for an idea.

Here I'm using Inside two aura: iterations and I'm those price and qty from the different objects instead of entering the user he will just click and copy the values.

Please take a look at the below coding What I have return:

<div class="slds-section__content" id=" OrderLineItemsId">
                <aura:iteration items="{!v.OrderItems}" var="item">
                    <table><tr>
                        <td><lightning:input label="S.No" value="" />  </td>
                        <td>
                        <lightning:input label="P/N" value="{!item.Name}" /> 
                        </td>
                        <td> <lightning:input label="P/N" value="{!item.client_Pn__c}" /> </td>

                        <td> <lightning:input label="Description" value="{!item.Description__c}" /> </td>
                        <td> <lightning:input label="Prod" value="{!item.Family__c}" /> </td>
                        <td> <lightning:input type="Date" label="Shipping Date" value="{!item.Confirmed_Shipping_Date__c}" /> </td>
                      <td> 
                            <aura:iteration items="{!item.Batch}" var="ba">
                                <table border="1" id="thispa">
                                    <tr><th> Price </th>
                                        <th> Qty </th>
                                    </tr>
                                    <tr>
                                         <td> <ui:outputText title="Price" aura:id="baprice" value="{!ba.Unit_Price__c}"/>  </td>
                                         <td>  <ui:outputText title="Qty" aura:id="baqty" value="{!ba.Asked_Qty__c}" />  </td>
                                         <td> <ui:inputRadio aura:id="r0" name="select" label="Action" change="{!c.CopyValues}"/> </td>

                                    </tr>
                                </table>    
                             </aura:iteration>
                        </td>
                        <td> <lightning:input label="Qty" value="{!item.Quantity__c}" /> </td>
                        <td> <lightning:input label="Unit Pice" value="{!item.Price__c}" /> </td>

                        </tr>

                    </table>
                 </aura:iteration>    
            </div>

Controller: What I need to do here is I need to get values for selected radio button and push them into respected row field(unit price and qty please look at that above image)

 CopyValues: function(component, event, helper) { 
       console.log("entered");

       var pricem=event.getSource();
       var selectedItemNew=document.getElementById(pricem).value();
       console.log(pricem.get("v.value"));   
       var table = document.getElementsById("thispa");  
         console.log(table);       
      }

Here I'm not able to get anything

Answer 1

i achieved by using onclick event on child tr instead radio button. i used HTML data-attribute to bind parent row index and child row index, so i got both indexes when ever click on any child row then CopyValues function calls and bind the selected child row values to parent row.

cmp

 <aura:attribute name="OrderItems" type="List" />
<aura:handler name="init" value="{!this}" action="{!c.doInit}" />
<div class="slds-section">

            <aura:iteration items="{!v.OrderItems}" var="item" indexVar="index">
                  <table>
                      <tr>
                          <td> <lightning:input label="Family" value="{!item.family}" /> </td>
                          <td data-record="{!index}">
                               <aura:iteration items="{!item.batch}" var="ba" indexVar="childindex">
                                   <table border="1" id="thispa">
                                <tr><th> Price </th>
                                    <th> Qty </th>
                                </tr>
                                <tr data-record="{! childindex + '=>' + index}" class="{!'' +'=>'+index}" onclick="{!c.CopyValues}" >
                                     <td> <ui:outputText title="Price" aura:id="baprice" value="{!ba.price}"/>  </td>
                                     <td>  <ui:outputText title="Qty" aura:id="baqty" value="{!ba.askedqty}" />  </td>
                                </tr>
                            </table> 
                               </aura:iteration>
                          </td>
                          <td> <lightning:input label="QTY" value="{!item.qty}" /> </td>
                          <td> <lightning:input label="Unit Price" value="{!item.unitprice}" /> </td>
                      </tr>
                </table>
             </aura:iteration>    
        </div>

Controller:

({
doInit: function(component, event, helper){
    var data = [
        {
            "family": "P1",
            "batch": [
                {
                    "price": 10,
                    "askedqty": 2
                },
                {
                    "price": 20,
                    "askedqty": 4
                },
                {
                    "price": 30,
                    "askedqty": 6
                }
            ],
            "qty": '',
            "unitprice":'' 
        },
         {
            "family": "P2",
            "batch": [
                {
                    "price": 40,
                    "askedqty": 8
                },
                {
                    "price": 50,
                    "askedqty": 9
                },
                {
                    "price": 60,
                    "askedqty": 10
                }
            ],
            "qty": '',
            "unitprice":'' 
        }

    ];

    component.set("v.OrderItems",data);

},
CopyValues: function(component,event,helper){
     var childandparentindx = event.currentTarget.dataset.record.split('=>'),
         orderitems = component.get("v.OrderItems"),
         childindx = childandparentindx[0],
         parentindx = childandparentindx[1],
         selectedparentrow = orderitems[parentindx],
         selectedchildrow = selectedparentrow.batch[childindx];
         selectedparentrow.qty = selectedchildrow.askedqty;
         selectedparentrow.unitprice = selectedchildrow.price;
    orderitems.splice(parentindx, 1, selectedparentrow);
    console.log(orderitems);
    component.set("v.OrderItems",orderitems);

},

})

please upvote/accept if solution works for you. and let me know if you had any issues.