Standard Save button prevent double click

Html source:
<form accept-charset="UTF-8" action="/a02/e" enctype="application/x-www-form-urlencoded" id="editPage" method="post" name="editPage" onsubmit="if (window.ffInAlert) { return false; }if (window.sfdcPage && window.sfdcPage.disableSaveButtons) { return window.sfdcPage.disableSaveButtons(); }" >

In main.js, two function named:
EditPage.prototype.disableSaveButtons ⇒ may used to disable save button after click
EditPage.prototype.enableSaveButtons ⇒ may used to active save button if error happened

Looks like salesforce is use form to submit data, and js to prevent doubleclick.

Prevent double submission of forms |二重送信防止

<!-- 送信ボタン2度押し防止策 -->
<script type="text/javascript">
var isSave = false;
function check(){
if (!isSave) {
isSave = true;
return true;
}
return false;
}

<apex:commandButton action="{!test}" value="Refresh" onclick="return check();"/>

https://developer.salesforce.com/forums?id=906F000000095yxIAA
http://salesforce.stackexchange.com/questions/7729/disable-commandbutton-after-first-click-to-prevent-double-submission

Upload file/attachment | Apex Visualforce | Salesforce

template:

<apex:form>
    <apex:inputFile value="{!file}" />
    <apex:commandbutton action="{!upload}" value="Upload" />
</apex:form>

Apex:

// file
public blob file {get;set;}
pubilc PageReference upload(){
    ContentVersion photofile = new ContentVersion();
    if(file != null){
        photofile.VersionData = file;
        photofile.Title='title';
        photofile.IsMajorVersion = false;
        photofile.PathOnClient='/title';
        insert photofile;
    }
    try{
        insert photofile;
    } catch(Exception Ex){
        System.debug('Ex==>'+Ex);
    }
    photofile = [select id, ContentDocumentId from ContentVersion WHERE Id =: photofile.Id];

    ContentDocumentLink cdl = new ContentDocumentLink();
    cdl.ContentDocumentId = photofile.ContentDocumentId;
    cdl.LinkedEntityId = [parentId]; 
    cdl.ShareType = 'V';
    cdl.Visibility = 'AllUsers';

    try{
        insert cdl;
    } catch(Exception Ex){
        System.debug('Ex==>'+Ex); 
    }
}

// Attachment
public blob file {get;set;}
pubilc PageReference upload(){
    try {
        if(file != null){
            attachment.body = file;
            attachment.name='title';
            attachment.OwnerId = UserInfo.getUserId();
            attachment.ParentId = [parentId];
            attachment.IsPrivate = true;

            insert attachment;
        }else{
            attachment = new Attachment();
        }
    } catch (Exception e) {
        ApexPages.addMessage(new ApexPages.message(ApexPages.severity.ERROR,'error'));
        return null;
    }
}

Output data in 3 columns by repeat in Visualforce

There're a lot way to output a list of strings in 3 columns, like 3*n.

Here are two ways.

First need to get the value of list before output, list should be able to public get. Here is an example.

// [sample] string[]
public String[] getSampleStrings() {
    return new String[]{'ONE','TWO','THREE','FOUR','FIVE','SIX','SEVEN','EIGHT','NINE'};
}

Way 1: Use first and rows in apex:outputPanel

// Repeat sample start (by first and rows)
<apex:outputpanel layout="block">
    <apex:repeat first="1" rows="3" value="{!sampleStrings}" var="sampStr">
        <apex:outputtext style="padding: 0 10px;" value="{!sampStr}">
    </apex:outputtext></apex:repeat>
</apex:outputpanel>
<apex:outputpanel layout="block">
    <apex:repeat first="4" rows="3" value="{!sampleStrings}" var="sampStr">
        <apex:outputtext style="padding: 0 10px;" value="{!sampStr}">
    </apex:outputtext></apex:repeat>
</apex:outputpanel>

Use template in Visualforce page

If pages have same part like header or footer, use page template will be more efficient.

Salesforce provides some page template. For example, when you create a community site, Salesforce will create a page template named CommunitiesTemplate.

<apex:page showHeader="false" sidebar="false" id="CommunitiesTemplate">
  <apex:stylesheet value="{!$Site.Prefix}/communities/CommunitiesStyles.css"/>
  <apex:insert name="header"/>
  <apex:insert name="body"/>
  <apex:insert name="footer"/>
</apex:page>

<apex:insert name="header"/> is the header part.
<apex:insert name="body"/> is the main content part.
<apex:insert name="footer"/> is the footer part.

<!-- Import template by id -->
<apex:composition template="CommunitiesTemplate">
       <apex:define name="header">This is header used to contain something like: logo, nav menu...</apex:define>
       <apex:define name="body">This is the body  used to contain contents and sidebar.</apex:define>
       <apex:define name="footer">This is the footer. Usually use to contain copyright.</apex:define>
</apex:composition>

How to display Visualforce page as PDF

Add renderAs="pdf" in <apex:page> tag as below.

<apex:page renderAs="pdf">

Add CSS style to set format of page.

@page {
size: letter;
@top-center {content: "PDF Sample";}
@bottom-center {content: "Page " counter(page) " of " counter(pages);}
}

*Most used page size: landscape/8.27in 11.69in (A4 width and height)

Attention:
@page must be inside of <html><head><style>, or include as a static resource.

<apex:page renderAs="pdf">
    <html>
        <head>
            <style>
                @page {...}
            </style>
        </head>
    </html>
</apex:page>

Use page-break to control when is next page. If you didn't set page break, it will only display in next page when out of bound.

<style>
.page-break {display:block; page-break-after:always;}
</style>
<body>
        <div class="page-break">
                <apex:outputText >Page 1</apex:outputText>
        </div>
        <div>Page 2</div>
</body>