-1

I have a scenario in vf page where there will be a inputtext and an button name(Copy). When i will fill the inputtext field and click the button a new inputtext field will be created dynamically with the same value as in the first one.

I have tried below example which is working fine. But i need the values to also get copied.

Can anyone help me out in this.

Apex class -

public class addAttendee {
    public Account accounts;
    public Contact del;
    public List<Contact> addattendeeList { get; set; }
    public List<Contact> delattendeeList { get; set; }
    public List<Contact> attendeeList { get; set; }
    public Integer totalCount { get; set; }
    public Integer rowIndex { get; set; }
    public List<Contact> delAttendees { get; set; }

    public addAttendee(ApexPages.StandardController controller) {

        accounts = (Account) controller.getRecord();
        attendeeList = [Select id, firstName, LastName, Email, Phone from Contact where AccountId = : accounts.Id];
        totalCount = attendeeList.size();

        delattendeeList = new List < Contact > ();
        delattendees = new List < Contact > ();
    }

    public void addRow() {
        addattendeeList = new List < Contact > ();
        attendeeList.add(new Contact(AccountId = accounts.Id));
    }

    public PageReference ave() {

        upsert attendeeList;
        delete delattendeeList;
        return (new ApexPages.StandardController(accounts)).view();
    }

    public void deleteRow() {

        rowIndex = Integer.valueOf(ApexPages.currentPage().getParameters().get('rowIndex'));
        System.debug('rowbe deleted ' + rowIndex);
        System.debug('rowm to be deleted ' + attendeeList[rowIndex]);
        del = attendeeList.remove(rowIndex);
        delattendeeList.add(del);

    }
}

VF Page -

<apex:page standardController="Account" extensions="addAttendee" sidebar="false">
    <apex:form>
        <apex:pageBlock title="Accounts" id="pb">
            <apex:pageMessages />
            <apex:variable var="rowNumber" value="{!0}" />
            <apex:pageblockSection columns="1">
                <apex:pageBlockTable title="Contacts" var="acc" value="{!attendeeList}">

                    <apex:column headerValue="No." style="width:20px; text-align:center;" headerClass="centertext">
                        <apex:outputText value="{0}" style="text-align:center;">
                            <apex:param value="{!rowNumber+1}" />
                        </apex:outputText>
                    </apex:column>
                    <apex:column headerValue="First Name">
                        <apex:inputField value="{!acc.FirstName}" />
                    </apex:column>
                    <apex:column headerValue="Last Name">
                        <apex:inputField value="{!acc.LastName}" />
                    </apex:column>
                    <apex:column headerValue="Phone">
                        <apex:inputField value="{!acc.Phone}" />
                    </apex:column>
                    <apex:column headerValue="Email">
                        <apex:inputField value="{!acc.Email}" />
                    </apex:column>
                    <apex:column headerValue="Action">
                        <apex:commandButton value="Delete" action="{!deleteRow}" reRender="pb">
                            <apex:param name="rowIndex" value="{!rowNumber}" />
                        </apex:commandButton>
                        <apex:variable var="rowNumber" value="{!rowNumber+1}" />
                    </apex:column>
                </apex:pageBlockTable>
                <apex:commandButton action="{!addRow}" value="Add Attendee" reRender="pb" />
            </apex:pageblockSection>
            <apex:pageBlockButtons>
                <apex:commandButton value="Save" action="{!ave}" />
                <apex:commandButton value="Cancel" action="{!cancel}" />
            </apex:pageBlockButtons>
        </apex:pageBlock>
    </apex:form>
</apex:page>

Regards

closed as unclear what you're asking by Mark Pond, Boris Bachovski, dphil, Jenny B, highfive Aug 28 '15 at 9:31

Please clarify your specific problem or add additional details to highlight exactly what you need. As it's currently written, it’s hard to tell exactly what you're asking. See the How to Ask page for help clarifying this question. If this question can be reworded to fit the rules in the help center, please edit the question.

  • What part isn't working? Where are you stuck? – Mark Pond Aug 27 '15 at 19:27
  • I filled up the fields in the vf page.. when i click add more button.. i need along with the values the field should get cloned.. – hellraizer Aug 27 '15 at 19:40
  • 2
    Sid -- you should edit your post more carefully -- there is no button called Copy in your VF page; there is no button called add more in the VF page; There is no inputText VF component in your VF page – cropredy Aug 27 '15 at 19:43
  • May be you can use jquery to copy the contents to new field after it appears on the UI. just a suggestion. – javanoob Aug 27 '15 at 19:51
1

Here is a updated version of the code to copy the inputtext fields dynamically. I have used a javascript to copy the values to the last row from previous row. The script is inside <apex:outputText rendered="{!isRerender}"> so that it will be called only after the row is added. I have used a different classnameto addAttendee2. Hope this helps.

Controller

