How to add h:inputText dynamically in jsf without losing previously dynamically added h:inputText value?

Question

I am trying to add h:inputText and a selectOneMenu dynamically in jsf2. And I got success in that. Now the new problem is that, when I clicked "Add New" button, previously dynamically added h:inputText value is erased. And I don't want that to happen. My code is below. Please help. :)

<h:form>
                                <h:dataTable id="bankAccountDataTable" value="#{kycBeanJSF.kycDataModelJSF.kycdto.bankAccountInfoDTOs}" var="item" binding="#{kycBeanJSF.htmlDataTable}">

                                    <h:column>
                                        <label class="label-control"><p:outputLabel value="आबेदकको बैंक खाता नम्बर:"/><span class="required">*</span></label>
                                        <h:inputText value="#{item.bankAccountNumber}"/>
                                    </h:column>
                                    <h:column>
                                        <h:selectOneRadio id="radio1" value="#{item.bankAccountType}" layout="lineDirection" >
                                            <f:selectItem itemLabel="चल्ती खाता" itemValue="chalti" />
                                            <f:selectItem itemLabel="बचत खाता" itemValue="bachat" />
                                            <f:selectItem itemLabel="कॉल खाता" itemValue="call" />
                                        </h:selectOneRadio>
                                    </h:column>
                                    <h:column>
                                        <h:commandButton value="Remove" action="#{kycBeanJSF.kycWebCoreBean.remove(item)}" immediate="true"/>
                                    </h:column>

                                </h:dataTable>
                                <h:commandButton value="Add New" action="#{kycBeanJSF.kycWebCoreBean.addNew()}" immediate="true"/>
                            </h:form>

My KycBeanJSF is in Request Scope. KycDataModelJSF is in SessionScope.

 KycBeanJSF.java

 public class KycBeanJSF {
@ManagedProperty(value = "#{kycDataModelJSF}")
private KycDataModelJSF kycDataModelJSF;
private KycWebCoreBean kycWebCoreBean;


@PostConstruct
public void initWebCore(){
    kycWebCoreBean = new KycWebCoreBean();
}

 //getters and setters
 }

KycDataModelJSF.java

 @ManagedBean(name = "kycDataModelJSF")
 @SessionScoped
 public class KycDataModelJSF {

private KYCDTO kycdto;

@PostConstruct
public void init(){
    addNew();
}

public KYCDTO getKycdto() {
    if (kycdto == null) {
        kycdto = new KYCDTO();
    }
    return kycdto;
}

public void setKycdto(KYCDTO kycdto) {
    this.kycdto = kycdto;
}
public void addNew() {
    if(getKycdto().getBankAccountInfoDTOs().size()<3){
     getKycdto().getBankAccountInfoDTOs().add(new BankAccountInfoDTO());
    }
    else if(getKycdto().getBankAccountInfoDTOs().size()>=3){
        FacesUtil.setErrorFacesMessage("Sorry, cannot add more than three accounts.");
    }

}
 }

KycWebCoreBean.java

 public class KycWebCoreBean {

private KycDataModelJSF kycDataModelJSF;



public KycWebCoreBean() {
    kycDataModelJSF = (KycDataModelJSF) Util.getSessionObject("kycDataModelJSF");
    kycDependencyInjection = (KycDependencyInjection) Util.getSessionObject("kycDependencyInjection");
    applicantRegisterDataModelJSF = (ApplicantRegisterDataModelJSF) Util.getSessionObject("applicantRegisterDataModelJSF");
}

  public void addNew() {
     if(kycDataModelJSF.getKycdto().getBankAccountInfoDTOs().size()<3){
     kycDataModelJSF.getKycdto().getBankAccountInfoDTOs().add(new BankAccountInfoDTO());
    }
    else if(kycDataModelJSF.getKycdto().getBankAccountInfoDTOs().size()>=3){
        FacesUtil.setErrorFacesMessage("Sorry, cannot add more than three accounts.");
    }
}

public void remove(BankAccountInfoDTO b) {
    kycDataModelJSF.getKycdto().getBankAccountInfoDTOs().remove(b);
}
 }

I will provide more Info if required. Thanks In Advance.

Answer 1

  <h:dataTable id="bankAccountDataTable" value="#{kycBeanJSF.kycDataModelJSF.kycdto.bankAccountInfoDTOs}" var="item">
                                <h:column>
                                    <label class="label-control"><p:outputLabel value="आबेदकको बैंक खाता नम्बर:"/><span class="required">*</span></label>
                                    <h:inputText value="#{item.bankAccountNumber}"/>
                                </h:column>
                                <h:column>
                                    <h:selectOneRadio id="radio1" value="#{item.bankAccountType}" layout="lineDirection">
                                        <f:selectItem itemLabel="चल्ती खाता" itemValue="chalti" />
                                        <f:selectItem itemLabel="बचत खाता" itemValue="bachat" />
                                        <f:selectItem itemLabel="कॉल खाता" itemValue="call" />
                                    </h:selectOneRadio>
                                </h:column>
                                <h:column>
                                    <h:commandButton value="Remove" actionListener="#{kycBeanJSF.kycWebCoreBean.remove(item)}">
                                        <f:ajax render="@form"/>
                                    </h:commandButton>
                                </h:column>

                            </h:dataTable>
                            <h:commandButton value="Add New" actionListener="#{kycBeanJSF.kycWebCoreBean.addNew()}">
                             <f:ajax execute="bankAccountDataTable" render="bankAccountDataTable msg"/>
                            </h:commandButton>