Sign Up ›

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
sundar84sundar84 

Dynamic input text creation based selected pick list value

Hi Friends

 

I am new in visual force development .Dynamically how to create input text boxes based on the selected pick list value in visual force page. for ex: If the  picklist value is 4 , four text boxes will create in the visual force page. Please any one can guide me to achieve this problem..

 

Thanks

Sundar

Best Answer chosen by Admin (Salesforce Developers) 
nagalakshminagalakshmi

Hi sundar,

 

Try this code.

 

 

public class dynamictextboxes
{
public string name{set;get;}
public integer picklistselectedvalue{set;get;}
public integer n{set;get;}
  public List<dynamictextboxes> wraplist{set;get;}
  public DynamicTextBoxes()
  {
    wraplist = new List<dynamictextboxes>();
//sortthelist();
  }
 public list<SelectOption> getItems()
  {
    List<SelectOption> options = new List<SelectOption>();
   for (integer i = 0; i < =10; i++)
      options.add(new SelectOption(String.valueOf(i), String.valueOf(i)));
    return options;
  }
public void sortthelist()
{
wraplist.clear();
system.debug('%%%%%%%%%%%%'+picklistselectedvalue);
for(integer i=0;i<picklistselectedvalue;i++)
{
dynamictextboxes d=new dynamictextboxes();
//d.n=wraplist.size()+1;
wraplist.add(d);
}
}
public list<dynamictextboxes> getdata()
{
return wraplist;
}
}

 

Visual force page:

 

<apex:page controller="dynamictextboxes">

<apex:form >

 

 

<apex:selectlist value="{!picklistselectedvalue}" size="1">

   <apex:selectOptions value="{!items}"/>

   <apex:actionSupport event="onchange" action="{!SortTheList}"/>

   </apex:selectlist>

   <apex:pageBlock>

<apex:pageBlockSection >

<apex:pageblockTable value="{!data}" var="e">

<apex:column>

 

<apex:inputtext value="{!e.name}"/>

</apex:column>

<apex:column>

 

<apex:inputtext value="{!e.name}"/>

</apex:column>

<apex:column>

 

<apex:inputtext value="{!e.name}"/>

 

</apex:column>

 

</apex:pageblockTable>

</apex:pageBlockSection>

</apex:pageBlock>

</apex:form>

</apex:page>

 

 

Thanks,

Lakshmi

All Answers

super developersuper developer

You can do this with Wrapper class.

In VF page:

 

<apex:selectlist //give the value of picklist>

 <apex:actionSupport event="onchange" action="{!SortTheList}" />

</apex:selectlist>

<apex:repeat value="{!wraplist}" var="w1">

<apex:inputtext value="{!w1.text}"/>

</apex:repeat>

 

In class

public list<warp> wraplist{set;get;}

public class wrap{

public string text{set;get;}

}

public void sortthelist(){

for(integer i=0;i<picklistselectedvalue;i++)

{

wrap w=new warp();

wraplist.add(w);

}

}

 

 
nagalakshminagalakshmi

Hi,

      Actually i am also need same requirement. i use the code as

 

 

public class dynamictextboxes
{
public string name{set;get;}
public integer picklistselectedvalue{set;get;}
public list<SelectOption> getitems()
{
List<SelectOption> options = new List<SelectOption>();
options.add(new SelectOption('0','0')); 
options.add(new SelectOption('1','1')); 
options.add(new SelectOption('2','2'));
options.add(new SelectOption('3','3'));
options.add(new SelectOption('4','4'));
return options;
}
public list<wrapclass> wraplist{set;get;}
public class wrapclass
{
public string text{set;get;}
public integer n{set;get;}
}
public void sortthelist()
{
for(integer i=0;i<picklistselectedvalue;i++)
{
wrapclass w=new wrapclass();
wraplist.add(w);
}
}
public list<wrapclass> getdynamicboxes()
{
return wraplist;
}
}
visual force page:
<apex:page controller="dynamictextboxes">
<apex:form >
   <apex:selectlist value="{!picklistselectedvalue}" size="1">
   <apex:selectOptions value="{!items}"/>
   <apex:actionSupport event="onchange" action="{!SortTheList}" />
   </apex:selectlist>
