Skip to main content
Formatted Code
Source Link
crmprogdev
  • 41k
  • 9
  • 58
  • 116

Apex page:Apex page:

<apex:page controller="EmailOpportunityAttachment">

var delim = ";";function lookupPick2(editPage, p2_lkid, p2, contactId, contactName, cas4, accountName, cas4_lkid, accountId, h){document.getElementsByClassName('p2')[0].value = contactName;document.getElementById('p2_lkid').value = contactId;closePopup();}function pickupValue(additionalToValue, ccValue, bccValue){//var editPage = document.getElementsByClassName('editPage')[0];var p24 = document.getElementsByClassName('p24')[0];var p4 = document.getElementsByClassName('p4')[0];var p5 = document.getElementsByClassName('p5')[0];if(additionalToValue!= ''){if(p24.value!= ''){p24.value += delim;}p24.value += additionalToValue;}if(ccValue!= ''){if(p4.value!= ''){p4.value += delim;}p4.value += ccValue;}if(bccValue!= ''){if(p5.value!= ''){p5.value += delim;}p5.value += bccValue;}closePopup();}function openDocumentUpload(e){setLastMousePosition(e);openPopup('/widg/filepicker_fs.jsp?lktp=015&mode=1&eid=00Yg0000000aN7g&utype=00P&omode=1&otype=2', 'doc', 450, 450, 'width=450,height=450,scrollbars=yes,toolbar=no,status=no,directories=no,menubar=no,resizable=1', true);}function attachPhxAttachment(e){var selector = document.getElementById('attS');var splt = selector.value.split('##');var id = splt[0];var size = splt[1];var tr = document.getElementById('tr_' + id);var fileStr = document.getElementById('fileStr');fileStr.innerHTML += tr.outerHTML;populateAttIds();}function populateAttIds(){var hiddenDv = document.getElementsByClassName('attDvBlock')[0];var hiddenAttIds = hiddenDv.getElementsByClassName('hiddenAttIds');var inps = document.getElementsByClassName('attIds')[0];inps.value = '';if(hiddenAttIds && hiddenAttIds.length > 0){for(var i=0; i
<apex:sectionHeaderpage title="Task"controller="EmailOpportunityAttachment">
 subtitle="Send an Email" 
<script type="text/>javascript">

<apex:formvar id="editPage"delim onsubmit="if= ";";
function lookupPick2(windoweditPage, p2_lkid, p2, contactId, contactName, cas4, accountName, cas4_lkid, accountId, h){
    document.ffInAlertgetElementsByClassName('p2')[0].value = contactName;
    document.getElementById('p2_lkid').value = contactId;
    closePopup();
}
function pickupValue(additionalToValue, ccValue, bccValue) { 
 return false;  //var editPage = document.getElementsByClassName('editPage')[0];
    var p24 = document.getElementsByClassName('p24')[0];
    var p4 = document.getElementsByClassName('p4')[0];
    var p5 = document.getElementsByClassName('p5')[0];
    if(additionalToValue != '') {
        if (p24.value != '') {
            p24.value += delim;
        }" 
 styleClass="editPage">       p24.value += additionalToValue;
    }
    if(ccValue != '') {
        if (p4.value != '') {
            p4.value += delim;
        }
        p4.value += ccValue;
    }
    if(bccValue != '') {
        if (p5.value != '') {
           p5.value += delim;
        }
        p5.value += bccValue;
    }
    closePopup();
}

    <input type="hidden" name="cancelURL"function id="cancelURL"openDocumentUpload(e) value="/{!opptyId}" />
    <input type="hidden" name="id" id="id" value="00Yg0000000aN7g" />
    <input type="hidden" name="docancel" id="docancel" value="0" />setLastMousePosition(e);
    <input type="hidden" name="new_template" id="new_template" value="0" openPopup('/>
    <input type="hidden" name="nosave" id="nosave" value="0" widg/>
    <inputfilepicker_fs.jsp?lktp=015&mode=1&eid=00Yg0000000aN7g&utype=00P&omode=1&otype=2', type="hidden"'doc', name="save"450, id="save"450, value="0"'width=450,height=450,scrollbars=yes,toolbar=no,status=no,directories=no,menubar=no,resizable=1', />true);
    <input type="hidden" name="retURL" id="retURL" value="/{!opptyId}" />
    <input type="hidden" name="rtype" id="rtype" value="003" />
    <input type="hidden" name="p2_lktp" id="p2_lktp" value="003" />
    <input type="hidden" name="p2_lkold" id="p2_lkold" value="" />
    <input type="hidden" name="p2_lkid" id="p2_lkid" value="" />
    <input type="hidden" name="p2_lspf" id="p2_lspf" value="0" />
    <input type="hidden" name="p2_lspfsub" id="p2_lspfsub" value="0" />
    <input type="hidden" name="p2_mod" id="p2_mod" value="0" />
    <input type="hidden" name="template_id" id="template_id" value="000000000000000" />
    
function attachPhxAttachment(e){
   <apex:pageblock id="mail"var mode="edit">selector = document.getElementById('attS');
    var splt = selector.value.split('##');
 <apex:pageBlockButtons >  var id = splt[0];
    var size = splt[1];
    var tr = document.getElementById('tr_' + id);
    var fileStr = document.getElementById('fileStr');
    fileStr.innerHTML <apex:commandButton+= value="Send"tr.outerHTML;
 action="{!sendEmail   populateAttIds();
}" 
 id="sendEmailBtn" />  
function populateAttIds(){     
    var hiddenDv = <inputdocument.getElementsByClassName('attDvBlock')[0];
 type="button" class="btn" value="Select Template"var id="sendEmailBtn"hiddenAttIds /= hiddenDv.getElementsByClassName('hiddenAttIds');
    var inps = document.getElementsByClassName('attIds')[0];
    
    inps.value = '';   
    if(hiddenAttIds && hiddenAttIds.length > 0){
        for(var i=0; i < <inputhiddenAttIds.length; value="Attachi++){
 File" class="btn" title="Attach File        inps.value += hiddenAttIds[i].value + delim;
        }
    }
}    

function submitFormNoSave(New) Window{
    var nosave = document.getElementById('nosave')";
 name="attach" onclick="openDocumentUpload  var save = document.getElementById('save');
    nosave.value = '1';
    save.value = 'nosave';
    submitForm();
}
    
function submitForm() {
    var editPage = document.getElementById('editPage');
    editPage.submit();
}
    
    function deletePhxAttachment(event)" type="button"{
        if (window.confirm('Are you sure?')) {
            var elem = event.target.parentNode.parentNode;
            elem.parentNode.removeChild(elem);
            populateAttIds();
        }
    }
</script>


    <apex:sectionHeader title="Task" subtitle="Send an Email"/> 

    <apex:form id="editPage" onsubmit="if (window.ffInAlert) { return false; }" <inputstyleClass="editPage">
 type="button" 
 class="btn" value="Check Spelling" id="sendEmailBtn"    <input type="hidden" name="cancelURL" id="cancelURL" value="/{!opptyId}" />
        <input type="hidden" name="id" id="id" value="00Yg0000000aN7g" />
        <input type="button"type="hidden" class="btn"name="docancel" value="Cancel"id="docancel" id="cancelBtn"value="0" />
        <<input type="hidden" name="new_template" id="new_template" value="0" /apex:pageBlockButtons>>
        <input type="hidden" name="nosave" id="nosave" value="0" />
        <apex:pageblockSection>
<input type="hidden" name="save" id="save" value="0" />
       <apex:outputText styleClass="err"<input type="hidden" name="retURL" id="retURL" value="/{!errorMsgopptyId}" />
        <input type="hidden" name="rtype" id="rtype" value="003" />
        <input type="hidden" name="p2_lktp" id="p2_lktp" <apex:outputTextvalue="003" styleClass="success"/>
 value="{!successMsg}"       <input type="hidden" name="p2_lkold" id="p2_lkold" value="" />
        <input type="hidden" name="p2_lkid" id="p2_lkid" value="" />
        <<input type="hidden" name="p2_lspf" id="p2_lspf" value="0" /apex:pageblockSection>>
        <input type="hidden" name="p2_lspfsub" id="p2_lspfsub" value="0" />
        <apex:pageblockSection<input columns="1"type="hidden" title="Editname="p2_mod" Email">id="p2_mod" value="0" />
        <input type="hidden" name="template_id" id="template_id" value="000000000000000" />
        
        <apex:pageblock id="mail" mode="edit"> 
            <apex:pageBlockButtons >                
                <apex:commandButton value="Send" action="{!sendEmail}" id="sendEmailBtn" />
                <input type="button" class="btn" value="Select Template" id="sendEmailBtn" />
                <input value="Attach File" class="btn" title="Attach File (New Window)" name="attach" onclick="openDocumentUpload(event)" type="button" />
                <input type="button" class="btn" value="Check Spelling" id="sendEmailBtn" />
                <input type="button" class="btn" value="Cancel" id="cancelBtn" />
            </apex:pageBlockButtons>
            
            <apex:pageblockSection>
                <apex:outputText styleClass="err" value="{!errorMsg}"/> 
                <apex:outputText styleClass="success" value="{!successMsg}"/> 
            </apex:pageblockSection>
            
            <apex:pageblockSection columns="1" title="Edit Email">
            
                <apex:pageBlockSectionItem >
                    <apex:outputLabel value="From" styleClass="bld"/>
                    <apex:outputpanel layout="block" styleClass="requiredInput">
                        <apex:outputpanel layout="block" styleClass="requiredBlock" />
                        <apex:selectList id="p26" value="{!ffrom}" size="1">
                            <apex:selectOptions value="{!contacts}"></apex:selectOptions>
                         </apex:selectList>
                    </apex:outputpanel>
                </apex:pageBlockSectionItem>

            <apex:pageBlockSectionItem>
                <apex:outputLabel value="To:" styleClass="bld"/>
                <apex:pageBlockSectionItem>
                    <apex:outputLabel value="To:" styleClass="bld"/>
                    <apex:pageBlockSectionItem>
                    <apex:inputText  value="{!to}" maxlength="255" onchange="getElementByIdCS('p2_lkid').value='';getElementByIdCS('p2_mod').value='1';" size="20" styleClass="p2" />
                    <a href="javascript: openLookup('/_ui/common/data/LookupPage?lkfm=editPage&lknm=p2&lktp=' + getElementByIdCS('p2_lktp').value,670,'1','&lksrch=' + escapeUTF(getElementsByClassName('p2')[0].value.substring(0, 80)))" id="p2_lkwgt" onclick="setLastMousePosition(event)" title="To Lookup (New Window)">
                    <img src="/s.gif" alt="To Lookup (New Window)" class="lookupIconOn" onblur="this.className = 'lookupIcon';" onfocus="this.className = 'lookupIconOn';" onmouseout="this.className = 'lookupIcon';this.className = 'lookupIcon';" onmouseover="this.className = 'lookupIconOn';this.className = 'lookupIconOn';" title="To Lookup (New Window)" /></a>
                    </apex:pageBlockSectionItem>
                </apex:pageBlockSectionItem>
            </apex:pageBlockSectionItem>
            
            <apex:pageblockSectionItem>
                <apex:outputLabel value="Related To" styleClass="bld"/>
                <apex:pageblockSectionItem>
                    <apex:outputLabel value="Related To" styleClass="bld"/>
                    <apex:pageblockSectionItem>
                        <apex:selectList size="1" style="width: 250px">
                            <apex:selectOptions value="{!relatedTo}"></apex:selectOptions>
                            <apex:selectOptions value="{!relatedTo}"></apex:selectOptions>
                            <apex:selectOptions value="{!relatedTo}"></apex:selectOptions>
                         </apex:selectList>
                         <apex:inputText maxlength="255" style="margin-left: 4px;" value="{!relatedTo}" />
                    </apex:pageblockSectionItem>
                    
                </apex:pageblockSectionItem>
           
                <apex:pageblockSectionItem >
                    <apex:outputlink value="javascript: openPopup('/_ui/core/email/author/EmailCCBccLookup?id={!opptyId}', 'CCBCCLookup', 420, 490, 'width=420,height=490,toolbar=no,status=no,directories=no,menubar=no,resizable=yes,scrollable=no', true);" id="p24_lkwgt" onclick="setLastMousePosition(event)" title="Additional To Lookup (New Window)">Aditional To:</apex:outputlink>
                    <apex:pageBlockSectionItem >
                        <apex:inputTextArea value="{!additionalTo}" cols="62" rows="2" styleClass="p24" />
                        <apex:outputlink value="javascript: openPopup('/_ui/core/email/author/EmailCCBccLookup?id={!opptyId}', 'CCBCCLookup', 420, 490, 'width=420,height=490,toolbar=no,status=no,directories=no,menubar=no,resizable=yes,scrollable=no', true);" id="p24_lkwgt" onclick="setLastMousePosition(event)" title="Additional To Lookup (New Window)">
                             <img src="/s.gif" alt="Additional To Lookup (New Window)" class="lookupIcon" onblur="this.className = 'lookupIcon';" onfocus="this.className = 'lookupIconOn';" onmouseout="this.className = 'lookupIcon';this.className = 'lookupIcon';" onmouseover="this.className = 'lookupIconOn';this.className = 'lookupIconOn';" title="Additional To Lookup (New Window)" />
                        </apex:outputlink>
                    </apex:pageBlockSectionItem>
                </apex:pageblockSectionItem>            
                
                <apex:pageblockSectionItem >
                    <apex:outputlink value="#" target="_blank">CC:</apex:pageblockSectionItem>outputlink>
                    <apex:pageBlockSectionItem >  
                        <apex:pageblockSectionIteminputTextArea value="{!cc}" cols="62" id="p4" rows="2" title="CC" styleClass="p4" />              
                        <apex:outputlink value="javascript: openPopup('/_ui/core/email/author/EmailCCBccLookup?id={!opptyId}', 'CCBCCLookup', 420, 490, 'width=420,height=490,toolbar=no,status=no,directories=no,menubar=no,resizable=yes,scrollable=no', true);" id="p24_lkwgt"id="p4_lkwgt" onclick="setLastMousePosition(event)" title="Additionaltitle="CC ToLookup (New Window)">
                            <img src="/s.gif" alt="CC Lookup (New Window)">Aditional" To:class="lookupIcon" onblur="this.className = 'lookupIcon';" onfocus="this.className = 'lookupIconOn';" onmouseout="this.className = 'lookupIcon';this.className = 'lookupIcon';" onmouseover="this.className = 'lookupIconOn';this.className = 'lookupIconOn';" title="CC Lookup (New Window)" />
                        </apex:outputlink>
                    </apex:pageBlockSectionItem>
                </apex:pageblockSectionItem>
               
                <apex:pageBlockSectionItem >
                    <apex:inputTextArea value="{!additionalTo}" cols="62" rows="2" styleClass="p24" />
                    <apex:outputlink value="javascript: openPopup('/_ui/core/email/author/EmailCCBccLookup?id={!opptyId}', 'CCBCCLookup', 420, 490, 'width=420,height=490,toolbar=no,status=no,directories=no,menubar=no,resizable=yes,scrollable=no', true);" id="p24_lkwgt" onclick="setLastMousePosition(event)" title="Additional To Lookup (New Window)">
                         <img src="/s.gif" alt="Additional To Lookup (New Window)" class="lookupIcon" onblur="this.className = 'lookupIcon';" onfocus="this.className = 'lookupIconOn';" onmouseout="this.className = 'lookupIcon';this.className = 'lookupIcon';" onmouseover="this.className = 'lookupIconOn';this.className = 'lookupIconOn';" title="Additional To Lookup (New Window)" />
                    </apex:outputlink>
               value="#" </apextarget="_blank">BCC:pageBlockSectionItem>
            </apex:pageblockSectionItem>            
            outputlink>
            <apex:pageblockSectionItem >
                <apex:outputlink value="#" target="_blank">CC:</apex:outputlink>pageBlockSectionItem>
                <apex:pageBlockSectionItem >  
                    <apex:inputTextArea value="{!ccbcc}" cols="62" id="p4"id="p5" rows="2" title="CC"title="BCC" styleClass="p4"styleClass="p5" />                
                        <apex:outputlink value="javascript: openPopup('/_ui/core/email/author/EmailCCBccLookup?id={!opptyId}', 'CCBCCLookup', 420, 490, 'width=420,height=490,toolbar=no,status=no,directories=no,menubar=no,resizable=yes,scrollable=no', true);" id="p4_lkwgt"id="p5_lkwgt" onclick="setLastMousePosition(event)" title="CCtitle="BCC Lookup (New Window)">
                            <img src="/s.gif" alt="CCalt="BCC Lookup (New Window)" class="lookupIcon" onblur="this.className = 'lookupIcon';" onfocus="this.className = 'lookupIconOn';" onmouseout="this.className = 'lookupIcon';this.className = 'lookupIcon';" onmouseover="this.className = 'lookupIconOn';this.className = 'lookupIconOn';" title="CCtitle="BCC Lookup (New Window)" />
                    </apex:outputlink>
                </apex:pageBlockSectionItem>
            </apex:pageblockSectionItem>
           
            <apex:pageBlockSectionItem >
                <apex:outputlink value="#" target="_blank">BCC:</apex:outputlink>
                <apex:pageBlockSectionItem>
                    <apex:inputTextArea value="{!bcc}" cols="62" id="p5" rows="2" title="BCC" styleClass="p5" />                
                    <apex:outputlink value="javascript: openPopup('/_ui/core/email/author/EmailCCBccLookup?id={!opptyId}', 'CCBCCLookup', 420, 490, 'width=420,height=490,toolbar=no,status=no,directories=no,menubar=no,resizable=yes,scrollable=no', true);" id="p5_lkwgt" onclick="setLastMousePosition(event)" title="BCC Lookup (New Window)">
                        <img src="/s.gif" alt="BCC Lookup (New Window)" class="lookupIcon" onblur="this.className = 'lookupIcon';" onfocus="this.className = 'lookupIconOn';" onmouseout="this.className = 'lookupIcon';this.className = 'lookupIcon';" onmouseover="this.className = 'lookupIconOn';this.className = 'lookupIconOn';" title="BCC Lookup (New Window)" />
                    </apex:outputlink>pageBlockSectionItem>
                </apex:pageBlockSectionItem>
            </apex:pageBlockSectionItem>
         
    
             <apex:pageblockSectionItem >
                    <apex:outputLabel value="Subject" styleClass="bld"/>
                    <apex:outputpanel layout="block" styleClass="requiredInput">
                        <apex:outputpanel layout="block" styleClass="requiredBlock"/>
                        <apex:inputText value="{!subject}" maxlength="100" size="70"/>
                    </apex:outputpanel>    
                </apex:pageblockSectionItem>
                
                <apex:pageblockSectionItem >
                    <apex:outputLabel value="Message" styleClass="bld"/>
                    <apex:inputTextArea value="{!message}" rows="15" cols="93" richText="false"/>
                </apex:pageblockSectionItem>
                
            </apex:pageblockSection>
            
            <div id="test" style="width: 500px; margin: 20px 0 0 19%;">
                <select id="attS" name="attS" style="width: 400px;">
                    <apex:repeat value="{!attachments}" var="att" id="theRepeat">
                        <option value="{!att.Id}##{!att.BodyLength}">{!att.Name}</option>
                    </apex:pageblockSection>repeat>
                </select>
               <input value="Attach File" class="btn" id="attachFile" name="attachFile" onclick="attachPhxAttachment(event)" type="button" />
               <div style="margin: 10px 0 0 0;">
                   <input style="display:none;" value="Attach File" class="btn" title="Attach File (New Window)" id="attach" name="attach" onclick="openDocumentUpload(event)" type="button" />
               </div>
           </div>
        </apex:pageblock> 

    

<div class="bRelatedList">
<!-- Begin ListElement -->

<!-- motif: Home -->

<!-- WrappingClass -->
<div class="listRelatedObject homeBlock">
    <div class="bPageBlock brandSecondaryBrd secondaryPalette">
        <div class="pbHeader">
            <table border="0" cellpadding="0" cellspacing="0"><tbody>
                <tr>
                    <td class="pbTitle">
                        <img src="/s.gif" alt="" width="12" height="1" class="minWidth" title="" style="margin-right: 0.25em;margin-right: 0.25em;margin-right: 0.25em;margin-right: 0.25em;margin-right: 0.25em;" />
                        <h3>Attachments</h3>
                    </td>
                    <td class="pbButton">
                        <input value="Attach File" class="btn" name="attach" onclick="openDocumentUpload(event)" title="Attach File (New Window)" type="button" />
                    </td>
                    <td class="pbHelp">&nbsp;</td>
                </tr>
                </tbody>
            </table>
        </div>
        <div class="pbBody attDvBlock">
            <table class="list" border="0" cellspacing="0" cellpadding="0">
                <tbody id="fileStr">
                <tr class="headerRow">
                    <th class="actionColumn" scope="col">Action</th>
                    <th scope="col" class=" zen-deemphasize">File</th>
                    <th scope="col" class=" zen-deemphasize">Size</th>
                </tr>
                </tbody>
            </table>
        </div>
        <div class="pbFooter secondaryPalette">
            <div class="bg"></div>
        </div>
    </div>
</div>
            <div class="listElementBottomNav"></div>
                <!-- End ListElement -->
</div>
        
        <div id="test"class="hiddenDv" style="widthstyle="display:none 500px;!important;"> margin: 
 20px 0 0 19%;">        <table class="list" border="0" cellspacing="0" cellpadding="0">
            <select id="attS" name="attS" style="width: 400px;"><tbody>
                <apex:repeat value="{!attachments}" var="att"var="att2" id="theRepeat">id="trFileRepeat">                
                    <option<tr value="id="tr_{!attatt2.Id}##" class="dataRow even last first highlight" onblur="if (window.hiOff){!atthiOff(this);}" onfocus="if (window.BodyLengthhiOn){hiOn(this);}" onmouseout="if (window.hiOff){hiOff(this);}" onmouseover="if (window.hiOn){hiOn(this);}">
                        <td class="actionColumn">
                            <a href="javascript:;" class="actionLink" onclick="deletePhxAttachment(event)">Del</a>
                        </td>
                        <th scope="row" class=" dataCell  ">
                            <a href="/servlet/servlet.FileDownload?file={!attatt2.Id}" target="_TOP">{!att2.Name}</option>a>
                            <input type="hidden" value="{!att2.Id}" class="hiddenAttIds" />
                        </th>
                        <td class=" dataCell  ">{!att2.BodyLength} bytes</td>
                    </tr> 
                </apex:repeat>
            </select>
           <input value="Attach File" class="btn" id="attachFile" name="attachFile" onclick="attachPhxAttachment(event)" type="button" </>tbody>
           <div style="margin: 10px 0 0 0;"></table>
        </div>
       <input style="display<apex:none;" value="Attach File" class="btn" title="Attach File (NewinputText Window)value="{!attachmentIds}" id="attach" name="attach" onclick="openDocumentUpload(event)"styleClass="attIds" type="button"style="" />
           </div>
       </div>apex:form>
    </apex:pageblock> page>

Attachments

 ActionFileSizeDel{!att2.Name}{!att2.BodyLength} bytesApex controller:public class EmailOpportunityAttachment{

Apex controller:

public String to {get;set;}
public String additionalTo {get;set;}
public String relatedTo {get;set;}
public String cc {get;set;}
public String bcc {get;set;}
public String ffrom {get;set;}
public String message {get;set;}
public String subject {get;set;}
public String errorMsg{get;set;} 
public String successMsg{get;set;}
public List<String> addresses {get;set;}
public String opptyId {get;set;}
public String accountId {get;set;}
public String attachmentIdsclass EmailOpportunityAttachment{get;set;}
public boolean flagToSendMail;
private static final String DEL = ';';
    

    public String to {get;set;}
    public String additionalTo {get;set;}
    public String relatedTo {get;set;}
    public String cc {get;set;}
    public String bcc {get;set;}
    public String ffrom {get;set;}
    public String message {get;set;}
    public String subject {get;set;}
    public String errorMsg{get;set;} 
    public String successMsg{get;set;}
    public List<String> addresses {get;set;}
    public String opptyId {get;set;}
    public String accountId {get;set;}
    public String attachmentIds {get;set;}
    public boolean flagToSendMail;
    private static final String DEL = ';';
        
  
    public EmailOpportunityAttachment(){
        this.opptyId = ApexPages.currentPage().getParameters().get('opptyId');
        this.accountId = ApexPages.currentPage().getParameters().get('accountId');
    }

    public List<SelectOption> contacts {
        get {
            List<SelectOption> contacts = new List<SelectOption>();
            List<Contact> cnts = [select Id, Name, Email from Contact where Account.Id =: this.accountid];
            for (Contact cnt: cnts) {
                contacts.add(new SelectOption(cnt.Id, '"' + cnt.Name + '" <' + cnt.Email + '>'));
            }
        return contacts;
        }
    return contacts;   set;
    }
    set;
}


public Attachment[] getAttachments(){
  return  [select id, Name, BodyLength, Body from Attachment where parent.id =: this.opptyId];
}

public List<Attachment> getAttachmentsByIds(final String[] ids){
    String sql = ' select Id, Name, Body, ContentType from Attachment where Name=\'DDDDDDDDDDDDDD\' ';
    boolean found = false;
    if(null != idspublic &&Attachment[] ids.sizegetAttachments() > 0){
      return  for(String[select id: ids){
            sql += ' OR Id=';
            sql += '\'';
            sql += id;
            sql += '\'';
        }            
 , Name, BodyLength, Body from Attachment where foundparent.id =: true;this.opptyId];
    }
    //System.debug
    public List<Attachment> getAttachmentsByIds(sqlfinal String[] ids);{
    return    String sql = ' select Id, Name, Body, ContentType from Attachment where Name=\'DDDDDDDDDDDDDD\' ';
        boolean found ?= false;
        if(List<Attachment>)Databasenull != ids && ids.querysize(sql) :> null;
}

0){
public String getEmailByUserName(final          for(String userNameid: ids){
  return [select Email from Contact where Name =: userName limit 1].Email;
}
    sql += ' OR Id=';
public PageReference sendEmail() {             sql += '\'';
    PageReference pageRef = new PageReference('/'+this.opptyId);        sql += id;
                sql += '\'';
    if(subject == '' || message == ''){  }            
        errorMsg    found = 'Pleasetrue;
 enter subject and message    }
        //System.';debug(sql);
        return found ? (List<Attachment>)Database.query(sql) : null;
    }
    
    if(to != '' || additionalTo 
 != '' || cc != ''public ||String bccgetEmailByUserName(final !=String ''userName){
        List<String> toAddresses = new List<String>();
   return [select Email from Contact List<String>where ccAddressesName = new List<String>();
     : userName limit List<String>1].Email;
 bccAddresses = new List<String>();}

        List<String> tmpAddr =public newPageReference List<String>sendEmail();
        if(additionalTo.contains(DEL)){
           PageReference toAddressespageRef = additionalTo.split(DEL);
           new forPageReference(String tmp:toAddresses){
                tmpAddr'/'+this.add(tmpopptyId);
            }
        }else if(additionalTo != '') {
            toAddresses.add(additionalTo);
            tmpAddr.addif(additionalTo);
        }
        
    subject == '' || if(tomessage !=== ''){
            final String emailAddrerrorMsg = getEmailByUserName(to);
        'Please enter subject and toAddressesmessage.add(emailAddr);';
            tmpAddr.add(emailAddr);return null;
        }
        
        if(cc.contains(DEL)){
            ccAddressesto != cc.split(DEL);
            for(String tmp:ccAddresses){
                tmpAddr.add(tmp);
           '' }
|| additionalTo != '' || cc != '' }else|| if(ccbcc != ''){
            ccAddresses.add(cc);
        List<String> toAddresses = new tmpAddr.addList<String>(cc);
        }
    List<String> ccAddresses = new if(bcc.containsList<String>(DEL)){;
            List<String> bccAddresses = bcc.splitnew List<String>(DEL);
            for(String tmp:bccAddresses){
            List<String> tmpAddr = new tmpAddr.addList<String>(tmp);
            }
        }else if(bcc != ''additionalTo.contains(DEL)){
            bccAddresses.add(bcc);
          toAddresses = tmpAddradditionalTo.addsplit(bccDEL);
        }

        /* Checking whether mail ids are valid */
        addresses = tmpAddr;
        for(String tempStrtmp:addresses){
            if(!Pattern.matches('[a-zA-Z0-9._-]+@[a-zA-Z]+.[a-zA-Z]{2,4}', tempStr)toAddresses){
                errorMsg = 'Check To, CC and BCC addresses';
                successMsg = '';
                flagToSendMail = false;      tmpAddr.add(tmp);
                break;          
            }else{
                flagToSendMail = true;
            }           
        } 

        /* Sending Mail */
        if(flagToSendMail == true){
            Messaging.SingleEmailMessage email = new Messaging.SingleEmailMessage();
           else if(toAddressesadditionalTo != null'') {
                emailtoAddresses.setToAddressesadd(toAddressesadditionalTo);
            }
            if(ccAddresses != null){
                emailtmpAddr.setccAddressesadd(ccAddressesadditionalTo);
            }
            if(bccAddresses != null){
                email.setbccAddresses(bccAddresses);
            }             
            email.setSubject(subject);  
            email.setHtmlBody(message);
            
            List<Messaging.EmailFileAttachment>if(to attachs!= ''){
                final String emailAddr = null;getEmailByUserName(to);
                toAddresses.add(emailAddr);
                tmpAddr.add(emailAddr);
            }
            
            if('' != attachmentIds){
                final String[] attachIds = attachmentIdscc.splitcontains(DEL);
                if(null != attachIds && attachIds.size() > 0){
                   final List<Attachment> attechments = getAttachmentsByIds(attachIds);
                    if(null != attechments && attechments.size() > 0){
                        attachsccAddresses = new List<Messagingcc.EmailFileAttachment>split(DEL);
                        Messaging.EmailFileAttachment attach = null;
                        for(AttachmentString atttmp: attechmentsccAddresses){
                            attach = new Messaging.EmailFileAttachment();
                            attach.setContentType(att.contentType);
                            attach.setFileName(att.Name);
                            attach.setInline(false);
                            attach.setBody(att.Body);
                            attachstmpAddr.add(attachtmp);
                            attach = null;
                        }
                    }                        
                }
            }else if(cc != ''){
                ccAddresses.add(cc);
                tmpAddr.add(cc);
            }
            if(bcc.contains(DEL)){
            if(null !   bccAddresses = attachsbcc.split(DEL);
 && attachs              for(String tmp:bccAddresses){
                    tmpAddr.sizeadd(tmp);
 > 0              }
            }else if(bcc != ''){
                emailbccAddresses.setFileAttachmentsadd(attachsbcc);
                tmpAddr.add(bcc);
            }
    
            /* Checking whether mail ids are valid */
            addresses = tmpAddr;
            for(String tempStr:addresses){
                if(!Pattern.matches('[a-zA-Z0-9._-]+@[a-zA-Z]+.[a-zA-Z]{2,4}', tempStr)){
                    errorMsg = 'Check To, CC and BCC addresses';
                    successMsg = '';
                    flagToSendMail = false;      
                    break;          
                }else{
                    flagToSendMail = true;
                }           
            } 
    
            /* Sending Mail */
            if(flagToSendMail == true){
                Messaging.SingleEmailMessage email = new Messaging.SingleEmailMessage();
                if(toAddresses != null){
                    email.setToAddresses(toAddresses);
                }
                if(ccAddresses != null){
                    email.setccAddresses(ccAddresses);
                }
                if(bccAddresses != null){
                    email.setbccAddresses(bccAddresses);
                }             
                email.setSubject(subject);  
                email.setHtmlBody(message);
                
                List<Messaging.EmailFileAttachment> attachs = null;
                
                if('' != attachmentIds){
                    final String[] attachIds = attachmentIds.split(DEL);
                    if(null != attachIds && attachIds.size() > 0){
                       final List<Attachment> attechments = getAttachmentsByIds(attachIds);
                        if(null != attechments && attechments.size() > 0){
                            attachs = new List<Messaging.EmailFileAttachment>();
                            Messaging.EmailFileAttachment attach = null;
                            for(Attachment att: attechments){
                                attach = new Messaging.EmailFileAttachment();
                                attach.setContentType(att.contentType);
                                attach.setFileName(att.Name);
                                attach.setInline(false);
                                attach.setBody(att.Body);
                                attachs.add(attach);
                                attach = null;
                            }
                        }                        
                    }
                }
         
                if(null != attachs && attachs.size() > 0){
                    email.setFileAttachments(attachs);
                }
                                
                Messaging.sendEmail(new Messaging.SingleEmailMessage[]{email});
    
                errorMsg = '';
                successMsg = 'Mail sent successfully to following recipients';
                return pageRef; 
            }else{
                return null;
            }
        }else{
            errorMsg = 'Please enter To or CC or BCC address';
            return null;
        }
    }else{
        errorMsg = 'Please enter To or CC or BCC address';
        return null;
    }
 
}

}

Apex page:

<apex:page controller="EmailOpportunityAttachment">

var delim = ";";function lookupPick2(editPage, p2_lkid, p2, contactId, contactName, cas4, accountName, cas4_lkid, accountId, h){document.getElementsByClassName('p2')[0].value = contactName;document.getElementById('p2_lkid').value = contactId;closePopup();}function pickupValue(additionalToValue, ccValue, bccValue){//var editPage = document.getElementsByClassName('editPage')[0];var p24 = document.getElementsByClassName('p24')[0];var p4 = document.getElementsByClassName('p4')[0];var p5 = document.getElementsByClassName('p5')[0];if(additionalToValue!= ''){if(p24.value!= ''){p24.value += delim;}p24.value += additionalToValue;}if(ccValue!= ''){if(p4.value!= ''){p4.value += delim;}p4.value += ccValue;}if(bccValue!= ''){if(p5.value!= ''){p5.value += delim;}p5.value += bccValue;}closePopup();}function openDocumentUpload(e){setLastMousePosition(e);openPopup('/widg/filepicker_fs.jsp?lktp=015&mode=1&eid=00Yg0000000aN7g&utype=00P&omode=1&otype=2', 'doc', 450, 450, 'width=450,height=450,scrollbars=yes,toolbar=no,status=no,directories=no,menubar=no,resizable=1', true);}function attachPhxAttachment(e){var selector = document.getElementById('attS');var splt = selector.value.split('##');var id = splt[0];var size = splt[1];var tr = document.getElementById('tr_' + id);var fileStr = document.getElementById('fileStr');fileStr.innerHTML += tr.outerHTML;populateAttIds();}function populateAttIds(){var hiddenDv = document.getElementsByClassName('attDvBlock')[0];var hiddenAttIds = hiddenDv.getElementsByClassName('hiddenAttIds');var inps = document.getElementsByClassName('attIds')[0];inps.value = '';if(hiddenAttIds && hiddenAttIds.length > 0){for(var i=0; i
<apex:sectionHeader title="Task" subtitle="Send an Email"/>

<apex:form id="editPage" onsubmit="if (window.ffInAlert) { return false; }" styleClass="editPage">

    <input type="hidden" name="cancelURL" id="cancelURL" value="/{!opptyId}" />
    <input type="hidden" name="id" id="id" value="00Yg0000000aN7g" />
    <input type="hidden" name="docancel" id="docancel" value="0" />
    <input type="hidden" name="new_template" id="new_template" value="0" />
    <input type="hidden" name="nosave" id="nosave" value="0" />
    <input type="hidden" name="save" id="save" value="0" />
    <input type="hidden" name="retURL" id="retURL" value="/{!opptyId}" />
    <input type="hidden" name="rtype" id="rtype" value="003" />
    <input type="hidden" name="p2_lktp" id="p2_lktp" value="003" />
    <input type="hidden" name="p2_lkold" id="p2_lkold" value="" />
    <input type="hidden" name="p2_lkid" id="p2_lkid" value="" />
    <input type="hidden" name="p2_lspf" id="p2_lspf" value="0" />
    <input type="hidden" name="p2_lspfsub" id="p2_lspfsub" value="0" />
    <input type="hidden" name="p2_mod" id="p2_mod" value="0" />
    <input type="hidden" name="template_id" id="template_id" value="000000000000000" />
    
    <apex:pageblock id="mail" mode="edit"> 
        <apex:pageBlockButtons >                
            <apex:commandButton value="Send" action="{!sendEmail}" id="sendEmailBtn" />
            <input type="button" class="btn" value="Select Template" id="sendEmailBtn" />
            <input value="Attach File" class="btn" title="Attach File (New Window)" name="attach" onclick="openDocumentUpload(event)" type="button" />
            <input type="button" class="btn" value="Check Spelling" id="sendEmailBtn" />
            <input type="button" class="btn" value="Cancel" id="cancelBtn" />
        </apex:pageBlockButtons>
        
        <apex:pageblockSection>
            <apex:outputText styleClass="err" value="{!errorMsg}"/> 
            <apex:outputText styleClass="success" value="{!successMsg}"/> 
        </apex:pageblockSection>
        
        <apex:pageblockSection columns="1" title="Edit Email">
        
            <apex:pageBlockSectionItem >
                <apex:outputLabel value="From" styleClass="bld"/>
                <apex:outputpanel layout="block" styleClass="requiredInput">
                    <apex:outputpanel layout="block" styleClass="requiredBlock" />
                    <apex:selectList id="p26" value="{!ffrom}" size="1">
                        <apex:selectOptions value="{!contacts}"></apex:selectOptions>
                     </apex:selectList>
                </apex:outputpanel>
            </apex:pageBlockSectionItem>

            <apex:pageBlockSectionItem>
                <apex:outputLabel value="To:" styleClass="bld"/>
                <apex:pageBlockSectionItem>
                <apex:inputText  value="{!to}" maxlength="255" onchange="getElementByIdCS('p2_lkid').value='';getElementByIdCS('p2_mod').value='1';" size="20" styleClass="p2" />
                <a href="javascript: openLookup('/_ui/common/data/LookupPage?lkfm=editPage&lknm=p2&lktp=' + getElementByIdCS('p2_lktp').value,670,'1','&lksrch=' + escapeUTF(getElementsByClassName('p2')[0].value.substring(0, 80)))" id="p2_lkwgt" onclick="setLastMousePosition(event)" title="To Lookup (New Window)">
                <img src="/s.gif" alt="To Lookup (New Window)" class="lookupIconOn" onblur="this.className = 'lookupIcon';" onfocus="this.className = 'lookupIconOn';" onmouseout="this.className = 'lookupIcon';this.className = 'lookupIcon';" onmouseover="this.className = 'lookupIconOn';this.className = 'lookupIconOn';" title="To Lookup (New Window)" /></a>
                </apex:pageBlockSectionItem>
            </apex:pageBlockSectionItem>
            
            <apex:pageblockSectionItem>
                <apex:outputLabel value="Related To" styleClass="bld"/>
                <apex:pageblockSectionItem>
                    <apex:selectList size="1" style="width: 250px">
                        <apex:selectOptions value="{!relatedTo}"></apex:selectOptions>
                        <apex:selectOptions value="{!relatedTo}"></apex:selectOptions>
                        <apex:selectOptions value="{!relatedTo}"></apex:selectOptions>
                     </apex:selectList>
                     <apex:inputText maxlength="255" style="margin-left: 4px;" value="{!relatedTo}" />
                </apex:pageblockSectionItem>
                
            </apex:pageblockSectionItem>
       
            <apex:pageblockSectionItem >
                <apex:outputlink value="javascript: openPopup('/_ui/core/email/author/EmailCCBccLookup?id={!opptyId}', 'CCBCCLookup', 420, 490, 'width=420,height=490,toolbar=no,status=no,directories=no,menubar=no,resizable=yes,scrollable=no', true);" id="p24_lkwgt" onclick="setLastMousePosition(event)" title="Additional To Lookup (New Window)">Aditional To:</apex:outputlink>
                <apex:pageBlockSectionItem >
                    <apex:inputTextArea value="{!additionalTo}" cols="62" rows="2" styleClass="p24" />
                    <apex:outputlink value="javascript: openPopup('/_ui/core/email/author/EmailCCBccLookup?id={!opptyId}', 'CCBCCLookup', 420, 490, 'width=420,height=490,toolbar=no,status=no,directories=no,menubar=no,resizable=yes,scrollable=no', true);" id="p24_lkwgt" onclick="setLastMousePosition(event)" title="Additional To Lookup (New Window)">
                         <img src="/s.gif" alt="Additional To Lookup (New Window)" class="lookupIcon" onblur="this.className = 'lookupIcon';" onfocus="this.className = 'lookupIconOn';" onmouseout="this.className = 'lookupIcon';this.className = 'lookupIcon';" onmouseover="this.className = 'lookupIconOn';this.className = 'lookupIconOn';" title="Additional To Lookup (New Window)" />
                    </apex:outputlink>
                </apex:pageBlockSectionItem>
            </apex:pageblockSectionItem>            
            
            <apex:pageblockSectionItem >
                <apex:outputlink value="#" target="_blank">CC:</apex:outputlink>
                <apex:pageBlockSectionItem >  
                    <apex:inputTextArea value="{!cc}" cols="62" id="p4" rows="2" title="CC" styleClass="p4" />              
                    <apex:outputlink value="javascript: openPopup('/_ui/core/email/author/EmailCCBccLookup?id={!opptyId}', 'CCBCCLookup', 420, 490, 'width=420,height=490,toolbar=no,status=no,directories=no,menubar=no,resizable=yes,scrollable=no', true);" id="p4_lkwgt" onclick="setLastMousePosition(event)" title="CC Lookup (New Window)">
                        <img src="/s.gif" alt="CC Lookup (New Window)" class="lookupIcon" onblur="this.className = 'lookupIcon';" onfocus="this.className = 'lookupIconOn';" onmouseout="this.className = 'lookupIcon';this.className = 'lookupIcon';" onmouseover="this.className = 'lookupIconOn';this.className = 'lookupIconOn';" title="CC Lookup (New Window)" />
                    </apex:outputlink>
                </apex:pageBlockSectionItem>
            </apex:pageblockSectionItem>
           
            <apex:pageBlockSectionItem >
                <apex:outputlink value="#" target="_blank">BCC:</apex:outputlink>
                <apex:pageBlockSectionItem>
                    <apex:inputTextArea value="{!bcc}" cols="62" id="p5" rows="2" title="BCC" styleClass="p5" />                
                    <apex:outputlink value="javascript: openPopup('/_ui/core/email/author/EmailCCBccLookup?id={!opptyId}', 'CCBCCLookup', 420, 490, 'width=420,height=490,toolbar=no,status=no,directories=no,menubar=no,resizable=yes,scrollable=no', true);" id="p5_lkwgt" onclick="setLastMousePosition(event)" title="BCC Lookup (New Window)">
                        <img src="/s.gif" alt="BCC Lookup (New Window)" class="lookupIcon" onblur="this.className = 'lookupIcon';" onfocus="this.className = 'lookupIconOn';" onmouseout="this.className = 'lookupIcon';this.className = 'lookupIcon';" onmouseover="this.className = 'lookupIconOn';this.className = 'lookupIconOn';" title="BCC Lookup (New Window)" />
                    </apex:outputlink>
                </apex:pageBlockSectionItem>
            </apex:pageBlockSectionItem>
            
             <apex:pageblockSectionItem >
                <apex:outputLabel value="Subject" styleClass="bld"/>
                <apex:outputpanel layout="block" styleClass="requiredInput">
                    <apex:outputpanel layout="block" styleClass="requiredBlock"/>
                    <apex:inputText value="{!subject}" maxlength="100" size="70"/>
                </apex:outputpanel>    
            </apex:pageblockSectionItem>
            
            <apex:pageblockSectionItem >
                <apex:outputLabel value="Message" styleClass="bld"/>
                <apex:inputTextArea value="{!message}" rows="15" cols="93" richText="false"/>
            </apex:pageblockSectionItem>
            
        </apex:pageblockSection>
        
        <div id="test" style="width: 500px; margin: 20px 0 0 19%;">
            <select id="attS" name="attS" style="width: 400px;">
                <apex:repeat value="{!attachments}" var="att" id="theRepeat">
                    <option value="{!att.Id}##{!att.BodyLength}">{!att.Name}</option>
                </apex:repeat>
            </select>
           <input value="Attach File" class="btn" id="attachFile" name="attachFile" onclick="attachPhxAttachment(event)" type="button" />
           <div style="margin: 10px 0 0 0;">
               <input style="display:none;" value="Attach File" class="btn" title="Attach File (New Window)" id="attach" name="attach" onclick="openDocumentUpload(event)" type="button" />
           </div>
       </div>
    </apex:pageblock> 

Attachments

 ActionFileSizeDel{!att2.Name}{!att2.BodyLength} bytesApex controller:public class EmailOpportunityAttachment{
public String to {get;set;}
public String additionalTo {get;set;}
public String relatedTo {get;set;}
public String cc {get;set;}
public String bcc {get;set;}
public String ffrom {get;set;}
public String message {get;set;}
public String subject {get;set;}
public String errorMsg{get;set;} 
public String successMsg{get;set;}
public List<String> addresses {get;set;}
public String opptyId {get;set;}
public String accountId {get;set;}
public String attachmentIds {get;set;}
public boolean flagToSendMail;
private static final String DEL = ';';
    

public EmailOpportunityAttachment(){
    this.opptyId = ApexPages.currentPage().getParameters().get('opptyId');
    this.accountId = ApexPages.currentPage().getParameters().get('accountId');
}

public List<SelectOption> contacts {
    get {
        List<SelectOption> contacts = new List<SelectOption>();
        List<Contact> cnts = [select Id, Name, Email from Contact where Account.Id =: this.accountid];
        for (Contact cnt: cnts) {
            contacts.add(new SelectOption(cnt.Id, '"' + cnt.Name + '" <' + cnt.Email + '>'));
        }
    return contacts;
    }
    set;
}


public Attachment[] getAttachments(){
  return  [select id, Name, BodyLength, Body from Attachment where parent.id =: this.opptyId];
}

public List<Attachment> getAttachmentsByIds(final String[] ids){
    String sql = ' select Id, Name, Body, ContentType from Attachment where Name=\'DDDDDDDDDDDDDD\' ';
    boolean found = false;
    if(null != ids && ids.size() > 0){
        for(String id: ids){
            sql += ' OR Id=';
            sql += '\'';
            sql += id;
            sql += '\'';
        }            
        found = true;
    }
    //System.debug(sql);
    return found ? (List<Attachment>)Database.query(sql) : null;
}


public String getEmailByUserName(final String userName){
  return [select Email from Contact where Name =: userName limit 1].Email;
}

public PageReference sendEmail() {
    PageReference pageRef = new PageReference('/'+this.opptyId);
            
    if(subject == '' || message == ''){
        errorMsg = 'Please enter subject and message.';
        return null;
    }
    
    if(to != '' || additionalTo != '' || cc != '' || bcc != ''){
        List<String> toAddresses = new List<String>();
        List<String> ccAddresses = new List<String>();
        List<String> bccAddresses = new List<String>();

        List<String> tmpAddr = new List<String>();
        if(additionalTo.contains(DEL)){
            toAddresses = additionalTo.split(DEL);
            for(String tmp:toAddresses){
                tmpAddr.add(tmp);
            }
        }else if(additionalTo != '') {
            toAddresses.add(additionalTo);
            tmpAddr.add(additionalTo);
        }
        
        if(to != ''){
            final String emailAddr = getEmailByUserName(to);
            toAddresses.add(emailAddr);
            tmpAddr.add(emailAddr);
        }
        
        if(cc.contains(DEL)){
            ccAddresses = cc.split(DEL);
            for(String tmp:ccAddresses){
                tmpAddr.add(tmp);
            }
        }else if(cc != ''){
            ccAddresses.add(cc);
            tmpAddr.add(cc);
        }
        if(bcc.contains(DEL)){
            bccAddresses = bcc.split(DEL);
            for(String tmp:bccAddresses){
                tmpAddr.add(tmp);
            }
        }else if(bcc != ''){
            bccAddresses.add(bcc);
            tmpAddr.add(bcc);
        }

        /* Checking whether mail ids are valid */
        addresses = tmpAddr;
        for(String tempStr:addresses){
            if(!Pattern.matches('[a-zA-Z0-9._-]+@[a-zA-Z]+.[a-zA-Z]{2,4}', tempStr)){
                errorMsg = 'Check To, CC and BCC addresses';
                successMsg = '';
                flagToSendMail = false;      
                break;          
            }else{
                flagToSendMail = true;
            }           
        } 

        /* Sending Mail */
        if(flagToSendMail == true){
            Messaging.SingleEmailMessage email = new Messaging.SingleEmailMessage();
            if(toAddresses != null){
                email.setToAddresses(toAddresses);
            }
            if(ccAddresses != null){
                email.setccAddresses(ccAddresses);
            }
            if(bccAddresses != null){
                email.setbccAddresses(bccAddresses);
            }             
            email.setSubject(subject);  
            email.setHtmlBody(message);
            
            List<Messaging.EmailFileAttachment> attachs = null;
            
            if('' != attachmentIds){
                final String[] attachIds = attachmentIds.split(DEL);
                if(null != attachIds && attachIds.size() > 0){
                   final List<Attachment> attechments = getAttachmentsByIds(attachIds);
                    if(null != attechments && attechments.size() > 0){
                        attachs = new List<Messaging.EmailFileAttachment>();
                        Messaging.EmailFileAttachment attach = null;
                        for(Attachment att: attechments){
                            attach = new Messaging.EmailFileAttachment();
                            attach.setContentType(att.contentType);
                            attach.setFileName(att.Name);
                            attach.setInline(false);
                            attach.setBody(att.Body);
                            attachs.add(attach);
                            attach = null;
                        }
                    }                        
                }
            }
     
            if(null != attachs && attachs.size() > 0){
                email.setFileAttachments(attachs);
            }
                            
            Messaging.sendEmail(new Messaging.SingleEmailMessage[]{email});

            errorMsg = '';
            successMsg = 'Mail sent successfully to following recipients';
            return pageRef; 
        }else{
            return null;
        }
    }else{
        errorMsg = 'Please enter To or CC or BCC address';
        return null;
    }
}

}

Apex page:

<apex:page controller="EmailOpportunityAttachment">
    
<script type="text/javascript">

var delim = ";";
function lookupPick2(editPage, p2_lkid, p2, contactId, contactName, cas4, accountName, cas4_lkid, accountId, h){
    document.getElementsByClassName('p2')[0].value = contactName;
    document.getElementById('p2_lkid').value = contactId;
    closePopup();
}
function pickupValue(additionalToValue, ccValue, bccValue) { 
    //var editPage = document.getElementsByClassName('editPage')[0];
    var p24 = document.getElementsByClassName('p24')[0];
    var p4 = document.getElementsByClassName('p4')[0];
    var p5 = document.getElementsByClassName('p5')[0];
    if(additionalToValue != '') {
        if (p24.value != '') {
            p24.value += delim;
        } 
        p24.value += additionalToValue;
    }
    if(ccValue != '') {
        if (p4.value != '') {
            p4.value += delim;
        }
        p4.value += ccValue;
    }
    if(bccValue != '') {
        if (p5.value != '') {
           p5.value += delim;
        }
        p5.value += bccValue;
    }
    closePopup();
}

function openDocumentUpload(e) {
   setLastMousePosition(e);
   openPopup('/widg/filepicker_fs.jsp?lktp=015&mode=1&eid=00Yg0000000aN7g&utype=00P&omode=1&otype=2', 'doc', 450, 450, 'width=450,height=450,scrollbars=yes,toolbar=no,status=no,directories=no,menubar=no,resizable=1', true);
}
    
function attachPhxAttachment(e){
    var selector = document.getElementById('attS');
    var splt = selector.value.split('##');
    var id = splt[0];
    var size = splt[1];
    var tr = document.getElementById('tr_' + id);
    var fileStr = document.getElementById('fileStr');
    fileStr.innerHTML += tr.outerHTML;
    populateAttIds();
} 
    
function populateAttIds(){     
    var hiddenDv = document.getElementsByClassName('attDvBlock')[0];
    var hiddenAttIds = hiddenDv.getElementsByClassName('hiddenAttIds');
    var inps = document.getElementsByClassName('attIds')[0];
    
    inps.value = '';   
    if(hiddenAttIds && hiddenAttIds.length > 0){
        for(var i=0; i < hiddenAttIds.length; i++){
            inps.value += hiddenAttIds[i].value + delim;
        }
    }
}    

function submitFormNoSave() {
    var nosave = document.getElementById('nosave');
    var save = document.getElementById('save');
    nosave.value = '1';
    save.value = 'nosave';
    submitForm();
}
    
function submitForm() {
    var editPage = document.getElementById('editPage');
    editPage.submit();
}
    
    function deletePhxAttachment(event) {
        if (window.confirm('Are you sure?')) {
            var elem = event.target.parentNode.parentNode;
            elem.parentNode.removeChild(elem);
            populateAttIds();
        }
    }
</script>


    <apex:sectionHeader title="Task" subtitle="Send an Email"/> 

    <apex:form id="editPage" onsubmit="if (window.ffInAlert) { return false; }" styleClass="editPage">
  
        <input type="hidden" name="cancelURL" id="cancelURL" value="/{!opptyId}" />
        <input type="hidden" name="id" id="id" value="00Yg0000000aN7g" />
        <input type="hidden" name="docancel" id="docancel" value="0" />
        <input type="hidden" name="new_template" id="new_template" value="0" />
        <input type="hidden" name="nosave" id="nosave" value="0" />
        <input type="hidden" name="save" id="save" value="0" />
        <input type="hidden" name="retURL" id="retURL" value="/{!opptyId}" />
        <input type="hidden" name="rtype" id="rtype" value="003" />
        <input type="hidden" name="p2_lktp" id="p2_lktp" value="003" />
        <input type="hidden" name="p2_lkold" id="p2_lkold" value="" />
        <input type="hidden" name="p2_lkid" id="p2_lkid" value="" />
        <input type="hidden" name="p2_lspf" id="p2_lspf" value="0" />
        <input type="hidden" name="p2_lspfsub" id="p2_lspfsub" value="0" />
        <input type="hidden" name="p2_mod" id="p2_mod" value="0" />
        <input type="hidden" name="template_id" id="template_id" value="000000000000000" />
        
        <apex:pageblock id="mail" mode="edit"> 
            <apex:pageBlockButtons >                
                <apex:commandButton value="Send" action="{!sendEmail}" id="sendEmailBtn" />
                <input type="button" class="btn" value="Select Template" id="sendEmailBtn" />
                <input value="Attach File" class="btn" title="Attach File (New Window)" name="attach" onclick="openDocumentUpload(event)" type="button" />
                <input type="button" class="btn" value="Check Spelling" id="sendEmailBtn" />
                <input type="button" class="btn" value="Cancel" id="cancelBtn" />
            </apex:pageBlockButtons>
            
            <apex:pageblockSection>
                <apex:outputText styleClass="err" value="{!errorMsg}"/> 
                <apex:outputText styleClass="success" value="{!successMsg}"/> 
            </apex:pageblockSection>
            
            <apex:pageblockSection columns="1" title="Edit Email">
            
                <apex:pageBlockSectionItem >
                    <apex:outputLabel value="From" styleClass="bld"/>
                    <apex:outputpanel layout="block" styleClass="requiredInput">
                        <apex:outputpanel layout="block" styleClass="requiredBlock" />
                        <apex:selectList id="p26" value="{!ffrom}" size="1">
                            <apex:selectOptions value="{!contacts}"></apex:selectOptions>
                         </apex:selectList>
                    </apex:outputpanel>
                </apex:pageBlockSectionItem>

                <apex:pageBlockSectionItem>
                    <apex:outputLabel value="To:" styleClass="bld"/>
                    <apex:pageBlockSectionItem>
                    <apex:inputText  value="{!to}" maxlength="255" onchange="getElementByIdCS('p2_lkid').value='';getElementByIdCS('p2_mod').value='1';" size="20" styleClass="p2" />
                    <a href="javascript: openLookup('/_ui/common/data/LookupPage?lkfm=editPage&lknm=p2&lktp=' + getElementByIdCS('p2_lktp').value,670,'1','&lksrch=' + escapeUTF(getElementsByClassName('p2')[0].value.substring(0, 80)))" id="p2_lkwgt" onclick="setLastMousePosition(event)" title="To Lookup (New Window)">
                    <img src="/s.gif" alt="To Lookup (New Window)" class="lookupIconOn" onblur="this.className = 'lookupIcon';" onfocus="this.className = 'lookupIconOn';" onmouseout="this.className = 'lookupIcon';this.className = 'lookupIcon';" onmouseover="this.className = 'lookupIconOn';this.className = 'lookupIconOn';" title="To Lookup (New Window)" /></a>
                    </apex:pageBlockSectionItem>
                </apex:pageBlockSectionItem>
                
                <apex:pageblockSectionItem>
                    <apex:outputLabel value="Related To" styleClass="bld"/>
                    <apex:pageblockSectionItem>
                        <apex:selectList size="1" style="width: 250px">
                            <apex:selectOptions value="{!relatedTo}"></apex:selectOptions>
                            <apex:selectOptions value="{!relatedTo}"></apex:selectOptions>
                            <apex:selectOptions value="{!relatedTo}"></apex:selectOptions>
                         </apex:selectList>
                         <apex:inputText maxlength="255" style="margin-left: 4px;" value="{!relatedTo}" />
                    </apex:pageblockSectionItem>
                    
                </apex:pageblockSectionItem>
           
                <apex:pageblockSectionItem >
                    <apex:outputlink value="javascript: openPopup('/_ui/core/email/author/EmailCCBccLookup?id={!opptyId}', 'CCBCCLookup', 420, 490, 'width=420,height=490,toolbar=no,status=no,directories=no,menubar=no,resizable=yes,scrollable=no', true);" id="p24_lkwgt" onclick="setLastMousePosition(event)" title="Additional To Lookup (New Window)">Aditional To:</apex:outputlink>
                    <apex:pageBlockSectionItem >
                        <apex:inputTextArea value="{!additionalTo}" cols="62" rows="2" styleClass="p24" />
                        <apex:outputlink value="javascript: openPopup('/_ui/core/email/author/EmailCCBccLookup?id={!opptyId}', 'CCBCCLookup', 420, 490, 'width=420,height=490,toolbar=no,status=no,directories=no,menubar=no,resizable=yes,scrollable=no', true);" id="p24_lkwgt" onclick="setLastMousePosition(event)" title="Additional To Lookup (New Window)">
                             <img src="/s.gif" alt="Additional To Lookup (New Window)" class="lookupIcon" onblur="this.className = 'lookupIcon';" onfocus="this.className = 'lookupIconOn';" onmouseout="this.className = 'lookupIcon';this.className = 'lookupIcon';" onmouseover="this.className = 'lookupIconOn';this.className = 'lookupIconOn';" title="Additional To Lookup (New Window)" />
                        </apex:outputlink>
                    </apex:pageBlockSectionItem>
                </apex:pageblockSectionItem>            
                
                <apex:pageblockSectionItem >
                    <apex:outputlink value="#" target="_blank">CC:</apex:outputlink>
                    <apex:pageBlockSectionItem >  
                        <apex:inputTextArea value="{!cc}" cols="62" id="p4" rows="2" title="CC" styleClass="p4" />              
                        <apex:outputlink value="javascript: openPopup('/_ui/core/email/author/EmailCCBccLookup?id={!opptyId}', 'CCBCCLookup', 420, 490, 'width=420,height=490,toolbar=no,status=no,directories=no,menubar=no,resizable=yes,scrollable=no', true);" id="p4_lkwgt" onclick="setLastMousePosition(event)" title="CC Lookup (New Window)">
                            <img src="/s.gif" alt="CC Lookup (New Window)" class="lookupIcon" onblur="this.className = 'lookupIcon';" onfocus="this.className = 'lookupIconOn';" onmouseout="this.className = 'lookupIcon';this.className = 'lookupIcon';" onmouseover="this.className = 'lookupIconOn';this.className = 'lookupIconOn';" title="CC Lookup (New Window)" />
                        </apex:outputlink>
                    </apex:pageBlockSectionItem>
                </apex:pageblockSectionItem>
               
                <apex:pageBlockSectionItem >
                    <apex:outputlink value="#" target="_blank">BCC:</apex:outputlink>
                    <apex:pageBlockSectionItem>
                        <apex:inputTextArea value="{!bcc}" cols="62" id="p5" rows="2" title="BCC" styleClass="p5" />                
                        <apex:outputlink value="javascript: openPopup('/_ui/core/email/author/EmailCCBccLookup?id={!opptyId}', 'CCBCCLookup', 420, 490, 'width=420,height=490,toolbar=no,status=no,directories=no,menubar=no,resizable=yes,scrollable=no', true);" id="p5_lkwgt" onclick="setLastMousePosition(event)" title="BCC Lookup (New Window)">
                            <img src="/s.gif" alt="BCC Lookup (New Window)" class="lookupIcon" onblur="this.className = 'lookupIcon';" onfocus="this.className = 'lookupIconOn';" onmouseout="this.className = 'lookupIcon';this.className = 'lookupIcon';" onmouseover="this.className = 'lookupIconOn';this.className = 'lookupIconOn';" title="BCC Lookup (New Window)" />
                        </apex:outputlink>
                    </apex:pageBlockSectionItem>
                </apex:pageBlockSectionItem>
                 
                <apex:pageblockSectionItem >
                    <apex:outputLabel value="Subject" styleClass="bld"/>
                    <apex:outputpanel layout="block" styleClass="requiredInput">
                        <apex:outputpanel layout="block" styleClass="requiredBlock"/>
                        <apex:inputText value="{!subject}" maxlength="100" size="70"/>
                    </apex:outputpanel>    
                </apex:pageblockSectionItem>
                
                <apex:pageblockSectionItem >
                    <apex:outputLabel value="Message" styleClass="bld"/>
                    <apex:inputTextArea value="{!message}" rows="15" cols="93" richText="false"/>
                </apex:pageblockSectionItem>
                
            </apex:pageblockSection>
            
            <div id="test" style="width: 500px; margin: 20px 0 0 19%;">
                <select id="attS" name="attS" style="width: 400px;">
                    <apex:repeat value="{!attachments}" var="att" id="theRepeat">
                        <option value="{!att.Id}##{!att.BodyLength}">{!att.Name}</option>
                    </apex:repeat>
                </select>
               <input value="Attach File" class="btn" id="attachFile" name="attachFile" onclick="attachPhxAttachment(event)" type="button" />
               <div style="margin: 10px 0 0 0;">
                   <input style="display:none;" value="Attach File" class="btn" title="Attach File (New Window)" id="attach" name="attach" onclick="openDocumentUpload(event)" type="button" />
               </div>
           </div>
        </apex:pageblock> 

    

<div class="bRelatedList">
<!-- Begin ListElement -->

<!-- motif: Home -->

<!-- WrappingClass -->
<div class="listRelatedObject homeBlock">
    <div class="bPageBlock brandSecondaryBrd secondaryPalette">
        <div class="pbHeader">
            <table border="0" cellpadding="0" cellspacing="0"><tbody>
                <tr>
                    <td class="pbTitle">
                        <img src="/s.gif" alt="" width="12" height="1" class="minWidth" title="" style="margin-right: 0.25em;margin-right: 0.25em;margin-right: 0.25em;margin-right: 0.25em;margin-right: 0.25em;" />
                        <h3>Attachments</h3>
                    </td>
                    <td class="pbButton">
                        <input value="Attach File" class="btn" name="attach" onclick="openDocumentUpload(event)" title="Attach File (New Window)" type="button" />
                    </td>
                    <td class="pbHelp">&nbsp;</td>
                </tr>
                </tbody>
            </table>
        </div>
        <div class="pbBody attDvBlock">
            <table class="list" border="0" cellspacing="0" cellpadding="0">
                <tbody id="fileStr">
                <tr class="headerRow">
                    <th class="actionColumn" scope="col">Action</th>
                    <th scope="col" class=" zen-deemphasize">File</th>
                    <th scope="col" class=" zen-deemphasize">Size</th>
                </tr>
                </tbody>
            </table>
        </div>
        <div class="pbFooter secondaryPalette">
            <div class="bg"></div>
        </div>
    </div>
</div>
            <div class="listElementBottomNav"></div>
                <!-- End ListElement -->
</div>
        
        <div class="hiddenDv" style="display:none !important;">  
            <table class="list" border="0" cellspacing="0" cellpadding="0">
                <tbody>
                <apex:repeat value="{!attachments}" var="att2" id="trFileRepeat">                
                    <tr id="tr_{!att2.Id}" class="dataRow even last first highlight" onblur="if (window.hiOff){hiOff(this);}" onfocus="if (window.hiOn){hiOn(this);}" onmouseout="if (window.hiOff){hiOff(this);}" onmouseover="if (window.hiOn){hiOn(this);}">
                        <td class="actionColumn">
                            <a href="javascript:;" class="actionLink" onclick="deletePhxAttachment(event)">Del</a>
                        </td>
                        <th scope="row" class=" dataCell  ">
                            <a href="/servlet/servlet.FileDownload?file={!att2.Id}" target="_TOP">{!att2.Name}</a>
                            <input type="hidden" value="{!att2.Id}" class="hiddenAttIds" />
                        </th>
                        <td class=" dataCell  ">{!att2.BodyLength} bytes</td>
                    </tr> 
                </apex:repeat>
                </tbody>
            </table>
        </div>
        <apex:inputText value="{!attachmentIds}" styleClass="attIds" style="" />
    </apex:form>
 </apex:page>

Apex controller:

public class EmailOpportunityAttachment{

    public String to {get;set;}
    public String additionalTo {get;set;}
    public String relatedTo {get;set;}
    public String cc {get;set;}
    public String bcc {get;set;}
    public String ffrom {get;set;}
    public String message {get;set;}
    public String subject {get;set;}
    public String errorMsg{get;set;} 
    public String successMsg{get;set;}
    public List<String> addresses {get;set;}
    public String opptyId {get;set;}
    public String accountId {get;set;}
    public String attachmentIds {get;set;}
    public boolean flagToSendMail;
    private static final String DEL = ';';
        
  
    public EmailOpportunityAttachment(){
        this.opptyId = ApexPages.currentPage().getParameters().get('opptyId');
        this.accountId = ApexPages.currentPage().getParameters().get('accountId');
    }

    public List<SelectOption> contacts {
        get {
            List<SelectOption> contacts = new List<SelectOption>();
            List<Contact> cnts = [select Id, Name, Email from Contact where Account.Id =: this.accountid];
            for (Contact cnt: cnts) {
                contacts.add(new SelectOption(cnt.Id, '"' + cnt.Name + '" <' + cnt.Email + '>'));
            }
        return contacts;
        }
        set;
    }

    
    public Attachment[] getAttachments(){
      return  [select id, Name, BodyLength, Body from Attachment where parent.id =: this.opptyId];
    }
    
    public List<Attachment> getAttachmentsByIds(final String[] ids){
        String sql = ' select Id, Name, Body, ContentType from Attachment where Name=\'DDDDDDDDDDDDDD\' ';
        boolean found = false;
        if(null != ids && ids.size() > 0){
            for(String id: ids){
                sql += ' OR Id=';
                sql += '\'';
                sql += id;
                sql += '\'';
            }            
            found = true;
        }
        //System.debug(sql);
        return found ? (List<Attachment>)Database.query(sql) : null;
    }
    
     
    public String getEmailByUserName(final String userName){
      return [select Email from Contact where Name =: userName limit 1].Email;
    }

    public PageReference sendEmail() {
        PageReference pageRef = new PageReference('/'+this.opptyId);
                
        if(subject == '' || message == ''){
            errorMsg = 'Please enter subject and message.';
            return null;
        }
        
        if(to != '' || additionalTo != '' || cc != '' || bcc != ''){
            List<String> toAddresses = new List<String>();
            List<String> ccAddresses = new List<String>();
            List<String> bccAddresses = new List<String>();
    
            List<String> tmpAddr = new List<String>();
            if(additionalTo.contains(DEL)){
                toAddresses = additionalTo.split(DEL);
                for(String tmp:toAddresses){
                    tmpAddr.add(tmp);
                }
            }else if(additionalTo != '') {
                toAddresses.add(additionalTo);
                tmpAddr.add(additionalTo);
            }
            
            if(to != ''){
                final String emailAddr = getEmailByUserName(to);
                toAddresses.add(emailAddr);
                tmpAddr.add(emailAddr);
            }
            
            if(cc.contains(DEL)){
                ccAddresses = cc.split(DEL);
                for(String tmp:ccAddresses){
                    tmpAddr.add(tmp);
                }
            }else if(cc != ''){
                ccAddresses.add(cc);
                tmpAddr.add(cc);
            }
            if(bcc.contains(DEL)){
                bccAddresses = bcc.split(DEL);
                for(String tmp:bccAddresses){
                    tmpAddr.add(tmp);
                }
            }else if(bcc != ''){
                bccAddresses.add(bcc);
                tmpAddr.add(bcc);
            }
    
            /* Checking whether mail ids are valid */
            addresses = tmpAddr;
            for(String tempStr:addresses){
                if(!Pattern.matches('[a-zA-Z0-9._-]+@[a-zA-Z]+.[a-zA-Z]{2,4}', tempStr)){
                    errorMsg = 'Check To, CC and BCC addresses';
                    successMsg = '';
                    flagToSendMail = false;      
                    break;          
                }else{
                    flagToSendMail = true;
                }           
            } 
    
            /* Sending Mail */
            if(flagToSendMail == true){
                Messaging.SingleEmailMessage email = new Messaging.SingleEmailMessage();
                if(toAddresses != null){
                    email.setToAddresses(toAddresses);
                }
                if(ccAddresses != null){
                    email.setccAddresses(ccAddresses);
                }
                if(bccAddresses != null){
                    email.setbccAddresses(bccAddresses);
                }             
                email.setSubject(subject);  
                email.setHtmlBody(message);
                
                List<Messaging.EmailFileAttachment> attachs = null;
                
                if('' != attachmentIds){
                    final String[] attachIds = attachmentIds.split(DEL);
                    if(null != attachIds && attachIds.size() > 0){
                       final List<Attachment> attechments = getAttachmentsByIds(attachIds);
                        if(null != attechments && attechments.size() > 0){
                            attachs = new List<Messaging.EmailFileAttachment>();
                            Messaging.EmailFileAttachment attach = null;
                            for(Attachment att: attechments){
                                attach = new Messaging.EmailFileAttachment();
                                attach.setContentType(att.contentType);
                                attach.setFileName(att.Name);
                                attach.setInline(false);
                                attach.setBody(att.Body);
                                attachs.add(attach);
                                attach = null;
                            }
                        }                        
                    }
                }
         
                if(null != attachs && attachs.size() > 0){
                    email.setFileAttachments(attachs);
                }
                                
                Messaging.sendEmail(new Messaging.SingleEmailMessage[]{email});
    
                errorMsg = '';
                successMsg = 'Mail sent successfully to following recipients';
                return pageRef; 
            }else{
                return null;
            }
        }else{
            errorMsg = 'Please enter To or CC or BCC address';
            return null;
        }
    }
 
}
added 23515 characters in body
Source Link

Here is my solution, note the code is not refactored but functionality is doing what I need exactly,

Apex page:

<apex:page controller="EmailOpportunityAttachment">

var delim = ";";function lookupPick2(editPage, p2_lkid, p2, contactId, contactName, cas4, accountName, cas4_lkid, accountId, h){document.getElementsByClassName('p2')[0].value = contactName;document.getElementById('p2_lkid').value = contactId;closePopup();}function pickupValue(additionalToValue, ccValue, bccValue){//var editPage = document.getElementsByClassName('editPage')[0];var p24 = document.getElementsByClassName('p24')[0];var p4 = document.getElementsByClassName('p4')[0];var p5 = document.getElementsByClassName('p5')[0];if(additionalToValue!= ''){if(p24.value!= ''){p24.value += delim;}p24.value += additionalToValue;}if(ccValue!= ''){if(p4.value!= ''){p4.value += delim;}p4.value += ccValue;}if(bccValue!= ''){if(p5.value!= ''){p5.value += delim;}p5.value += bccValue;}closePopup();}function openDocumentUpload(e){setLastMousePosition(e);openPopup('/widg/filepicker_fs.jsp?lktp=015&mode=1&eid=00Yg0000000aN7g&utype=00P&omode=1&otype=2', 'doc', 450, 450, 'width=450,height=450,scrollbars=yes,toolbar=no,status=no,directories=no,menubar=no,resizable=1', true);}function attachPhxAttachment(e){var selector = document.getElementById('attS');var splt = selector.value.split('##');var id = splt[0];var size = splt[1];var tr = document.getElementById('tr_' + id);var fileStr = document.getElementById('fileStr');fileStr.innerHTML += tr.outerHTML;populateAttIds();}function populateAttIds(){var hiddenDv = document.getElementsByClassName('attDvBlock')[0];var hiddenAttIds = hiddenDv.getElementsByClassName('hiddenAttIds');var inps = document.getElementsByClassName('attIds')[0];inps.value = '';if(hiddenAttIds && hiddenAttIds.length > 0){for(var i=0; i
<apex:sectionHeader title="Task" subtitle="Send an Email"/>

<apex:form id="editPage" onsubmit="if (window.ffInAlert) { return false; }" styleClass="editPage">

    <input type="hidden" name="cancelURL" id="cancelURL" value="/{!opptyId}" />
    <input type="hidden" name="id" id="id" value="00Yg0000000aN7g" />
    <input type="hidden" name="docancel" id="docancel" value="0" />
    <input type="hidden" name="new_template" id="new_template" value="0" />
    <input type="hidden" name="nosave" id="nosave" value="0" />
    <input type="hidden" name="save" id="save" value="0" />
    <input type="hidden" name="retURL" id="retURL" value="/{!opptyId}" />
    <input type="hidden" name="rtype" id="rtype" value="003" />
    <input type="hidden" name="p2_lktp" id="p2_lktp" value="003" />
    <input type="hidden" name="p2_lkold" id="p2_lkold" value="" />
    <input type="hidden" name="p2_lkid" id="p2_lkid" value="" />
    <input type="hidden" name="p2_lspf" id="p2_lspf" value="0" />
    <input type="hidden" name="p2_lspfsub" id="p2_lspfsub" value="0" />
    <input type="hidden" name="p2_mod" id="p2_mod" value="0" />
    <input type="hidden" name="template_id" id="template_id" value="000000000000000" />
    
    <apex:pageblock id="mail" mode="edit"> 
        <apex:pageBlockButtons >                
            <apex:commandButton value="Send" action="{!sendEmail}" id="sendEmailBtn" />
            <input type="button" class="btn" value="Select Template" id="sendEmailBtn" />
            <input value="Attach File" class="btn" title="Attach File (New Window)" name="attach" onclick="openDocumentUpload(event)" type="button" />
            <input type="button" class="btn" value="Check Spelling" id="sendEmailBtn" />
            <input type="button" class="btn" value="Cancel" id="cancelBtn" />
        </apex:pageBlockButtons>
        
        <apex:pageblockSection>
            <apex:outputText styleClass="err" value="{!errorMsg}"/> 
            <apex:outputText styleClass="success" value="{!successMsg}"/> 
        </apex:pageblockSection>
        
        <apex:pageblockSection columns="1" title="Edit Email">
        
            <apex:pageBlockSectionItem >
                <apex:outputLabel value="From" styleClass="bld"/>
                <apex:outputpanel layout="block" styleClass="requiredInput">
                    <apex:outputpanel layout="block" styleClass="requiredBlock" />
                    <apex:selectList id="p26" value="{!ffrom}" size="1">
                        <apex:selectOptions value="{!contacts}"></apex:selectOptions>
                     </apex:selectList>
                </apex:outputpanel>
            </apex:pageBlockSectionItem>

            <apex:pageBlockSectionItem>
                <apex:outputLabel value="To:" styleClass="bld"/>
                <apex:pageBlockSectionItem>
                <apex:inputText  value="{!to}" maxlength="255" onchange="getElementByIdCS('p2_lkid').value='';getElementByIdCS('p2_mod').value='1';" size="20" styleClass="p2" />
                <a href="javascript: openLookup('/_ui/common/data/LookupPage?lkfm=editPage&lknm=p2&lktp=' + getElementByIdCS('p2_lktp').value,670,'1','&lksrch=' + escapeUTF(getElementsByClassName('p2')[0].value.substring(0, 80)))" id="p2_lkwgt" onclick="setLastMousePosition(event)" title="To Lookup (New Window)">
                <img src="/s.gif" alt="To Lookup (New Window)" class="lookupIconOn" onblur="this.className = 'lookupIcon';" onfocus="this.className = 'lookupIconOn';" onmouseout="this.className = 'lookupIcon';this.className = 'lookupIcon';" onmouseover="this.className = 'lookupIconOn';this.className = 'lookupIconOn';" title="To Lookup (New Window)" /></a>
                </apex:pageBlockSectionItem>
            </apex:pageBlockSectionItem>
            
            <apex:pageblockSectionItem>
                <apex:outputLabel value="Related To" styleClass="bld"/>
                <apex:pageblockSectionItem>
                    <apex:selectList size="1" style="width: 250px">
                        <apex:selectOptions value="{!relatedTo}"></apex:selectOptions>
                        <apex:selectOptions value="{!relatedTo}"></apex:selectOptions>
                        <apex:selectOptions value="{!relatedTo}"></apex:selectOptions>
                     </apex:selectList>
                     <apex:inputText maxlength="255" style="margin-left: 4px;" value="{!relatedTo}" />
                </apex:pageblockSectionItem>
                
            </apex:pageblockSectionItem>
       
            <apex:pageblockSectionItem >
                <apex:outputlink value="javascript: openPopup('/_ui/core/email/author/EmailCCBccLookup?id={!opptyId}', 'CCBCCLookup', 420, 490, 'width=420,height=490,toolbar=no,status=no,directories=no,menubar=no,resizable=yes,scrollable=no', true);" id="p24_lkwgt" onclick="setLastMousePosition(event)" title="Additional To Lookup (New Window)">Aditional To:</apex:outputlink>
                <apex:pageBlockSectionItem >
                    <apex:inputTextArea value="{!additionalTo}" cols="62" rows="2" styleClass="p24" />
                    <apex:outputlink value="javascript: openPopup('/_ui/core/email/author/EmailCCBccLookup?id={!opptyId}', 'CCBCCLookup', 420, 490, 'width=420,height=490,toolbar=no,status=no,directories=no,menubar=no,resizable=yes,scrollable=no', true);" id="p24_lkwgt" onclick="setLastMousePosition(event)" title="Additional To Lookup (New Window)">
                         <img src="/s.gif" alt="Additional To Lookup (New Window)" class="lookupIcon" onblur="this.className = 'lookupIcon';" onfocus="this.className = 'lookupIconOn';" onmouseout="this.className = 'lookupIcon';this.className = 'lookupIcon';" onmouseover="this.className = 'lookupIconOn';this.className = 'lookupIconOn';" title="Additional To Lookup (New Window)" />
                    </apex:outputlink>
                </apex:pageBlockSectionItem>
            </apex:pageblockSectionItem>            
            
            <apex:pageblockSectionItem >
                <apex:outputlink value="#" target="_blank">CC:</apex:outputlink>
                <apex:pageBlockSectionItem >  
                    <apex:inputTextArea value="{!cc}" cols="62" id="p4" rows="2" title="CC" styleClass="p4" />              
                    <apex:outputlink value="javascript: openPopup('/_ui/core/email/author/EmailCCBccLookup?id={!opptyId}', 'CCBCCLookup', 420, 490, 'width=420,height=490,toolbar=no,status=no,directories=no,menubar=no,resizable=yes,scrollable=no', true);" id="p4_lkwgt" onclick="setLastMousePosition(event)" title="CC Lookup (New Window)">
                        <img src="/s.gif" alt="CC Lookup (New Window)" class="lookupIcon" onblur="this.className = 'lookupIcon';" onfocus="this.className = 'lookupIconOn';" onmouseout="this.className = 'lookupIcon';this.className = 'lookupIcon';" onmouseover="this.className = 'lookupIconOn';this.className = 'lookupIconOn';" title="CC Lookup (New Window)" />
                    </apex:outputlink>
                </apex:pageBlockSectionItem>
            </apex:pageblockSectionItem>
           
            <apex:pageBlockSectionItem >
                <apex:outputlink value="#" target="_blank">BCC:</apex:outputlink>
                <apex:pageBlockSectionItem>
                    <apex:inputTextArea value="{!bcc}" cols="62" id="p5" rows="2" title="BCC" styleClass="p5" />                
                    <apex:outputlink value="javascript: openPopup('/_ui/core/email/author/EmailCCBccLookup?id={!opptyId}', 'CCBCCLookup', 420, 490, 'width=420,height=490,toolbar=no,status=no,directories=no,menubar=no,resizable=yes,scrollable=no', true);" id="p5_lkwgt" onclick="setLastMousePosition(event)" title="BCC Lookup (New Window)">
                        <img src="/s.gif" alt="BCC Lookup (New Window)" class="lookupIcon" onblur="this.className = 'lookupIcon';" onfocus="this.className = 'lookupIconOn';" onmouseout="this.className = 'lookupIcon';this.className = 'lookupIcon';" onmouseover="this.className = 'lookupIconOn';this.className = 'lookupIconOn';" title="BCC Lookup (New Window)" />
                    </apex:outputlink>
                </apex:pageBlockSectionItem>
            </apex:pageBlockSectionItem>
            
            <apex:pageblockSectionItem >
                <apex:outputLabel value="Subject" styleClass="bld"/>
                <apex:outputpanel layout="block" styleClass="requiredInput">
                    <apex:outputpanel layout="block" styleClass="requiredBlock"/>
                    <apex:inputText value="{!subject}" maxlength="100" size="70"/>
                </apex:outputpanel>    
            </apex:pageblockSectionItem>
            
            <apex:pageblockSectionItem >
                <apex:outputLabel value="Message" styleClass="bld"/>
                <apex:inputTextArea value="{!message}" rows="15" cols="93" richText="false"/>
            </apex:pageblockSectionItem>
            
        </apex:pageblockSection>
        
        <div id="test" style="width: 500px; margin: 20px 0 0 19%;">
            <select id="attS" name="attS" style="width: 400px;">
                <apex:repeat value="{!attachments}" var="att" id="theRepeat">
                    <option value="{!att.Id}##{!att.BodyLength}">{!att.Name}</option>
                </apex:repeat>
            </select>
           <input value="Attach File" class="btn" id="attachFile" name="attachFile" onclick="attachPhxAttachment(event)" type="button" />
           <div style="margin: 10px 0 0 0;">
               <input style="display:none;" value="Attach File" class="btn" title="Attach File (New Window)" id="attach" name="attach" onclick="openDocumentUpload(event)" type="button" />
           </div>
       </div>
    </apex:pageblock> 

Attachments

 ActionFileSizeDel{!att2.Name}{!att2.BodyLength} bytesApex controller:public class EmailOpportunityAttachment{
public String to {get;set;}
public String additionalTo {get;set;}
public String relatedTo {get;set;}
public String cc {get;set;}
public String bcc {get;set;}
public String ffrom {get;set;}
public String message {get;set;}
public String subject {get;set;}
public String errorMsg{get;set;} 
public String successMsg{get;set;}
public List<String> addresses {get;set;}
public String opptyId {get;set;}
public String accountId {get;set;}
public String attachmentIds {get;set;}
public boolean flagToSendMail;
private static final String DEL = ';';
    

public EmailOpportunityAttachment(){
    this.opptyId = ApexPages.currentPage().getParameters().get('opptyId');
    this.accountId = ApexPages.currentPage().getParameters().get('accountId');
}

public List<SelectOption> contacts {
    get {
        List<SelectOption> contacts = new List<SelectOption>();
        List<Contact> cnts = [select Id, Name, Email from Contact where Account.Id =: this.accountid];
        for (Contact cnt: cnts) {
            contacts.add(new SelectOption(cnt.Id, '"' + cnt.Name + '" <' + cnt.Email + '>'));
        }
    return contacts;
    }
    set;
}


public Attachment[] getAttachments(){
  return  [select id, Name, BodyLength, Body from Attachment where parent.id =: this.opptyId];
}

public List<Attachment> getAttachmentsByIds(final String[] ids){
    String sql = ' select Id, Name, Body, ContentType from Attachment where Name=\'DDDDDDDDDDDDDD\' ';
    boolean found = false;
    if(null != ids && ids.size() > 0){
        for(String id: ids){
            sql += ' OR Id=';
            sql += '\'';
            sql += id;
            sql += '\'';
        }            
        found = true;
    }
    //System.debug(sql);
    return found ? (List<Attachment>)Database.query(sql) : null;
}


public String getEmailByUserName(final String userName){
  return [select Email from Contact where Name =: userName limit 1].Email;
}

public PageReference sendEmail() {
    PageReference pageRef = new PageReference('/'+this.opptyId);
            
    if(subject == '' || message == ''){
        errorMsg = 'Please enter subject and message.';
        return null;
    }
    
    if(to != '' || additionalTo != '' || cc != '' || bcc != ''){
        List<String> toAddresses = new List<String>();
        List<String> ccAddresses = new List<String>();
        List<String> bccAddresses = new List<String>();

        List<String> tmpAddr = new List<String>();
        if(additionalTo.contains(DEL)){
            toAddresses = additionalTo.split(DEL);
            for(String tmp:toAddresses){
                tmpAddr.add(tmp);
            }
        }else if(additionalTo != '') {
            toAddresses.add(additionalTo);
            tmpAddr.add(additionalTo);
        }
        
        if(to != ''){
            final String emailAddr = getEmailByUserName(to);
            toAddresses.add(emailAddr);
            tmpAddr.add(emailAddr);
        }
        
        if(cc.contains(DEL)){
            ccAddresses = cc.split(DEL);
            for(String tmp:ccAddresses){
                tmpAddr.add(tmp);
            }
        }else if(cc != ''){
            ccAddresses.add(cc);
            tmpAddr.add(cc);
        }
        if(bcc.contains(DEL)){
            bccAddresses = bcc.split(DEL);
            for(String tmp:bccAddresses){
                tmpAddr.add(tmp);
            }
        }else if(bcc != ''){
            bccAddresses.add(bcc);
            tmpAddr.add(bcc);
        }

        /* Checking whether mail ids are valid */
        addresses = tmpAddr;
        for(String tempStr:addresses){
            if(!Pattern.matches('[a-zA-Z0-9._-]+@[a-zA-Z]+.[a-zA-Z]{2,4}', tempStr)){
                errorMsg = 'Check To, CC and BCC addresses';
                successMsg = '';
                flagToSendMail = false;      
                break;          
            }else{
                flagToSendMail = true;
            }           
        } 

        /* Sending Mail */
        if(flagToSendMail == true){
            Messaging.SingleEmailMessage email = new Messaging.SingleEmailMessage();
            if(toAddresses != null){
                email.setToAddresses(toAddresses);
            }
            if(ccAddresses != null){
                email.setccAddresses(ccAddresses);
            }
            if(bccAddresses != null){
                email.setbccAddresses(bccAddresses);
            }             
            email.setSubject(subject);  
            email.setHtmlBody(message);
            
            List<Messaging.EmailFileAttachment> attachs = null;
            
            if('' != attachmentIds){
                final String[] attachIds = attachmentIds.split(DEL);
                if(null != attachIds && attachIds.size() > 0){
                   final List<Attachment> attechments = getAttachmentsByIds(attachIds);
                    if(null != attechments && attechments.size() > 0){
                        attachs = new List<Messaging.EmailFileAttachment>();
                        Messaging.EmailFileAttachment attach = null;
                        for(Attachment att: attechments){
                            attach = new Messaging.EmailFileAttachment();
                            attach.setContentType(att.contentType);
                            attach.setFileName(att.Name);
                            attach.setInline(false);
                            attach.setBody(att.Body);
                            attachs.add(attach);
                            attach = null;
                        }
                    }                        
                }
            }
     
            if(null != attachs && attachs.size() > 0){
                email.setFileAttachments(attachs);
            }
                            
            Messaging.sendEmail(new Messaging.SingleEmailMessage[]{email});

            errorMsg = '';
            successMsg = 'Mail sent successfully to following recipients';
            return pageRef; 
        }else{
            return null;
        }
    }else{
        errorMsg = 'Please enter To or CC or BCC address';
        return null;
    }
}

}

Here is my solution, note the code is not refactored but functionality is doing what I need exactly,

Apex page:

<apex:page controller="EmailOpportunityAttachment">

var delim = ";";function lookupPick2(editPage, p2_lkid, p2, contactId, contactName, cas4, accountName, cas4_lkid, accountId, h){document.getElementsByClassName('p2')[0].value = contactName;document.getElementById('p2_lkid').value = contactId;closePopup();}function pickupValue(additionalToValue, ccValue, bccValue){//var editPage = document.getElementsByClassName('editPage')[0];var p24 = document.getElementsByClassName('p24')[0];var p4 = document.getElementsByClassName('p4')[0];var p5 = document.getElementsByClassName('p5')[0];if(additionalToValue!= ''){if(p24.value!= ''){p24.value += delim;}p24.value += additionalToValue;}if(ccValue!= ''){if(p4.value!= ''){p4.value += delim;}p4.value += ccValue;}if(bccValue!= ''){if(p5.value!= ''){p5.value += delim;}p5.value += bccValue;}closePopup();}function openDocumentUpload(e){setLastMousePosition(e);openPopup('/widg/filepicker_fs.jsp?lktp=015&mode=1&eid=00Yg0000000aN7g&utype=00P&omode=1&otype=2', 'doc', 450, 450, 'width=450,height=450,scrollbars=yes,toolbar=no,status=no,directories=no,menubar=no,resizable=1', true);}function attachPhxAttachment(e){var selector = document.getElementById('attS');var splt = selector.value.split('##');var id = splt[0];var size = splt[1];var tr = document.getElementById('tr_' + id);var fileStr = document.getElementById('fileStr');fileStr.innerHTML += tr.outerHTML;populateAttIds();}function populateAttIds(){var hiddenDv = document.getElementsByClassName('attDvBlock')[0];var hiddenAttIds = hiddenDv.getElementsByClassName('hiddenAttIds');var inps = document.getElementsByClassName('attIds')[0];inps.value = '';if(hiddenAttIds && hiddenAttIds.length > 0){for(var i=0; i
<apex:sectionHeader title="Task" subtitle="Send an Email"/>

<apex:form id="editPage" onsubmit="if (window.ffInAlert) { return false; }" styleClass="editPage">

    <input type="hidden" name="cancelURL" id="cancelURL" value="/{!opptyId}" />
    <input type="hidden" name="id" id="id" value="00Yg0000000aN7g" />
    <input type="hidden" name="docancel" id="docancel" value="0" />
    <input type="hidden" name="new_template" id="new_template" value="0" />
    <input type="hidden" name="nosave" id="nosave" value="0" />
    <input type="hidden" name="save" id="save" value="0" />
    <input type="hidden" name="retURL" id="retURL" value="/{!opptyId}" />
    <input type="hidden" name="rtype" id="rtype" value="003" />
    <input type="hidden" name="p2_lktp" id="p2_lktp" value="003" />
    <input type="hidden" name="p2_lkold" id="p2_lkold" value="" />
    <input type="hidden" name="p2_lkid" id="p2_lkid" value="" />
    <input type="hidden" name="p2_lspf" id="p2_lspf" value="0" />
    <input type="hidden" name="p2_lspfsub" id="p2_lspfsub" value="0" />
    <input type="hidden" name="p2_mod" id="p2_mod" value="0" />
    <input type="hidden" name="template_id" id="template_id" value="000000000000000" />
    
    <apex:pageblock id="mail" mode="edit"> 
        <apex:pageBlockButtons >                
            <apex:commandButton value="Send" action="{!sendEmail}" id="sendEmailBtn" />
            <input type="button" class="btn" value="Select Template" id="sendEmailBtn" />
            <input value="Attach File" class="btn" title="Attach File (New Window)" name="attach" onclick="openDocumentUpload(event)" type="button" />
            <input type="button" class="btn" value="Check Spelling" id="sendEmailBtn" />
            <input type="button" class="btn" value="Cancel" id="cancelBtn" />
        </apex:pageBlockButtons>
        
        <apex:pageblockSection>
            <apex:outputText styleClass="err" value="{!errorMsg}"/> 
            <apex:outputText styleClass="success" value="{!successMsg}"/> 
        </apex:pageblockSection>
        
        <apex:pageblockSection columns="1" title="Edit Email">
        
            <apex:pageBlockSectionItem >
                <apex:outputLabel value="From" styleClass="bld"/>
                <apex:outputpanel layout="block" styleClass="requiredInput">
                    <apex:outputpanel layout="block" styleClass="requiredBlock" />
                    <apex:selectList id="p26" value="{!ffrom}" size="1">
                        <apex:selectOptions value="{!contacts}"></apex:selectOptions>
                     </apex:selectList>
                </apex:outputpanel>
            </apex:pageBlockSectionItem>

            <apex:pageBlockSectionItem>
                <apex:outputLabel value="To:" styleClass="bld"/>
                <apex:pageBlockSectionItem>
                <apex:inputText  value="{!to}" maxlength="255" onchange="getElementByIdCS('p2_lkid').value='';getElementByIdCS('p2_mod').value='1';" size="20" styleClass="p2" />
                <a href="javascript: openLookup('/_ui/common/data/LookupPage?lkfm=editPage&lknm=p2&lktp=' + getElementByIdCS('p2_lktp').value,670,'1','&lksrch=' + escapeUTF(getElementsByClassName('p2')[0].value.substring(0, 80)))" id="p2_lkwgt" onclick="setLastMousePosition(event)" title="To Lookup (New Window)">
                <img src="/s.gif" alt="To Lookup (New Window)" class="lookupIconOn" onblur="this.className = 'lookupIcon';" onfocus="this.className = 'lookupIconOn';" onmouseout="this.className = 'lookupIcon';this.className = 'lookupIcon';" onmouseover="this.className = 'lookupIconOn';this.className = 'lookupIconOn';" title="To Lookup (New Window)" /></a>
                </apex:pageBlockSectionItem>
            </apex:pageBlockSectionItem>
            
            <apex:pageblockSectionItem>
                <apex:outputLabel value="Related To" styleClass="bld"/>
                <apex:pageblockSectionItem>
                    <apex:selectList size="1" style="width: 250px">
                        <apex:selectOptions value="{!relatedTo}"></apex:selectOptions>
                        <apex:selectOptions value="{!relatedTo}"></apex:selectOptions>
                        <apex:selectOptions value="{!relatedTo}"></apex:selectOptions>
                     </apex:selectList>
                     <apex:inputText maxlength="255" style="margin-left: 4px;" value="{!relatedTo}" />
                </apex:pageblockSectionItem>
                
            </apex:pageblockSectionItem>
       
            <apex:pageblockSectionItem >
                <apex:outputlink value="javascript: openPopup('/_ui/core/email/author/EmailCCBccLookup?id={!opptyId}', 'CCBCCLookup', 420, 490, 'width=420,height=490,toolbar=no,status=no,directories=no,menubar=no,resizable=yes,scrollable=no', true);" id="p24_lkwgt" onclick="setLastMousePosition(event)" title="Additional To Lookup (New Window)">Aditional To:</apex:outputlink>
                <apex:pageBlockSectionItem >
                    <apex:inputTextArea value="{!additionalTo}" cols="62" rows="2" styleClass="p24" />
                    <apex:outputlink value="javascript: openPopup('/_ui/core/email/author/EmailCCBccLookup?id={!opptyId}', 'CCBCCLookup', 420, 490, 'width=420,height=490,toolbar=no,status=no,directories=no,menubar=no,resizable=yes,scrollable=no', true);" id="p24_lkwgt" onclick="setLastMousePosition(event)" title="Additional To Lookup (New Window)">
                         <img src="/s.gif" alt="Additional To Lookup (New Window)" class="lookupIcon" onblur="this.className = 'lookupIcon';" onfocus="this.className = 'lookupIconOn';" onmouseout="this.className = 'lookupIcon';this.className = 'lookupIcon';" onmouseover="this.className = 'lookupIconOn';this.className = 'lookupIconOn';" title="Additional To Lookup (New Window)" />
                    </apex:outputlink>
                </apex:pageBlockSectionItem>
            </apex:pageblockSectionItem>            
            
            <apex:pageblockSectionItem >
                <apex:outputlink value="#" target="_blank">CC:</apex:outputlink>
                <apex:pageBlockSectionItem >  
                    <apex:inputTextArea value="{!cc}" cols="62" id="p4" rows="2" title="CC" styleClass="p4" />              
                    <apex:outputlink value="javascript: openPopup('/_ui/core/email/author/EmailCCBccLookup?id={!opptyId}', 'CCBCCLookup', 420, 490, 'width=420,height=490,toolbar=no,status=no,directories=no,menubar=no,resizable=yes,scrollable=no', true);" id="p4_lkwgt" onclick="setLastMousePosition(event)" title="CC Lookup (New Window)">
                        <img src="/s.gif" alt="CC Lookup (New Window)" class="lookupIcon" onblur="this.className = 'lookupIcon';" onfocus="this.className = 'lookupIconOn';" onmouseout="this.className = 'lookupIcon';this.className = 'lookupIcon';" onmouseover="this.className = 'lookupIconOn';this.className = 'lookupIconOn';" title="CC Lookup (New Window)" />
                    </apex:outputlink>
                </apex:pageBlockSectionItem>
            </apex:pageblockSectionItem>
           
            <apex:pageBlockSectionItem >
                <apex:outputlink value="#" target="_blank">BCC:</apex:outputlink>
                <apex:pageBlockSectionItem>
                    <apex:inputTextArea value="{!bcc}" cols="62" id="p5" rows="2" title="BCC" styleClass="p5" />                
                    <apex:outputlink value="javascript: openPopup('/_ui/core/email/author/EmailCCBccLookup?id={!opptyId}', 'CCBCCLookup', 420, 490, 'width=420,height=490,toolbar=no,status=no,directories=no,menubar=no,resizable=yes,scrollable=no', true);" id="p5_lkwgt" onclick="setLastMousePosition(event)" title="BCC Lookup (New Window)">
                        <img src="/s.gif" alt="BCC Lookup (New Window)" class="lookupIcon" onblur="this.className = 'lookupIcon';" onfocus="this.className = 'lookupIconOn';" onmouseout="this.className = 'lookupIcon';this.className = 'lookupIcon';" onmouseover="this.className = 'lookupIconOn';this.className = 'lookupIconOn';" title="BCC Lookup (New Window)" />
                    </apex:outputlink>
                </apex:pageBlockSectionItem>
            </apex:pageBlockSectionItem>
            
            <apex:pageblockSectionItem >
                <apex:outputLabel value="Subject" styleClass="bld"/>
                <apex:outputpanel layout="block" styleClass="requiredInput">
                    <apex:outputpanel layout="block" styleClass="requiredBlock"/>
                    <apex:inputText value="{!subject}" maxlength="100" size="70"/>
                </apex:outputpanel>    
            </apex:pageblockSectionItem>
            
            <apex:pageblockSectionItem >
                <apex:outputLabel value="Message" styleClass="bld"/>
                <apex:inputTextArea value="{!message}" rows="15" cols="93" richText="false"/>
            </apex:pageblockSectionItem>
            
        </apex:pageblockSection>
        
        <div id="test" style="width: 500px; margin: 20px 0 0 19%;">
            <select id="attS" name="attS" style="width: 400px;">
                <apex:repeat value="{!attachments}" var="att" id="theRepeat">
                    <option value="{!att.Id}##{!att.BodyLength}">{!att.Name}</option>
                </apex:repeat>
            </select>
           <input value="Attach File" class="btn" id="attachFile" name="attachFile" onclick="attachPhxAttachment(event)" type="button" />
           <div style="margin: 10px 0 0 0;">
               <input style="display:none;" value="Attach File" class="btn" title="Attach File (New Window)" id="attach" name="attach" onclick="openDocumentUpload(event)" type="button" />
           </div>
       </div>
    </apex:pageblock> 

Attachments

 ActionFileSizeDel{!att2.Name}{!att2.BodyLength} bytesApex controller:public class EmailOpportunityAttachment{
public String to {get;set;}
public String additionalTo {get;set;}
public String relatedTo {get;set;}
public String cc {get;set;}
public String bcc {get;set;}
public String ffrom {get;set;}
public String message {get;set;}
public String subject {get;set;}
public String errorMsg{get;set;} 
public String successMsg{get;set;}
public List<String> addresses {get;set;}
public String opptyId {get;set;}
public String accountId {get;set;}
public String attachmentIds {get;set;}
public boolean flagToSendMail;
private static final String DEL = ';';
    

public EmailOpportunityAttachment(){
    this.opptyId = ApexPages.currentPage().getParameters().get('opptyId');
    this.accountId = ApexPages.currentPage().getParameters().get('accountId');
}

public List<SelectOption> contacts {
    get {
        List<SelectOption> contacts = new List<SelectOption>();
        List<Contact> cnts = [select Id, Name, Email from Contact where Account.Id =: this.accountid];
        for (Contact cnt: cnts) {
            contacts.add(new SelectOption(cnt.Id, '"' + cnt.Name + '" <' + cnt.Email + '>'));
        }
    return contacts;
    }
    set;
}


public Attachment[] getAttachments(){
  return  [select id, Name, BodyLength, Body from Attachment where parent.id =: this.opptyId];
}

public List<Attachment> getAttachmentsByIds(final String[] ids){
    String sql = ' select Id, Name, Body, ContentType from Attachment where Name=\'DDDDDDDDDDDDDD\' ';
    boolean found = false;
    if(null != ids && ids.size() > 0){
        for(String id: ids){
            sql += ' OR Id=';
            sql += '\'';
            sql += id;
            sql += '\'';
        }            
        found = true;
    }
    //System.debug(sql);
    return found ? (List<Attachment>)Database.query(sql) : null;
}


public String getEmailByUserName(final String userName){
  return [select Email from Contact where Name =: userName limit 1].Email;
}

public PageReference sendEmail() {
    PageReference pageRef = new PageReference('/'+this.opptyId);
            
    if(subject == '' || message == ''){
        errorMsg = 'Please enter subject and message.';
        return null;
    }
    
    if(to != '' || additionalTo != '' || cc != '' || bcc != ''){
        List<String> toAddresses = new List<String>();
        List<String> ccAddresses = new List<String>();
        List<String> bccAddresses = new List<String>();

        List<String> tmpAddr = new List<String>();
        if(additionalTo.contains(DEL)){
            toAddresses = additionalTo.split(DEL);
            for(String tmp:toAddresses){
                tmpAddr.add(tmp);
            }
        }else if(additionalTo != '') {
            toAddresses.add(additionalTo);
            tmpAddr.add(additionalTo);
        }
        
        if(to != ''){
            final String emailAddr = getEmailByUserName(to);
            toAddresses.add(emailAddr);
            tmpAddr.add(emailAddr);
        }
        
        if(cc.contains(DEL)){
            ccAddresses = cc.split(DEL);
            for(String tmp:ccAddresses){
                tmpAddr.add(tmp);
            }
        }else if(cc != ''){
            ccAddresses.add(cc);
            tmpAddr.add(cc);
        }
        if(bcc.contains(DEL)){
            bccAddresses = bcc.split(DEL);
            for(String tmp:bccAddresses){
                tmpAddr.add(tmp);
            }
        }else if(bcc != ''){
            bccAddresses.add(bcc);
            tmpAddr.add(bcc);
        }

        /* Checking whether mail ids are valid */
        addresses = tmpAddr;
        for(String tempStr:addresses){
            if(!Pattern.matches('[a-zA-Z0-9._-]+@[a-zA-Z]+.[a-zA-Z]{2,4}', tempStr)){
                errorMsg = 'Check To, CC and BCC addresses';
                successMsg = '';
                flagToSendMail = false;      
                break;          
            }else{
                flagToSendMail = true;
            }           
        } 

        /* Sending Mail */
        if(flagToSendMail == true){
            Messaging.SingleEmailMessage email = new Messaging.SingleEmailMessage();
            if(toAddresses != null){
                email.setToAddresses(toAddresses);
            }
            if(ccAddresses != null){
                email.setccAddresses(ccAddresses);
            }
            if(bccAddresses != null){
                email.setbccAddresses(bccAddresses);
            }             
            email.setSubject(subject);  
            email.setHtmlBody(message);
            
            List<Messaging.EmailFileAttachment> attachs = null;
            
            if('' != attachmentIds){
                final String[] attachIds = attachmentIds.split(DEL);
                if(null != attachIds && attachIds.size() > 0){
                   final List<Attachment> attechments = getAttachmentsByIds(attachIds);
                    if(null != attechments && attechments.size() > 0){
                        attachs = new List<Messaging.EmailFileAttachment>();
                        Messaging.EmailFileAttachment attach = null;
                        for(Attachment att: attechments){
                            attach = new Messaging.EmailFileAttachment();
                            attach.setContentType(att.contentType);
                            attach.setFileName(att.Name);
                            attach.setInline(false);
                            attach.setBody(att.Body);
                            attachs.add(attach);
                            attach = null;
                        }
                    }                        
                }
            }
     
            if(null != attachs && attachs.size() > 0){
                email.setFileAttachments(attachs);
            }
                            
            Messaging.sendEmail(new Messaging.SingleEmailMessage[]{email});

            errorMsg = '';
            successMsg = 'Mail sent successfully to following recipients';
            return pageRef; 
        }else{
            return null;
        }
    }else{
        errorMsg = 'Please enter To or CC or BCC address';
        return null;
    }
}

}

Source Link

I found a solution. I created a custom "Send an Email" apex page there a user can choose any of opportunity attachment and send it via email, for this functionality I have created an apex controller that can send an email with the attachments.