Question

I have objects of wrapper class in a list and in my Vf page i am checking if the object of the wrapper contains null, if it has null then i am displaying ‘Free’ else displaying the appointment details.

I want to have a button create Appointment instead of ‘Free’.

What would the correct way to insert the button code ?

<apex:repeat var="slot" value="{!liTimeSlots}">

<tr class="{!IF(ISNULL(slot.sAppointment), 'Free', 'Fill')}">
    <td ><apex:outputText value="{!slot.tstart1}"/></td>

      <td><apex:outputText value="{!IF(ISNULL(slot.sAppointment), 'Free', slot.sAppointment.name)}"/></td>
      <td><apex:outputText value="{!IF(ISNULL(slot.sAppointment), '', slot.sAppointment.Appointment_Type__c)}"/></td>
      <td><apex:outputText value="{!IF(ISNULL(slot.sAppointment), '', slot.sAppointment.Patient__c)}"/></td>
        </tr> 
    <tr>
    <td></td>

      <td><apex:outputText value="{!IF(ISNULL(slot.sAppointmentOverlap), ' ', slot.sAppointmentOverlap.name)}"/></td>
      <td><apex:outputText value="{!IF(ISNULL(slot.sAppointmentOverlap), '', slot.sAppointmentOverlap.Appointment_Type__c)}"/></td>
      <td><apex:outputText value="{!IF(ISNULL(slot.sAppointmentOverlap), '', slot.sAppointmentOverlap.Patient__c)}"/></td>
        </tr>   

EDIT :
Before i read the answers from mmmix and LaceySnr i implemented with use of css classes. not sure if this is the best way. But now the issue is of the param value not coming up on the controller method.

<apex:repeat var="slot" value="{!liTimeSlots}">

<tr class="{!IF(ISNULL(slot.sAppointment), 'Free', 'Fill')}">
    <td ><apex:outputText value="{!slot.tstart1}"/></td>

      <td><apex:outputText value="{!IF(ISNULL(slot.sAppointment), 'Free', slot.sAppointment.name)}"/></td>
      <td><apex:outputText value="{!IF(ISNULL(slot.sAppointment), '', slot.sAppointment.Appointment_Type__c)}"/></td>
      <td><apex:outputText value="{!IF(ISNULL(slot.sAppointment), '', slot.sAppointment.Patient__c)}"/></td>
      <td><div Class="{!IF(ISNULL(slot.sAppointment), 'ShowButton', 'HideButton')}">
      <apex:commandButton action="{!Book}" Value="Book">
      <apex:param name="Timev" value="{!slot.tstart1}"/></apex:commandButton></div></td>
        </tr> 
    <tr>
    <td></td>

      <td><apex:outputText value="{!IF(ISNULL(slot.sAppointmentOverlap), ' ', slot.sAppointmentOverlap.name)}"/></td>
      <td><apex:outputText value="{!IF(ISNULL(slot.sAppointmentOverlap), '', slot.sAppointmentOverlap.Appointment_Type__c)}"/></td>
      <td><apex:outputText value="{!IF(ISNULL(slot.sAppointmentOverlap), '', slot.sAppointmentOverlap.Patient__c)}"/></td>
        </tr>   

public  PageReference Book()
{
String Timeval=ApexPages.CurrentPage().getParameters().get('Timev');
system.debug('timeval +++++++++++++++'+Timeval) ;// This is returning null
pr=Page.Appointment;
pr.setRedirect(true);
pr.getParameters().put('App_start',Timeval);
pr.getParameters().put('App_start_Date',string.valueof(Appointment.Start_Date__c));

return pr;
}

Answer 1

Not sure I understand the thing about the button, but you also have an alternative way of doing !IF, for example:

<apex:outputText value="{!field}" rendered="{!condition"} />

If for button you are thinking about inserting apex:commands into a repeater and tie event handler to specific row, that can be done through parameters

for example I used this to crete a comamnd link in every table row:

<apex:column headerValue="Action">
    <apex:commandLink id="cmdDetachService" action="{!detachService}" value="Detach" rerender="mainBlock, errors" status="ajaxPostStatus" >
        <apex:param value="{!item.id}" name="activeService" />
    </apex:commandLink>
</apex:column>

Then in the event handler you can extract parameter from page parameters, for example ApexPages.CurrentPage().getParameters().get('activeService')

Also, if you want to have if/then/else text/button rendering inside a td tag you can use this

<td>
    <apex:outputText .... rendered="{!condition"} />
    <apex:commandButton .... rendered="{!NOT(condition)"} />
</td>