<apex:repeat value="{!wraplist}" var="w1">
<apex:inputtext value="{!w1.text}"/>
</apex:repeat>
</apex:form>
</apex:page>

 

 

Whem i am execute the page it gives the error like as

System.NullPointerException: Attempt to de-reference a null object 

 

Class.dynamictextboxes.sortthelist: line 29, column 1 External entry point

 

 

 please help me how to solve these..

 

Thanks,

Lakshmi.
Damien_Damien_

nagalakshmi,

 

You never initialize your list so you get that error.

 

Sundar,

 

I took the code nagalakshmi gave, and modified it to be simpler for you.  Nontested of course, so there may be minor bugs but if there are they shouldn't be hard to find.

 

 

public class DynamicTextBoxes
{
  public integer picklistselectedvalue{set;get;}
  public List<String> wraplist{set;get;}
  public DynamicTextBoxes()
  {
    wraplist = new List<String>();
  }
  public list<SelectOption> getItems()
  {
    List<SelectOption> options = new List<SelectOption>();
   for (integer i = 0; i < 5; i++)
      options.add(new SelectOption(String.valueOf(i), String.valueOf(i)));
    return options;
  }
  public void setupWrapper()
  {
    wraplist.clear();
    for(integer i=0;i<picklistselectedvalue;i++)
    {
      wraplist.add('');
    }
  }
}
visual force page:  
<apex:page controller="dynamictextboxes">
<apex:form id="myform">
   <apex:selectlist value="{!picklistselectedvalue}" size="1">
   <apex:selectOptions value="{!items}"/>
     <apex:actionSupport event="onchange" action="{!setupWrapper}" rerender="myform" />
   </apex:selectlist>
<apex:repeat value="{!wraplist}" var="w1">
<apex:inputtext value="{!w1}"/>
</apex:repeat>
</apex:form>
</apex:page>

 
nagalakshminagalakshmi

Hi Sundar, 

 

try this code it is working, which has been send by damien. But there is some little bit modifications is there..

 

 

public class dynamictextboxes
{
public string name{set;get;}
public integer picklistselectedvalue{set;get;}
  public List<dynamictextboxes> wraplist{set;get;}
  public DynamicTextBoxes()
  {
    wraplist = new List<dynamictextboxes>();
  }
 public list<SelectOption> getItems()
  {
    List<SelectOption> options = new List<SelectOption>();
   for (integer i = 0; i < =10; i++)
      options.add(new SelectOption(String.valueOf(i), String.valueOf(i)));
    return options;
  }
public void sortthelist()
{
wraplist.clear();
for(integer i=0;i<picklistselectedvalue;i++)
{
system.debug('%%%%%%%%%%%%'+picklistselectedvalue);
dynamictextboxes d=new dynamictextboxes();
wraplist.add(d);
}
}
}

 

Visual force page:

 

<apex:page controller="dynamictextboxes">

<apex:form >

   <apex:selectlist value="{!picklistselectedvalue}" size="1">

   <apex:selectOptions value="{!items}"/>

   <apex:actionSupport event="onchange" action="{!SortTheList}"/>

   </apex:selectlist>

<apex:repeat value="{!wraplist}" var="w1">

<apex:inputtext value="{!w1.name}"/>

</apex:repeat>

</apex:form>

</apex:page>

 

 

Thanks,

Lakshmi.
nagalakshminagalakshmi

Hi Damien,

 

Thank you very so much the code is working which you have sent.

 

 

Thanks,

Lakshmi
sundar84sundar84

Thanks Damien and Lakshmi

 

