function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Srinivas AnnamSrinivas Annam 

visualforce page buttons

How to create buttons in visulforce page, like ticket booking, in bookmy show.when we click on the button the popup window will open to fill customer details plz any body help urget.
Veenesh VikramVeenesh Vikram
Hi Srinivas, 

To achieve the same, you will have to create a commandbutton, and On Click of te button, you will use javascript to open a VF Page (As a Pop-up). In that VF page, you will have the fields to be populated by the user.

OR

If you want to do everything on a single page, You can do something like This:
<apex:page standardController="Contact" extensions="TestPopup">

<apex:form >
<apex:pageBlock >
<apex:commandButton value="show popup" action="{!showPopup}" rerender="popup" status="status"/>


  
             <apex:outputPanel id="popup">

                <apex:outputPanel id="popInnerOutputPnl" styleClass="customPopup" layout="block" rendered="{!displayPopUp}">
                     <apex:commandButton value="X" title="Close the popup" action="{!closePopup}" styleClass="closeButton" rerender="popup">
                     </apex:commandButton>
                     <apex:pageblockSection >                         
                         
                         <apex:pageblockSectionItem >
                          <apex:outputLabel value="Email" for="address"></apex:outputLabel>
                             <apex:inputField id="address" value="{!Contact.Email}"/>
                         </apex:pageblockSectionItem>
                     </apex:pageblockSection>
                     <apex:commandButton value="Ok" action="{!redirectPopup}" styleClass="closeButton" rerender="popup">
                     </apex:commandButton>
                </apex:outputPanel>
            </apex:outputPanel>
            
            </apex:pageBlock>
            
              </apex:form>
              
                  <style type="text/css">
.customPopup {
    background-color: white;
    border-style: solid;
    border-width: 2px;
    left: 20%;
    padding: 10px;
    position: absolute;
    z-index: 9999;
    /* These are the 3 css properties you will need to tweak so the pop 
                            up displays in the center of the screen. First set the width. Then set 
                            margin-left to negative half of what the width is. You can also add 
                            the height property for a fixed size pop up.*/
    width: 500px;
    top: 20%;
}

.disabledTextBox {
    background-color: white;
    border: 1px solid;
    color: black;
    cursor: default;
    width: 90px;
    display: table;
    padding: 2px 1px;
    text-align:right;
}   

.closeButton {
    float: right;
}
</style>


</apex:page>
 
public with sharing class TestPopup {

    public Boolean displayPopup {get;set;}

    public TestPopup(ApexPages.StandardController controller) {

    }
    
    public void showPopup()
    {
        
    displayPopup = true;

    
    }
    
    public void closePopup() {
        displayPopup = false;
        
    }
    
    public PageReference redirectPopup()
    {
    displayPopup = false;
        //Please uncomment below 3 statements and replace YourObjectId
       // PageReference p=new Pagereference('/'+YourObjectId);
       //  p.setRedirect(true);
       //  return p;
        
    }
    


}

You can convert the above page according to your requirement.

Hope this helps!

Best Regards
Veenesh
Srinivas AnnamSrinivas Annam
Hai Veenesh Vikram,
My requirement is, i want to create floor plan of real estate, just like book my show.i want to show available plots with green and booking plots with red so,i want to show total 100 or 1000 plots.then if i want to implement 1000 buttons wise code is not the correct so,i want take buttons in loop so,  how i can implement this through visual force page.this is urgent requirement plz help me.