Set a checked field value of a table with an other field value

Question

I got some trouble in jQuery. I have some rows in a table with 3 columns (checkbox, name, amount) I also have a field above the table. Here, I want to copy the value of this field into the amount field where the checkbox is checked. See in the screenshot, i want to put the value in yellow into the checked field of the table.

        Assign Quota to Sales : 
    <apex:inputText id="ValueToCopy" value="{!ForecastingQuota.QuotaAmount}" required="false">
</apex:inputText>
<apex:commandButton value="Assign to Selected Users" reRender="allquotas" onclick="copyQuotaAmount();"/>

<apex:pageBlockSection columns="4" id="allquotas">
<apex:pageBlockTable value="{!allthequotas}" id="table" var="key">
<apex:facet name="header">
<input type="checkbox" id="checkAllBox" onchange="toggleCheckAll(this)"/> Select All
</apex:facet>
<apex:column>
<apex:inputCheckbox styleClass="selectInput"/>
</apex:column>
<apex:column headerValue="Name">
<apex:outputField  value="{!key.QuotaOwnerId}"/>
</apex:column>
<apex:column headerValue="Quota">
<apex:inputField value="{!key.QuotaAmount}" required="false" id="test"/>
</apex:column>
</apex:pageBlockTable>
<apex:pageBlockTable value="{!allthequotas2}" var="key2">
<apex:facet name="header">
<input type="checkbox" id="checkAllBox2" onchange="toggleCheckAll2(this)"/> Select All
</apex:facet>
<apex:column>
<apex:inputCheckbox styleClass="selectInput2"/>
</apex:column>
<apex:column headerValue="Name">
<apex:outputField  value="{!key2.QuotaOwnerId}"/>
</apex:column>
<apex:column headerValue="Quota">
<apex:inputField value="{!key2.QuotaAmount}" required="false" id="test"/>
</apex:column>
</apex:pageBlockTable> 
<apex:pageBlockTable value="{!allthequotas3}" var="key3">
<apex:facet name="header">
<input type="checkbox" id="checkAllBox3" onchange="toggleCheckAll3(this)"/> Select All
</apex:facet>
<apex:column>
<apex:inputCheckbox styleClass="selectInput3"/>
</apex:column>
<apex:column headerValue="Name">
<apex:outputField  value="{!key3.QuotaOwnerId}"/>
</apex:column>
<apex:column headerValue="Quota">
<apex:inputField value="{!key3.QuotaAmount}" required="false" id="test"/>
</apex:column>
</apex:pageBlockTable> 
<apex:pageBlockTable value="{!allthequotas4}" var="key4">
<apex:facet name="header">
<input type="checkbox" id="checkAllBox4" onchange="toggleCheckAll4(this)"/> Select All
</apex:facet>
<apex:column>
<input type="checkbox" styleClass="selectInput4"/>
</apex:column>
<apex:column headerValue="Name">
<apex:outputField  value="{!key4.QuotaOwnerId}"/>
</apex:column>
<apex:column headerValue="Quota">
<apex:inputField value="{!key4.QuotaAmount}" required="false" id="test"/>
</apex:column>
</apex:pageBlockTable> 
</apex:pageBlockSection>
</apex:pageBlock>
</apex:form>

<script type="text/javascript">
 function copyQuotaAmount()
    {
        $("input[type=checkbox][checked]").each(function(){
                $("input[id$='test']").val($("input[id$='ValueToCopy']").val());
                });
    }

I've tried this but i don"t know how to put on the selected field.

Thanks Dev.

HTML

Answer 1

Like I said, I don't know apex, but here a general idea:

Once you are able to get the selected checkbox, you need a relation between each checkbox and his follow input : so you need to give your inputs a unique id for each one : something like this:

<input type="checkbox" data-inputid="val1">
<input type="text" id="val1"> 
<input type="checkbox" data-inputid="val2">
<input type="text" id="val2"> 

then you can use the value of

data-inputid

to set the value :

function copyQuotaAmount()
    {
        $("input[type=checkbox]:checked").each(function(){
            // $(this) refers to the current checked box in loop
            var inputid = $(this).data('inputid');
            var valuetocopy = $('#ValueToCopy').val();
            // if you can force the id of the input field to a specific value then use this
            $('#' + inputid).val(valuetocopy);
            // else if you can't force the value (then based on your html output), you must use this
            $("input[type='text'][id$='" + inputid + "']").val(valuetocopy)

        });
    } 

So even if you are getting the selected checkboxs, you were looping on the checked elements, but then you were selecting all the fields with id="test" and because all your input had id='test', it is normal that the value was copied everywhere.

Hope this help :)