Yes i have tested this code  its working fine. Thanks for  your support. really its very helpful for me. 

 

Thanks

Sundar

 
sundar84sundar84

 

Hi Damien and lakshmi 
I need to display the 3 fields in a  row.  If the picklist value is 2 , two row will create. Still i am working  to complete this requirement. 
<apex:pageBlock title="List of Pallet Items" id="pb">
             <apex:pageBlockTable value="{!PalletItems}" var="d" id="pList">
             <apex:repeat value="{!wraplist}" var="w1" id="theRepeat">           
                 <apex:column headerValue="Pallet Id" id="col1"> 
                      <apex:inputtext value="{!w1.Name}" id="Palletid"/>
                  </apex:column> 
                  <apex:column headerValue="Gross Weight" id="col2"> 
                      <apex:inputtext value="{!w1.Gross_Weight__c}" id="Gweight"/>
                  </apex:column>                    
                  <apex:column headerValue="Tare Weight" id="col3">
                      <apex:inputtext value="{!w1.Tare_Weight__c}" id="Tweight"/>
                  </apex:column>                                             
             </apex:repeat>     
           </apex:pageBlockTable>
   </apex:pageBlock>
Thanks
Sundar

 
nagalakshminagalakshmi

Hi sundar,

 

Try this code.

 

 

public class dynamictextboxes
{
public string name{set;get;}
public integer picklistselectedvalue{set;get;}
public integer n{set;get;}
  public List<dynamictextboxes> wraplist{set;get;}
  public DynamicTextBoxes()
  {
    wraplist = new List<dynamictextboxes>();
//sortthelist();
  }
 public list<SelectOption> getItems()
  {
    List<SelectOption> options = new List<SelectOption>();
   for (integer i = 0; i < =10; i++)
      options.add(new SelectOption(String.valueOf(i), String.valueOf(i)));
    return options;
  }
public void sortthelist()
{
wraplist.clear();
system.debug('%%%%%%%%%%%%'+picklistselectedvalue);
for(integer i=0;i<picklistselectedvalue;i++)
{
dynamictextboxes d=new dynamictextboxes();
//d.n=wraplist.size()+1;
wraplist.add(d);
}
}
public list<dynamictextboxes> getdata()
{
return wraplist;
}
}

 

Visual force page:

 

<apex:page controller="dynamictextboxes">

<apex:form >

 

 

<apex:selectlist value="{!picklistselectedvalue}" size="1">

   <apex:selectOptions value="{!items}"/>

   <apex:actionSupport event="onchange" action="{!SortTheList}"/>

   </apex:selectlist>

   <apex:pageBlock>

<apex:pageBlockSection >

<apex:pageblockTable value="{!data}" var="e">

<apex:column>

 

<apex:inputtext value="{!e.name}"/>

</apex:column>

<apex:column>

 

<apex:inputtext value="{!e.name}"/>

</apex:column>

<apex:column>

 

<apex:inputtext value="{!e.name}"/>

 

</apex:column>

 

</apex:pageblockTable>

</apex:pageBlockSection>

</apex:pageBlock>

</apex:form>

</apex:page>

 

 

Thanks,

Lakshmi

This was selected as the best answer
PpapasPpapas

nagalakshmi thanks so much for this code. i have project and you saved a tone of time. i took this opportunity to ask you a further question. based to the theory of your code, can you help me achieve the "the sum of these input fields?"

 

for example if i select 5 from the picklist, i get 1 row with 5 input fields. how to modify my controller (your controller:smileyhappy: ) in order to sum them?

 

i would really appreciate your response. thank again so much
Subhashini UppalapatiSubhashini Uppalapati
Hello,
I have a similar requirement. Here i need to dynamically create input text box based on the picklist value selection. For example, if the picklist value selected is 'Email&Phone', then it should display two input text boxes: one should have input label as "Email" and the other should have "Phone".
Can someone please help me with this?
Thanks in advance.