Sign Up ›

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

Hide and show the apex Inputtext tags

hi..! 

i have a requirement, when i clicks on the edit button, span tag should have to change to the Input tag.. 
and when click on the Delete button, that particular row from list should have to removed form the list .. 
  
public class testingclass {

public string xmlstring{get;set;}
 public string testingval{get;set;}
 public List<string> lsttestingval{get;set;}

 public testingclass(){
 
  lsttestingval = new list<string>();
  
   lsttestingval.add('Red');
    lsttestingval.add('Blue');
    lsttestingval.add('Yellow');
    
  }
  
}

Visualforce page: 
<apex:page controller="testingclass">
<apex:form >

   
    <table style="width:100%">
  <tr>
    <th>name</th>
    <th>Edit</th>
    <th>Delete</th>
    
  </tr>
 
    <apex:repeat var="a" value="{!lsttestingval}"> 
     <tr>
     <td><span>{!a}</span><apex:inputText styleClass="display:none"/></td> <td><apex:commandButton value="Edit"/></td><td><apex:commandButton value="Delete"/></td>
      </tr>
     </apex:repeat>
     
 
 
</table>
   
   </apex:form>
</apex:page>

After, editing, in input, the span value should have the same as the Edited value.. 

Thanks in Advance.
Deepika
Rishabh Bansal 23Rishabh Bansal 23
Hi Deepika,

I would recomment you to try using below tag:-
<apex:outputPanel rendered="{!anyBooleanValue}">{!a}</apex:outputPanel>
<apex:outputPanel rendered="{!!anyBooleanValue}"><apex:inputText /></apex:outputPanel>

anyBooleanValue = Any boolean attribute which will be true when you click on edit and will be false when you enter the value in input tag and hit enter.

Also, for removal on click of delete, get the index of current list and splice it from the list lsttestingval.

Thanks,
Rishabh Bansal
DeepikareddyDeepikareddy
Hi Rishabh .. ! ,..Can u please help out  with coding..it will helps a lot. 
Thanks...!
 
DeepikareddyDeepikareddy
Hi.Rishabh Bansal....!
I have tried with your code..!

  
<apex:page controller="testingclass">
<apex:form >

   
    <table style="width:100%">
  <tr>
    <th>name</th>
    <th>Edit</th>
    <th>Delete</th>
    
  </tr>
 <apex:repeat var="a" value="{!lsttestingval}"> 
     <tr>
     <td>
      <apex:outputPanel rendered="{!anyBooleanValue}">{!a}</apex:outputPanel>
     <apex:outputPanel rendered="{!!anyBooleanValue}"><apex:inputText value="{!a}"/></apex:outputPanel>
     </td>
     <td><apex:commandbutton action="{!Edit}" value="Edit"/></td>
      <td><apex:commandbutton action="{!delet}" value="Delete" /></td>
      </tr>
     </apex:repeat>
     
 
 
</table>
   
   </apex:form>
</apex:page>

Apex Class: 
public class testingclass {

public string xmlstring{get;set;}
 public string testingval{get;set;}
 public List<string> lsttestingval{get;set;}

 public boolean anyBooleanValue{get;set;}
 public testingclass(){
  anyBooleanValue =true;
  lsttestingval = new list<string>();
  
   lsttestingval.add('Red');
    lsttestingval.add('Blue');
    lsttestingval.add('Yellow');
    
  }
  
   public void edit(){
   
   anyBooleanValue =False;
   }
   
   public void delet(){
   
  system.debug(lsttestingval.size());
    }
  
}

1)Aftr clicking on edit button whole values are changing to edit.. , and how to take the particular index , size.. 

Thank  you in advance..!
Rishabh Bansal 23Rishabh Bansal 23
For index refer below:-

variable 'cnt' can be used as index

<apex:variable var="cnt" value="{!0}" /> 
<apex:repeat value="{!someArray}" var="item">
<apex:OutputText value="{!cnt}"/>
.
. do something
.
<apex:variable var="cnt" value="{!cnt+1}"/>
</apex:repeat>