public class addAttendee2 {
        public Account accounts;
        public Contact del;
        public List < Contact > addattendeeList {
                get;
                set;
        }
        public List < Contact > delattendeeList {
                get;
                set;
        }
        public List < Contact > attendeeList {
                get;
                set;
        }
        public Integer totalCount {
                get;
                set;
        }
        public Integer rowIndex {
                get;
                set;
        }

        public List < Contact > delAttendees {
                get;
                set;
        }
        public Boolean isRerender{
                get;
                set;
        }
        public addAttendee2(ApexPages.StandardController controller) {

                isRerender = false;
                accounts = (Account) controller.getRecord();
                attendeeList = [Select id, firstName, LastName, Email, Phone from Contact where AccountId = : accounts.Id];
                totalCount = attendeeList.size();

                delattendeeList = new List < Contact > ();
                delattendees = new List < Contact > ();
        }

        public void addRow() {
                isRerender = true;
                addattendeeList = new List < Contact > ();
                attendeeList.add(new Contact(AccountId = accounts.Id));
        }

        public PageReference save() {
                isRerender = false;
                upsert attendeeList;
                delete delattendeeList;
                //return (new ApexPages.StandardController(accounts)).view();
                PageReference pageRef = new PageReference('/apex/addattendeepage');
                pageRef.getParameters().put('id',accounts.Id);
                return pageRef;

        }
        public void deleteRow() {

                rowIndex = Integer.valueOf(ApexPages.currentPage().getParameters().get('rowIndex'));
                System.debug('rowbe deleted ' + rowIndex);
                System.debug('rowm to be deleted ' + attendeeList[rowIndex]);
                del = attendeeList.remove(rowIndex);
                delattendeeList.add(del);

        }
}

VF Page

<apex:page standardController="Account" extensions="addAttendee2" sidebar="false">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
  <style type="text/css">
      .oddrow{background-color: #00FFFF; } 
      .evenrow{background-color: #7FFFD4; }        
      .textalign{text-align:center; } 
  </style>
  <script type="text/javascript">
    function removeHighlight(elem){
        $(elem).removeClass('highlight');
    }  
  </script>
  <apex:form >
    <apex:pageBlock title="Accounts" id="pb">
      <apex:pageMessages />
      <apex:outputText rendered="{!isRerender}">
        <style type="text/css">.last{background-color: #FF0000; }</style>
      </apex:outputText>      
      <apex:variable var="rowNumber" value="{!0}"/>
      <!--  <apex:pageblockSection columns="1"> -->
        <apex:pageBlockTable id="thetable" title="Contacts" var="acc" value="{!attendeeList}" rowClasses="oddrow,evenrow" onRowMouseOver="removeHighlight(this)">
          <apex:column headerValue="No." style="width:20px; text-align:center;" headerClass="centertext">
            <apex:outputText value="{0}" style="text-align:center;">
              <apex:param value="{!rowNumber+1}" />
            </apex:outputText>
          </apex:column>
          <apex:column headerValue="First Name" >
            <apex:inputField value="{!acc.FirstName}"/>
          </apex:column>
          <apex:column headerValue="Last Name" >
            <apex:inputField value="{!acc.LastName}"/>
          </apex:column>
          <apex:column headerValue="Phone" >
            <apex:inputField value="{!acc.Phone}"/>
          </apex:column>
          <apex:column headerValue="Email" >
            <apex:inputField value="{!acc.Email}"/>
          </apex:column>
          <apex:column headerValue="Action" >
            <apex:commandButton value="Delete" action="{!deleteRow}" reRender="pb">
              <apex:param name="rowIndex" value="{!rowNumber}"/>
            </apex:commandButton>
            <apex:variable var="rowNumber" value="{!rowNumber+1}"/>
          </apex:column>
        </apex:pageBlockTable>
      <!-- </apex:pageblockSection> -->
      <apex:commandButton action="{!addRow}" value="Add Attendee" reRender="pb"/>      
      <apex:pageBlockButtons >
        <apex:commandButton value="Save" action="{!save}" />
        <apex:commandButton value="Cancel" action="{!cancel}"/>
      </apex:pageBlockButtons>
      <apex:outputText rendered="{!isRerender}">
        <script type="text/javascript">
            var table = document.getElementById('{!$Component.pb.thetable}');
            var lastRow = table.rows[table.rows.length - 1];
            var prevRow = table.rows[table.rows.length - 2];
            var arrSourceInputs = prevRow.getElementsByTagName("input");
            var arrDestInputs = lastRow.getElementsByTagName("input");
            for(var i in arrSourceInputs){
                if(arrSourceInputs[i].type == "text"){
                    arrDestInputs[i].value = arrSourceInputs[i].value; 
                }
            }
        </script> 
      </apex:outputText>           
    </apex:pageBlock>
  </apex:form>
</apex:page>

Not the answer you're looking for? Browse other questions tagged or ask your own question.