+ Start a Discussion
giri rocksgiri rocks 

how to add multiple rows in visualforce page

how to add multiple rows in visualforce page....

Consider a row having apex:inputfield  ....on click on button it should add 5 rows ....

 

plz help....

Best Answer chosen by Admin (Salesforce Developers) 
Pradeep_NavatarPradeep_Navatar

Find below a sample code :

 

             VF Code:

                                                 <apex:page controller="cls_dynamicrow">

                                                  <apex:form>

                                                  <apex:outputPanel id = "refreshdata">

                                                   <apex:repeat value="{!propLstQuesAns}" var="varLQA" id="textquesrp">

                                                   <p>

                                                                <apex:inputtext value="{!varLQA.propAns}" id="textques"/></p>

                                                   </apex:repeat>

                                                   </apex:outputPanel>

                                                   <apex:commandButton action="{!DynamicRow}" reRender="refreshdata" value="ADD ROW"/>

                                                  </apex:form>

                                                </apex:page>

 

Controller code:

                                                public class cls_dynamicrow

                                                {

                                                  public List<WrapperQueAns> lstQueAns = new List<WrapperQueAns>{};

                                                  public List<WrapperQueAns> propLstQuesAns { get { return lstQueAns; } set { lstQueAns = value; } }

                                                  Public cls_dynamicrow(){

                                                                WrapperQueAns wqa = new WrapperQueAns();

                                                                wqa.propAns = '';

                                                                lstQueAns.add(wqa);

                                                  }

                                                  public void DynamicRow(){

                                                                for(Integer i=0;i<5;i++){

                                                                  WrapperQueAns wqa = new WrapperQueAns();

                                                                  wqa.propAns    = '';

                                                                  lstQueAns.add(wqa);

                                                                }

                                                  }

                                                  public class WrapperQueAns{public String propAns   { get; set; } }//End Class WrapperQueAns

                                                }

 

Hope this helps.

All Answers

bob_buzzardbob_buzzard

There's a number of ways that you could achieve this.

 

Personally I'd create a list of sobjects that contain the field, then I'd initialise that with one element.  

The page would contain a table that iterates the list and display an input field per element.

The add button would execute a method on the controller to add 5 elements to the list and then re-renders the table.

giri rocksgiri rocks

can you explain me with a sample code ...please.......

Pradeep_NavatarPradeep_Navatar

Find below a sample code :

 

             VF Code:

                                                 <apex:page controller="cls_dynamicrow">

                                                  <apex:form>

                                                  <apex:outputPanel id = "refreshdata">

                                                   <apex:repeat value="{!propLstQuesAns}" var="varLQA" id="textquesrp">

                                                   <p>

                                                                <apex:inputtext value="{!varLQA.propAns}" id="textques"/></p>

                                                   </apex:repeat>

                                                   </apex:outputPanel>

                                                   <apex:commandButton action="{!DynamicRow}" reRender="refreshdata" value="ADD ROW"/>

                                                  </apex:form>

                                                </apex:page>

 

Controller code:

                                                public class cls_dynamicrow

                                                {

                                                  public List<WrapperQueAns> lstQueAns = new List<WrapperQueAns>{};

                                                  public List<WrapperQueAns> propLstQuesAns { get { return lstQueAns; } set { lstQueAns = value; } }

                                                  Public cls_dynamicrow(){

                                                                WrapperQueAns wqa = new WrapperQueAns();

                                                                wqa.propAns = '';

                                                                lstQueAns.add(wqa);

                                                  }

                                                  public void DynamicRow(){

                                                                for(Integer i=0;i<5;i++){

                                                                  WrapperQueAns wqa = new WrapperQueAns();

                                                                  wqa.propAns    = '';

                                                                  lstQueAns.add(wqa);

                                                                }

                                                  }

                                                  public class WrapperQueAns{public String propAns   { get; set; } }//End Class WrapperQueAns

                                                }

 

Hope this helps.

This was selected as the best answer
giri rocksgiri rocks

Thank you very much....

diya_sweet791.3326577046074976diya_sweet791.3326577046074976

<!-- visualforce page !-->

<apex:page controller="mypagecontroller">
<apex:form >
<apex:pageBlock >

<apex:pageblockbuttons >
<apex:commandButton action="{!saving}" value="save" />
</apex:pageblockbuttons>

<apex:repeat value="{!myrecords }" var="itr">
Name : <apex:inputField value="{!itr.Name}"/>
Select Age :<apex:inputField value="{!itr.Age__c}" /> <br/>
</apex:repeat>

</apex:pageBlock>
</apex:form>
</apex:page>

 

<!-- apex class !-->

public class mypagecontroller {

//attributes|properties
public list <volunteer__c> myrecords {get;set;}

 

//constructor
public mypagecontroller(){
myrecords =new list <volunteer__c> ();
myrecords.add(new volunteer__c());
myrecords.add(new volunteer__c());
myrecords.add(new volunteer__c());
myrecords.add(new volunteer__c());
myrecords.add(new volunteer__c());
}

//methods|functions

public void saving ()
{ insert myrecords ; }


}

 

Sumit KumarSumit Kumar

Can you please tell me How to remove the extra row If by  mistake user added one extra row and he wants to remove the extra row . What is the logic for that ???

 

Please give me a quick reply my design is like that only....!!!!

bob_buzzardbob_buzzard

I've written a blog post on this topic.  Have a look at:

 

http://bobbuzzard.blogspot.co.uk/2011/07/managing-list-of-new-records-in.html

 

and see if that helps.

Sumit KumarSumit Kumar

Thanks Its really Helpful.

Ker DeveloperKer Developer

Hello , 

 

Is it possible to have multiple records with attachments too? The wrapper can't recognize that a i have also an attachment