AND for making only particular row editable try this:-
<apex:outputPanel rendered="{!!anyBooleanValue && cnt == !indexSel}"><apex:inputText value="{!a}"/>
where indexSel is filled when you click on edit button with the index of that particular row.

Hope it helps
Thanks
DeepikareddyDeepikareddy
Hi.. 
public class testingclass {

public string xmlstring{get;set;}
 public string testingval{get;set;}
 public List<string> lsttestingval{get;set;}
 public boolean indexSel{get;set;}
 public boolean anyBooleanValue{get;set;}
 public testingclass(){
  anyBooleanValue =true;
  lsttestingval = new list<string>();
  
   lsttestingval.add('Red');
    lsttestingval.add('Blue');
    lsttestingval.add('Yellow');
    
  }
  
   public void edit(){
   
   anyBooleanValue =False;
   }
   
   public void delet(){
   
  system.debug(lsttestingval.size());
    }
  
}

Visualfrce pagee: 
<apex:page controller="testingclass">
<apex:form >

   
    <table style="width:100%">
  <tr>
    <th>name</th>
    <th>Edit</th>
    <th>Delete</th>
    
  </tr>
  <apex:variable var="cnt" value="{!0}" /> 
 <apex:repeat var="a" value="{!lsttestingval}"> 
     <tr>
     <td>
      <apex:outputPanel rendered="{!anyBooleanValue}">{!a}</apex:outputPanel>
     <apex:outputPanel rendered="{!!anyBooleanValue && cnt == !indexSel}"><apex:inputText value="{!a}"/></apex:outputPanel>
     </td>
     <td><apex:commandbutton action="{!Edit}" value="Edit"/></td>
      <td><apex:commandbutton action="{!delet}" value="Delete" /></td>
      </tr>
      <apex:variable var="cnt" value="{!cnt+1}"/>
     </apex:repeat>
     
 
 
</table>
   
   </apex:form>
</apex:page>
showing Error:

 Incorrect parameter type for operator '='. Expected Number, received Boolean

Please help me out with this..!

Thanks 
Deepika
Rishabh Bansal 23Rishabh Bansal 23
public boolean indexSel{get;set;} should be public Integer indexSel{get;set;}
DeepikareddyDeepikareddy
public class testingclass {

public string xmlstring{get;set;}
 public string testingval{get;set;}
 public List<string> lsttestingval{get;set;}
 public integer indexSel{get;set;}
 public boolean anyBooleanValue{get;set;}
 public testingclass(){
  anyBooleanValue =true;
  lsttestingval = new list<string>();
  
   lsttestingval.add('Red');
    lsttestingval.add('Blue');
    lsttestingval.add('Yellow');
    
  }
  
   public void edit(){
   
   anyBooleanValue =False;
   }
   
   public void delet(){
   
  system.debug(lsttestingval.size());
    }
  
}


v.f page:

 <apex:page controller="testingclass">
<apex:form >
    <table style="width:100%">
  <tr>
    <th>name</th>
    <th>Edit</th>
    <th>Delete</th>
    
  </tr>
  <apex:variable var="cnt" value="{!0}" /> 
 <apex:repeat var="a" value="{!lsttestingval}"> 
     <tr>
     <td>
      <apex:outputPanel rendered="{!anyBooleanValue}">{!a}</apex:outputPanel>
     <apex:outputPanel rendered="{!!anyBooleanValue && cnt == !indexSel}"><apex:inputText value="{!a}"/></apex:outputPanel>
     </td>
     <td><apex:commandbutton action="{!Edit}" value="Edit"/></td>
      <td><apex:commandbutton action="{!delet}" value="Delete" /></td>
      </tr>
      <apex:variable var="cnt" value="{!cnt+1}"/>
     </apex:repeat>
     
 
 
</table>
   
   </apex:form>
</apex:page>

it is not getting  adding..can u help it

Thanks 
Deepika