Get Visual Force Page Element By document.getElementById In Javascript

Some time we try to get element of apex page (Element created by apex tag)  in javascript by their Id.
But we know element which is created apex tag have their on own prefix eg:

<apex:inputText value="{!Test}" id="TEXTELEMENT" />

We know when ever we try to get the html element in java script we will write :

var e = getElementById('TEXTELEMENT') ;

but we get error as apex visual force add the parent element id as suffix in the "TEXTELEMENT" .
eg:-

jdi:ooa TEXTELEMENT

So there is a small function which is not written by me but when I try to find I got this which I am sharing with all us.

  function getApexElementByID(tagname, eid) {
            var tags = document.getElementsByTagName(tagname); //get a bunch of tags.
            var regex = new RegExp(":" + eid + "$");
            for (var i=0; i < tags.length; i++) {
                if (tags[i].getAttribute("id") != null) {
                    var idVal = tags[i].getAttribute("id");
                    var pos = idVal.search(regex);
                    if (pos != -1) return tags[i];
                }
            }
            return null;
        }
This function return that element those id we will pass as a second parameter. The first parameter is for element type.

eg : var myElement  = getApexElementByID('input','TEXTELEMENT ');


I think you will like it.

Quick Access menu for Visual Force pages

Hi Developers,

1. I think some of us aware about Quick Access Menu (QAM) on record detail page and on object tab page.
2. But it is wondering for me if I can access this Quick Access menu on our Visual Force Page also.
3. So I tried a lot to get this QAM on VFP by any setting but in salesforce there is no option for that so I Create Custom  QMA Component to fullfill my requirment. So I am sharing compontent.

My Page On which QMA Will show: -

<apex:page standardController="SalesForceApp__c"   showChat="false" showHeader="false" sidebar="false" standardStylesheets="false" >
       <c:SideSliderCom componentInf="pageBlockSectionItem,pageBlock,pageBlockSection," />
       <apex:pageBlock >
           <apex:pageBlockSection >
              <apex:pageBlockSectionItem ></apex:pageBlockSectionItem>
          </apex:pageBlockSection>
       </apex:pageBlock>
</apex:page>

Compoent SideSliderCom code: 

<apex:component controller="ComponentControllerSlide">
 <apex:attribute type="string" name="componentInf" description="provide compent name and get info that info" assignTo="{!ComponentName}"/>

 <Style>
 Please Add the style. Style code also proivide in the My Bolg.
 </style>
 
 
 <script>
    function HideShowHandle(){
       var d = document.getElementById('devSlide1');
       if(d.className =='')
       {
           d.style.right='-2px';
           d.className ='expanded';
       }
       else if(d.className =='expanded'){
           d.style.right='-230px';
           d.className ='';
       }
    }
</script>
    
<div id="devSlide1" style="display: block; right: -230px;background: rgb(226, 13, 13);" class="">
    <div class="handle" onclick="HideShowHandle()">
        <img src="/s.gif" alt="Collapse Force.com Quick Access Menu" class="menuArrow1" onblur="this.className = 'menuArrow1';" onfocus="this.className = 'menuArrowOn1';" onmouseout="this.className = 'menuArrow1';" onmouseover="this.className = 'menuArrowOn1';" title="Collapse Force.com Quick Access Menu"/>
    </div>
    <div class="slideContainer">
        <div class="header">
            <a href="/setup/forcecomHomepage.apexp" TARGET="_BLANK" title="Setup" id="forceLogoLink">
                <img src="/s.gif" alt="Go to Setup" class="forceLogo" onblur="this.className = 'forceLogo';" onfocus="this.className = 'forceLogoOn';" onmouseout="this.className = 'forceLogo';" onmouseover="this.className = 'forceLogoOn';" title="Go to Setup"/>
            </a>
            <a href="" title="Help" style="float: right;margin-top: 5px;">
                <img src="/s.gif" alt="Help" class="helpIcon" title="Help"/>
            </a>
        </div>
        <div class="slideBody">
            <ul class="slideList">
                <apex:repeat value="{!myLinks}" var="t">
                <li class="">
                <apex:outputPanel rendered="{!if(t.ActiveUrl==true,'true','false')}">
                    <a class="toolLink" href="{!t.UrlLink}" title="" target="_blank">{!t.LinkTitle}</a>
                    <div class="clearingBox"></div>
                </apex:outPutPanel>
                <apex:outputPanel rendered="{!if(t.ActiveUrl==false,'true','false')}">
                    <div><span style="margin-left: 3%;color: green;font-size: 17px;">{!t.UrlLink}</span>&nbsp;<span style="color:red"> {!t.LinkTitle}</span></div>
                </apex:outPutPanel>
                </li>
                <hr class="divider"/>
                </apex:repeat>
            </ul>
            
      </div>
        <div class="footer">
           <a href="http://salesforcenow.blogspot.in/" style="color:white" target="_blank">Ashlekh Gera</a>
       </div>
   </div>
</div>
    
</apex:component>

Style Code which have to add in Component or write style code in file and than 

include that  file in component.

<style> 
 #devSlide1{position:fixed;width:270px;top:160px;right:-230px;z-index:7;-webkit-transition:all 0.5s ease-out;-moz-transition:all 0.5s ease-out;-transition:all 0.5s ease-out;display:none}
 #devSlide1 .handle{position:absolute;width:20px;top:0;left:20px;background-color:#226B86;border-width:4px;border-style:solid;border-right-style:none;border-color:#FFF;padding:7px 0;padding-right:2px;text-align:left;color:white;-moz-border-radius-topleft:5px;-moz-border-radius-bottomleft:5px;border-top-left-radius:5px;border-bottom-left-radius:5px;-moz-box-shadow:-2px 0 2px #A0A6AB;box-shadow:-2px 0 2px #A0A6AB;z-index:10}
 #devSlide1 .header{padding-bottom:2px}
 #devSlide1 .slideContainer{position:absolute;right:-2px;top:0;width:210px;background-color:#226B86;border:4px solid #FFF;padding:6px;padding-top:3px;margin:0;-moz-border-radius-bottomleft:5px;border-bottom-radius-left:5px;-moz-box-shadow:0 0 2px #A0A6AB;-webkit-box-shadow:0 0 2px #A0A6AB;box-shadow:0 0 2px #A0A6AB;z-index:9}
 #devSlide1 .slideBody{background-color:white;-moz-border-radius:5px;border-radius:5px;border:3px solid #FFF}
 #devSlide1 .slideList{background-color:white;margin:0;padding:0}#devSlide1 hr{margin-left:3px;margin-right:3px;clear:both;color:#ccc}
 #devSlide1 .slideList li{list-style-type:none;margin:1px;-moz-border-radius:9x;border-radius:9px;clear:both}
 #devSlide1 .slideList li a{line-height:1.3em;padding:5px}
 #devSlide1 .helpIcon{background:transparent url(/img/alohaSkin/help_grey.png) no-repeat}
 #devSlide1 .slideList li.hover{background-color:#cfeef8}#devSlide1 .slideList li.hover .toolLink{text-decoration:underline}
 #devSlide1 .slideList li.hover .toolNewLink{text-decoration:none}
 #devSlide1 .toolLink{color:#096186;text-decoration:none;float:left}
 #devSlide1 .toolNewLink{color:#096186;margin-left:3px;padding-left:2px;display:none;float:right}
 #devSlide1 .toolNewLink img{margin-right:2px;vertical-align:text-bottom}
 #devSlide1 .hover .toolNewLink{display:block}
 #devSlide1 .footer{text-align:right;padding:3px 1px}
 #devSlide1.footer a{color:white;font-weight:bold;text-decoration:none}
 #devSlide1 .footer a:hover{text-decoration:underline}
 #devSlide1 .helpLink{float:right;margin-top:5px}
 .menuArrow1{background-image:url(/img/dcm/menuArrow_sprite.gif);background-position:0 0;width:16px;height:20px;background-position:0 0}
.menuArrowOn1{background-image:url(/img/dcm/menuArrow_sprite.gif);background-position:0 0;width:16px;height:20px;background-position:0 -20px}
.expanded .menuArrow1{background-image:url(/img/dcm/menuArrow_sprite.gif);background-position:0 0;width:16px;height:20px;background-position:0 -40px}
.expanded .menuArrowOn1{background-image:url(/img/dcm/menuArrow_sprite.gif);background-position:0 0;width:16px;height:20px;background-position:0 -60px}
.rtl .menuArrow1{background-image:url(/img/dcm/menuArrow_sprite.gif);background-position:0 0;width:16px;height:20px;background-position:0 -40px}
.rtl .menuArrowOn1{background-image:url(/img/dcm/menuArrow_sprite.gif);background-position:0 0;width:16px;height:20px;background-position:0 -60px}
.expanded .rtl .menuArrow1{background-image:url(/img/dcm/menuArrow_sprite.gif);background-position:0 0;width:16px;height:20px;background-position:0 0}
.expanded .rtl .menuArrowOn1{background-image:url(/img/dcm/menuArrow_sprite.gif);background-position:0 0;width:16px;height:20px;background-position:0 -20px}
.forceLogo{background-image:url(/img/forceMenuLogo.gif);background-position:0 0;width:91px;height:31px;background-position:0 0}
.forceLogoOn,a#forceLogoLink:focus .forceLogo{background-image:url(/img/forceMenuLogo.gif);background-position:0 0;width:91px;height:31px;background-position:0 -31px}
.helpIcon{background:transparent url(/img/alohaSkin/help_orange.png) no-repeat;vertical-align:bottom}
.infoIcon{background-image:url(/img/alohaSkin/info_sprite.png);background-position:left top;height:15px}
.zen ul,.zen ol,.zen li,.zen h1,.zen h2,.zen h3,.zen h4,.zen h6,.zen form,.zen fieldset,.zen legend,.zen input,.zen textarea,.zen p,.zen blockquote{margin:0;padding:0}.zen h1,.zen h2,.zen h3,.zen h4,.zen h5,.zen h6{display:block}.zen li{list-style:none}.zen table{border-collapse:collapse;border-spacing:0}.zen fieldset,.zen img{border:0}.zen input,.zen textarea,.zen select{font-family:inherit;font-size:inherit;font-weight:inherit}.zen legend{color:#222}.zen a{color:#015BA7;text-decoration:none}.zen-headerTop a{color:#015BA7;text-decoration:none}.zen-headerTop a:hover,.zen-headerTop a:focus{text-decoration:underline}.zen .zen-line:after{clear:both;display:block;visibility:hidden;overflow:hidden;height:0 !important;line-height:0;content:"."}.zen .zen-unit,.zen .zen-start{float:left}.zen .zen-unitExt,.zen .zen-end{float:right}.zen .zen-size1of1{float:none}.zen .zen-size1of2{width:50%}.zen .zen-size1of3{width:33.33333%}.zen .zen-size2of3{width:66.66666%}.zen .zen-size1of4{width:25%}.zen .zen-size3of4{width:75%}.zen .zen-size1of5{width:20%}.zen .zen-size2of5{width:40%}.zen .zen-size3of5{width:60%}.zen .zen-size4of5{width:80%}.zen .zen-lastUnit{float:none;display:table-cell;width:9999em}.zen .zen-body{display:table;vertical-align:top}.zen .zen-body,.zen .zen-footer,.zen .zen-header{display:table;width:100%;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}.zen .zen-body.zen-cropH,.zen .zen-body.zen-cropMe{display:block}.zen .zen-footer{text-align:center}.zen .zen-inner:after,.zen .zen-header:after,.zen .zen-body:after,.zen .zen-footer:after{clear:both;display:block;visibility:hidden;overflow:hidden;height:0 !important;line-height:0;content:"."}.zen .zen-inner{position:relative}.zen .zen-arrow{display:block;background-repeat:no-repeat;font-size:.01em;position:relative;z-index:10}.zen .zen-basic{-moz-border-radius:7px;border-radius:7px;background-color:#fff}.zen .zen-basic .zen-header{-moz-border-radius-topleft:7px;-moz-border-radius-topright:7px;border-top-left-radius:7px;border-top-right-radius:7px}.zen .zen-simple{border:1px solid #eaeaea;-moz-border-radius:4px;border-radius:4px}.zen .zen-faq .zen-topRight{background-image:url(/img/oocss/box_faq_folded_corner.png);background-color:#fff;width:18px;height:18px}.zen .zen-themed{border:1px solid #eaeaea;-moz-border-radius:4px;border-radius:4px;border-top-width:3px}.zen .zen-chart{border:2px solid #dcdcdc;-moz-border-radius:0;border-radius:0}.zen .zen-stats{-moz-border-radius:8px;border-radius:8px;border:1px solid #eaeaea}.zen .zen-instructions{border:1px solid #eaeaea;-moz-border-radius:0;border-radius:0}.zen .zen-chattyBackground{background:#fff5db;background:-moz-linear-gradient(top,#fff5db 0,#ffe5a9 100%);background:-webkit-linear-gradient(top,#fff5db 0,#ffe5a9 100%);background:-ms-linear-gradient(top,#fff5db 0,#ffe5a9 100%)}.zen .zen-standardBackground{background-color:#f8f8f8}.zen .zen-wizardBackground{color:#fff;background-color:#1797c0}.zen .zen-instructionsBackground{background-color:#ffc}.zen .zen-chartBackground{background-color:#dcdcdc}.zen .zen-recycleBackground{background-color:#dcfbdc}.zen .zen-alertBackground{background-color:#fdedea}.zen .zen-warnBackground{background-color:#ffffdc}.zen .zen-confirmBackground{background-color:#edfff1}.zen .zen-infoBackground{background-color:#f5fcff}.zen .zen-faqBackground{background:-moz-linear-gradient(top,#fff7c1,#fff 60px);background:-webkit-linear-gradient(top,#fff7c1,#fff 60px);background:-ms-linear-gradient(top,#fff7c1,#fff 60px)}.zen .zen-innerBackground{background-color:#fff}.zen .zen-header .zen-boxHeading{font-size:1.167em}.zen .zen-pageBoxHeader{border-bottom:1px solid #fff;-moz-box-shadow:inset 0 -1px 0 #dbdbdb;-webkit-box-shadow:inset 0 -1px 0 #dbdbdb;box-shadow:inset 0 -1px 0 #dbdbdb}.zen .zen-stepsHeader{background-color:#fff9d6;border-bottom:1px solid #dbdbdb}.zen .zen-stepsHeader .zen-boxHeading{font-size:1.083em}.zen .zen-importHeader{background-color:#7b80b9;border-bottom:1px solid #767cB6}.zen .zen-importHeader .zen-boxHeading{color:#fff;font-size:1.083em}.zen .zen-chartHeader{background-color:#dcdcdc}.zen .zen-chartHeader .zen-boxHeading{color:#30519d;font-size:1.083em}.zen .zen-popHeader{background-color:#ebeeef;background:-moz-linear-gradient(top,#fdfdfd 0,#ebeeef 100%);background:-webkit-linear-gradient(top,#fdfdfd 0,#ebeeef 100%);background:-ms-linear-gradient(top,#fdfdfd 0,#ebeeef 100%)}.zen .simpleHeader{color:#000;font-weight:bold;font-size:1em}.zen .zen-simpleHeader .zen-boxHeading{font-size:1em}.zen .zen-themed .zen-boxHeading{font-size:1.167em}.zen .zen-emphasisHeader .zen-boxHeading{font-size:1.3em;color:000;font-weight:bold}.zen .zen-pageBoxFooter{border-top:1px solid #dbdbdb;-moz-box-shadow:inset 0 1px 0 #fff;-webkit-box-shadow:inset 0 1px 0 #fff;box-shadow:inset 0 1px 0 #fff}.zen .zen-quickHeader .zen-boxHeading{color:#fff;font-size:1em}.zen .zen-quick .zen-header,.zen .zen-quick .zen-body{padding:0 9px;-moz-border-radius:7px;border-radius:7px;background-color:#1797c0}.zen .zen-quick .zen-body{background-color:#cfeef8;margin-top:3px}.overlayDialog .zen-boxHeading{margin:0}.zen .zen-message{border:1px solid #000;background-color:#E2E2E2;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;-moz-box-shadow:inset 0 3px 0 -2px #FFF;-webkit-box-shadow:inset 0 3px 0 -2px #FFF;box-shadow:inset 0 3px 0 -2px #FFF}.zen .zen-alert{border-color:#F2A199;background-color:#FDEDEA}.zen .zen-warn{border-color:#F8E38E;background-color:#FFFFDC}.zen .zen-confirm{border-color:#9BEBB3;background-color:#EDFFF1}.zen .zen-info{border-color:#BEE6FF;background-color:#F5FCFF}.zen .zen-toggle .zen-body{display:none}.zen .zen-toggleOpen .zen-body{display:block}.zen .zen-toggleArrow{float:left;display:block;width:0;height:0;border-style:solid;margin-right:10px;margin-top:2px}.zen .zen-toggleOpen .zen-toggleArrow{margin-top:4px}.zen .zen-toggleArrow{border-width:5px;border-right-width:0;border-color:transparent;border-left-color:#464646}.zen .open .zen-toggleArrow{border-width:5px 5px 0 5px;border-color:#464646 transparent transparent}.zen .zen-toggle{border-top:3px solid #1797c0}.zen .zen-toggleShowAll{border-top:0}.zen .zen-toggleShowAll .zen-header{border-bottom:1px solid gray}.zen .zen-tabs .zen-header{z-index:5;padding:0;position:relative;overflow:visible}.zen .zen-tabs .zen-header:after{content:""}.zen .zen-tabs .zen-header ul{padding:0 5px;margin:0}.zen .zen-tabs .zen-header li{float:left}.zen .zen-tabs .zen-body{position:relative;z-index:4;display:block}.zen .zen-tabControl a{display:inline-block;padding:7px 10px 3px 10px}.zen .zen-tabControl .zen-current{z-index:1;position:relative;top:4px}.zen .zen-tabControl .zen-current a{cursor:default}.zen .zen-tabs .zen-tabBody li{display:none}.zen .zen-tabs .zen-tabBody li li{display:block}.zen .zen-tabs .zen-tabBody .zen-current{display:block}.zen .zen-simpleTabs .zen-tabControl .zen-current{top:2px}.zen .zen-tabs a{font-weight:normal;color:#333}.zen .zen-tabs .zen-body{border:1px solid #eaeaea;-moz-border-radius:4px;border-radius:4px;border-top-width:3px;border-top-color:#1797c0;background-color:#f8f8f8}.zen .zen-tabControl a{text-decoration:none}.zen .zen-tabControl li{border:1px solid #e0e0e0;border-bottom:0;background-color:#efefef;-moz-border-radius-topleft:7px;-moz-border-radius-topright:7px;border-top-left-radius:7px;border-top-right-radius:7px;-moz-box-shadow:inset 0 0 2px #f6f6f6;-webkit-box-shadow:inset 0 0 2px #f6f6f6;box-shadow:inset 0 0 2px #f6f6f6}.zen .zen-tabControl .zen-current{background-color:#f7f7f7;-moz-box-shadow:2px -2px 2px #c8c8c8,-2px -2px 2px #c8c8c8,inset 0 3px 5px #e0e0e0;-webkit-box-shadow:2px -2px 2px #c8c8c8,-2px -2px 2px #c8c8c8,inset 0 3px 5px #e0e0e0;box-shadow:2px -2px 2px #c8c8c8,-2px -2px 2px #c8c8c8,inset 0 3px 5px #e0e0e0;border-width:0}.zen .zen-tabs .zen-header li:hover{background-color:#fff}.zen .zen-tabs .zen-header .zen-current:hover{background-color:#efefef}.zen .zen-simpleTabs .zen-body{border-top:1px solid #eaeaea}.zen .zen-callout{margin:5px;position:relative}.zen .zen-callout .zen-arrow{position:absolute;background-repeat:no-repeat}.zen .zen-callout .zen-inner{-moz-border-radius:5px;border-radius:5px;overflow:hidden}.zen .zen-sideNorth{margin-top:20px}.zen .zen-sideEast{margin-right:16px}.zen .zen-sideSouth{margin-bottom:16px}.zen .zen-sideWest{margin-left:16px}.zen .zen-sideNorth .zen-arrow,.zen .zen-sideSouth .zen-arrow{width:25px;height:16px}.zen .zen-sideEast .zen-arrow,.zen .zen-sideWest .zen-arrow{width:16px;height:25px}.zen .zen-sideNorth .zen-arrow{background-position:1px -91px;top:-14px}.zen .zen-sideEast .zen-arrow{background-position:1px -28px;right:-13px}.zen .zen-sideSouth .zen-arrow{background-position:2px -60px;bottom:-14px}.zen .zen-sideWest .zen-arrow{background-position:-2px 1px;left:-13px}.zen .zen-arrowLeft .zen-arrow{left:15px}.zen .zen-arrowCenter .zen-arrow{left:50%;margin-left:-13px}.zen .zen-arrowRight .zen-arrow{right:15px}.zen .zen-arrowTop .zen-arrow{top:15px}.zen .zen-arrowMiddle .zen-arrow{top:50%;margin-top:-13px}.zen .zen-arrowBottom .zen-arrow{bottom:15px}.zen .zen-callout{border:1px solid #c1C1C1;background-color:#fff;-moz-border-radius:5px;border-radius:5px;-moz-box-shadow:0 2px 5px #a0a6ab;-webkit-box-shadow:0 2px 5px #a0a6ab;box-shadow:0 2px 5px #a0a6ab}.zen .zen-callout .zen-arrow{background-image:url(/img/sprites/callout_arrows.png)}.zen .zen-hasActionsInHead .zen-header,.zen .zen-hasActionsInFoot .zen-footer{background-color:#e9eaea}.zen .zen-hasActionsInHead .zen-arrow{background-position:1px -119px}.zen .zen-hasActionsInFoot .zen-arrow{background-position:1px -148px}.zen .zen-guidedTour .zen-arrow{background-image:url(/img/sprites/callout_arrows_guided_tours.png)}.zen .zen-guidedTour .zen-inner{border:2px solid #fff;background-color:#fedF95}.zen .zen-callout .chatterHover{min-width:272px;padding:10px}.zen .zen-callout .chatterHover .zen-mediaBody{width:auto;max-width:191px}.zen .zen-callout .chatterHover .name{font-size:1.2em;color:#015ba7}.zen .zen-media:after,.zen .zen-mediaBody:after{clear:both;display:block;visibility:hidden;overflow:hidden;height:0 !important;line-height:0;content:"."}.zen .zen-mediaBody{display:table-cell;width:1000em}.zen .zen-img{float:left;background-repeat:no-repeat;margin-right:10px}.zen .zen-img img{display:block}.zen .zen-imgExt{float:right;margin-left:10px}.zen .zen-mediaExt{white-space:nowrap}.zen .zen-mediaExt,.zen .zen-mediaExt .zen-img,.zen .zen-mediaExt img,.zen .zen-mediaExt .zen-imgExt,.zen .zen-mediaExt .zen-mediaBody{display:inline;display:inline-block;vertical-align:middle;width:auto}.zen .zen-mediaExt:after,.zen .zen-mediaExt .zen-mediaBody:after{content:""}.zen .zen-mediaExt .zen-img{margin:0;margin-right:5px;float:none}.zen .zen-mediaExt .zen-imgExt{margin:0;margin-left:5px;float:none}.zen .zen-mediaExt a,.zen .zen-mediaExt img{vertical-align:middle;display:inline}.zen .zen-label,.zen .zen-form label{color:#4a4a56;font-size:.917em;font-weight:bold}.zen .zen-form label,.zen .zen-form .zen-label{width:200px;display:inline-block;text-align:right;vertical-align:middle;margin-top:5px;margin-right:20px;float:left;clear:left}.zen .zen-form:before,.zen .zen-form:after{content:"";display:table}.zen .zen-form:after{clear:both}.zen .zen-labelSmall label,.zen .zen-labelSmall .zen-label{width:65px}.zen .zen-labelMedium label,.zen .zen-labelMedium .zen-label{width:120px}.zen .zen-labelLarge label,.zen .zen-labelLarge .zen-label{width:280px}.zen .zen-inlineForm .zen-label,.zen .zen-inlineForm label{width:auto;margin-right:5px}.zen .zen-skinnyForm .zen-label,.zen .zen-skinnyForm label{width:auto;display:block;text-align:left;float:none;margin-bottom:2px}.zen .zen-skinnyForm .zen-help{margin-left:5px}.zen .zen-formBody{display:inline-block}.zen .zen-input{box-sizing:border-box;padding:3px;margin:1px 0}.zen .zen-inputTiny{width:30px}.zen .zen-inputSmall{width:150px}.zen .zen-inputMedium{width:250px}.zen .zen-inputLarge{width:350px}.zen .zen-inputFull{width:100%}.zen .zen-form textarea{vertical-align:top;padding:4px;box-sizing:border-box}.zen .zen-form .zen-input,.zen .zen-form textarea{-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px;-moz-box-shadow:inset 0 1px 0 #c3c3c3;-webkit-box-shadow:inset 0 1px 0 #c3c3c3;box-shadow:inset 0 1px 0 #c3c3c3;border:1px solid gray;border-color:#7c7c7c #c3c3c3 #ddd}.zen .zen-form .zen-requiredMark{color:#C00;padding-right:1px}.zen .zen-help{margin-top:3px;clear:left;color:#767676}.zen .zen-errorMessage{color:#d74c3b;margin-top:3px}.zen .zen-formFieldInfo{vertical-align:top;margin-top:4px}.zen .zen-formFieldAction{margin:4px;position:relative}.zen .zen-formFieldAction img{vertical-align:middle}.zen .zen-formFieldAction:active{bottom:-1px}.zen .zen-checkGroup label{float:none;width:auto;text-align:left;margin-top:0;font-weight:normal}.zen .zen-checkGroup>ul{margin-top:0;margin-bottom:0}.zen .zen-progress{display:inline-block;-moz-border-radius:7px;-webkit-border-radius:7px;border-radius:7px;background-color:#ccc;-moz-box-shadow:inset 1px 1px 3px #8d8d8d;-webkit-box-shadow:inset 1px 1px 3px #8d8d8d;box-shadow:inset 1px 1px 3px #8d8d8d;width:50px}.zen .zen-value{display:inline-block;-moz-border-radius:7px;-webkit-border-radius:7px;border-radius:7px;-moz-box-shadow:inset 1px 1px 3px #8d8d8d;-webkit-box-shadow:inset 1px 1px 3px #8d8d8d;box-shadow:inset 1px 1px 3px #8d8d8d;visibility:hidden}.zen .zen-valueNotOk{width:25%;background-color:#c33929;visibility:visible}.zen .zen-valueOk{width:50%;background-color:#f8c933;visibility:visible}.zen .zen-valueStrong{width:100%;background-color:#74c205;visibility:visible}.zen .zen-field{margin:10px 0}.zen .zen-fieldSmall{margin:5px 0}.zen .zen-fieldMedium{margin:16px 0}.zen .zen-fieldLarge{margin:22px 0}.zen .zen-select{width:200px;position:relative;margin:0 10px;z-index:99}.zen .zen-select .zen-trigger{text-align:left;display:block}.zen .zen-select .zen-selectArrow{float:right;display:block;width:0;height:0;margin-top:5px}.zen .zen-options{position:absolute;top:100%;left:3px;margin:0;display:none;overflow:hidden}.zen .zen-open .zen-options{display:block}.zen .zen-options a{display:block;padding:3px}.zen .zen-select .zen-selectArrow{border-style:solid;border-width:5px 4px 0;border-color:#fff transparent transparent}.zen .zen-options{border:1px solid #4997bf;background-color :#fff;-moz-box-shadow:0 0 4px #b1b2b4;-webkit-box-shadow:0 0 4px #b1b2b4;box-shadow:0 0 4px #b1b2b4;width:192px}.zen .zen-select.zen-open{z-index:100}.zen .zen-open .zen-options{display:block}.zen .zen-options a{color:#000;text-decoration:none}.zen .zen-options a:hover,.zen .zen-options a:focus{color:#015ba7;background-color:#e3f3ff;text-decoration:none;outline:none}.zen .zen-options .zen-disabled{color:#c2c2c2}.zen h1 strong,.zen .h1 strong{display:block;padding-left:1px}.zen .zen-inlineHeading{margin:0;display:inline-block}.zen h1,.zen h2,.zen h3,.zen h4,.zen h5,.zen h6,.zen .zen-h1,.zen .zen-h2,.zen .zen-h3,.zen .zen-h4,.zen .zen-h5,.zen .zen-h6{font-weight:bold}.zen h1,.zen .zen-h1{font-size:1.833em;font-weight:normal}.zen h1 strong,.zen .zen-h1 strong{font-size:.5em;font-weight:bold;margin-bottom:-3px}.zen h2,.zen .zen-h2{font-size:1.667em}.zen h3,.zen .zen-h3{font-size:1.5em}.zen h4,.zen .zen-h4{font-size:1.333em}.zen h5,.zen .zen-h5{font-size:1.167em}.zen h6,.zen .zen-h6{font-size:1em}.zen h1,.zen h2,.zen h3,.zen h4,.zen h5,.zen h6,.zen dl,.zen p,.zen blockquote,.zen .zen-box,.zen pre{margin:10px 0}.zen .zen-header h1,.zen .zen-header h2,.zen .zen-header h3,.zen .zen-header h4,.zen .zen-header h5,.zen .zen-header h6{margin:5px 0}.zen h1,.zen h2,.zen h3,.zen h4,.zen h5,.zen h6,.zen img{padding-bottom:0}.zen table h1,.zen table h2,.zen table h3,.zen table h4,.zen table h5,.zen table h6,.zen table p,.zen table ul,.zen table ol,.zen table dl{padding:0}.zen .zen-header,.zen .zen-body,.zen .zen-footer,.zen .zen-intro{padding:0 7px}.zen .zen-ptn,.zen .zen-pvn,.zen .zen-pan{padding-top:0 !important}.zen .zen-pts,.zen .zen-pvs,.zen .zen-pas{padding-top:5px !important}.zen .zen-ptm,.zen .zen-pvm,.zen .zen-pam{padding-top:10px !important}.zen .zen-ptl,.zen .zen-pvl,.zen .zen-pal{padding-top:20px !important}.zen .zen-prn,.zen .zen-phn,.zen .zen-pan{padding-right:0 !important}.zen .zen-prs,.zen .zen-phs,.zen .zen-pas{padding-right:5px !important}.zen .zen-prm,.zen .zen-phm,.zen .zen-pam{padding-right:10px !important}.zen .zen-prl,.zen .zen-phl,.zen .zen-pal{padding-right:20px !important}.zen .zen-pbn,.zen .zen-pvn,.zen .zen-pan{padding-bottom:0 !important}.zen .zen-pbs,.zen .zen-pvs,.zen .zen-pas{padding-bottom:5px !important}.zen .zen-pbm,.zen .zen-pvm,.zen .zen-pam{padding-bottom:10px !important}.zen .zen-pbl,.zen .zen-pvl,.zen .zen-pal{padding-bottom:20px !important}.zen .zen-pln,.zen .zen-phn,.zen .zen-pan{padding-left:0 !important}.zen .zen-pls,.zen .zen-phs,.zen .zen-pas{padding-left:5px !important}.zen .zen-plm,.zen .zen-phm,.zen .zen-pam{padding-left:10px !important}.zen .zen-pll,.zen .zen-phl,.zen .zen-pal{padding-left:20px !important}.zen .zen-mtn,.zen .zen-mvn,.zen .zen-man{margin-top:0 !important}.zen .zen-mts,.zen .zen-mvs,.zen .zen-mas{margin-top:5px !important}.zen .zen-mtm,.zen .zen-mvm,.zen .zen-mam{margin-top:10px !important}.zen .zen-mtl,.zen .zen-mvl,.zen .zen-mal{margin-top:20px !important}.zen .zen-mrn,.zen .zen-mhn,.zen .zen-man{margin-right:0 !important}.zen .zen-mrs,.zen .zen-mhs,.zen .zen-mas{margin-right:5px !important}.zen .zen-mrm,.zen .zen-mhm,.zen .zen-mam{margin-right:10px !important}.zen .zen-mrl,.zen .zen-mhl,.zen .zen-mal{margin-right:20px !important}.zen .zen-mbn,.zen .zen-mvn,.zen .zen-man{margin-bottom:0 !important}.zen .zen-mbs,.zen .zen-mvs,.zen .zen-mas{margin-bottom:5px !important}.zen .zen-mbm,.zen .zen-mvm,.zen .zen-mam{margin-bottom:10px !important}.zen .zen-mbl,.zen .zen-mvl,.zen .zen-mal{margin-bottom:20px !important}.zen .zen-mln,.zen .zen-mhn,.zen .zen-man{margin-left:0 !important}.zen .zen-mls,.zen .zen-mhs,.zen .zen-mas{margin-left:5px !important}.zen .zen-mlm,.zen .zen-mhm,.zen .zen-mam{margin-left:10px !important}.zen .zen-mll,.zen .zen-mhl,.zen .zen-mal{margin-left:20px !important}.zen .zen-lowlight{}.zen .zen-midlight{font-weight:bold}.zen .zen-highlight{}.zen .zen-healthyPlanet{color:#360}.zen .zen-goToRecord{color:#222;font-weight:normal;text-decoration:underline}a.zen-goToRecord:hover{color:#2861a1}.zen strong{font-weight:bold}.zen em{font-style:italic}.zen .zen-date{color:gray;font-size:.917em}.zen .zen-note{color:gray;font-style:italic}.zen .zen-legal{font-size:.917em}.zen .zen-deemphasize{font-size:.917em}.zen .zen-list{margin:10px 0}.zen .zen-list li{padding:.2em 0}.zen .zen-inlineList li{display:inline-block;padding-right:.5em;vertical-align:top}.zen .zen-inlineListExt li{display:inline}.zen .zen-inlineListExt>li:after{content:"\2022";padding:0;padding-right:4px;padding-left:6px}.zen .zen-inlineListExt li:last-child:after{content:""}.zen .zen-commentList ul{clear:both}.zen .zen-commentList li{padding:4px}.zen .zen-commentList .zen-arrowUp{float:left;display:block;width:0;height:0;margin-left:10px}.zen .zen-breadcrumbList{padding:2px 0 0;font-size:.917em;display:inline-block}.zen .zen-breadcrumbList li{display:inline-block}.zen .zen-breadcrumbList li:before{content:"\003E";display:inline-block;padding:0;padding-right:7px;padding-left:4px}.zen .zen-breadcrumbList li:first-child:before{content:"";padding:0}.zen .zen-checkList li{margin:5px 0;padding-left:2em}.zen .zen-subcheckList{padding-left:3em}.zen .zen-subcheckList li{list-style:disc outside none;background:none;padding-left:0}.zen .zen-subcheckList .zen-done{text-align:left}.zen .zen-numberedList{padding-left:20px}.zen .zen-numberedList li{list-style:decimal outside;margin:3px 0}.zen .zen-bulletedList{padding-left:20px}.zen .zen-bulletedList li{list-style:disc outside;margin:3px 0}.zen .zen-ideaList ul{margin:4px}.zen .zen-ideaList li{padding:15px;padding-left:3px}.zen .zen-pipedList li{box-sizing:border-box;display:inline-block;padding:0 5px}.zen .zen-pipedList:before,.zen .zen-pipedList:after{content:"";display:table}.zen .zen-pipedList:after{clear:both}.zen .zen-pipedList .zen-img,.zen .zen-pipedList .zen-imgExt{float:none}.zen .zen-pipedList .zen-lastItem{position:relative;top:-1px}.zen .zen-detailList{overflow:auto}.zen .zen-detailList dt{padding-top:.3em;color:#4a4a56;font-weight:bold;font-size:.917em;width:200px;float:left;clear:left;padding-right:20px;text-align:right}.zen .zen-detailList dd{padding-top:.3em}.zen .zen-labelSmall dt{width:65px}.zen .zen-labelMedium dt{width:120px}.zen .zen-labelLarge dt{width:280px}.zen .zen-detailListExt dd{border-bottom:1px solid #ececec}.zen .zen-detailListExt dd,.zen .zen-detailListExt dt{padding-top:5px;padding-bottom:5px}.zen .zen-listSmall li{margin:5px 0}.zen .zen-listSmall dt,.zen .zen-listSmall dd{padding-top:5px;padding-bottom:5px}.zen .zen-listMedium li{margin:10px 0}.zen .zen-listMedium dt,.zen .zen-listMedium dd{padding-top:10px;padding-bottom:10px}.zen .zen-listLarge li{margin:20px 0}.zen .zen-listLarge dt,.zen .zen-listLarge dd{padding-top:20px;padding-bottom:20px}#rcCatcher{padding:1px;margin:1px;display:none !important;width:0 !important;height:0 !important}#rcCatcher{margin:3px}#rcCatcher{padding:2px}.zen .zen-commentList>ul{border-top:1px solid #dee5ea}.zen .zen-commentList>ul>li{border-top:1px solid #FFF;border-bottom:1px solid #dee5ea;background-color:#eff7fa;padding:5px;margin:0}.zen .zen-commentList .zen-arrowUp{padding-top:5px;border-style:solid;border-width:0 5px 5px 5px;border-color:transparent transparent #dee5ea}.zen .zen-breadcrumbList a{color:#797979}.zen .zen-checkList li{background:url(/img/oocss/dot.png) no-repeat}.zen .zen-checkList .zen-done{background-image:url(/img/chatter/wtdn_checked.png)}.zen .zen-subcheckList{color:#7d7d84}.zen .zen-subcheckList .zen-done{text-decoration:line-through;background:none}.zen .zen-subcheckList .zen-done a{color:#7d7d84}.zen .zen-ideaList li{border-bottom:1px solid #e9eaea}.zen .zen-ideaList li:last-child{border-bottom:0}.zen .zen-pipedList li{border-left:1px solid #7d7d84}.zen .zen-pipedList li:first-child,.zen .zen-pipedList .zen-firstItem{border-left:0}.zen .zen-hoverList li:hover,.zen .zen-hoverList li:focus{background-color:#e3f3ff}.zen .zen-hoverList a,.zen .zen-hoverList a:link{color:#000;text-decoration:none}.zen .zen-hoverList a:hover{color:#015ba7}.zen .zen-chatterList{margin-top:12px;margin-bottom:12px}.zen .zen-chatterList li{padding:4px}.zen .zen-chatterList .zen-chatterActive{background-color:#c4e7f2;-moz-border-top-left-radius:5px;-moz-border-bottom-left-radius:5px;border-top-left-radius:5px;border-bottom-left-radius:5px}.zen .zen-chatterFeedList>li{border-bottom:1px solid #e9eaea;padding-bottom:9px;padding-top:9px}.zen hr{height:0;border:0;margin:5px 0}.zen .zen-divider{border-top:1px dotted #d9d9d9}.zen .zen-dividerStrong{border-top:2px solid #000}.zen .zen-data{position:relative;zoom:1;text-align:left}.zen .zen-data table{width:100%}.zen .zen-data tr{vertical-align:top}.zen .zen-textCenter,.zen table .zen-textCenter,.zen table tr .zen-textCenter{text-align:center}.zen .zen-textLeft,.zen table .zen-textLeft,.zen table tr .zen-textLeft{text-align:left}.zen .zen-textRight,.zen table .zen-textRight,.zen table tr .zen-textRight{text-align:right}.zen .zen-textTop,.zen table .zen-textTop,.zen table tr .zen-textTop{vertical-align:top}.zen .zen-textBottom,.zen table .zen-textBottom,.zen table tr .zen-textBottom{vertical-align:bottom}.zen .zen-textMiddle,.zen table .zen-textMiddle,.zen table tr .zen-textMiddle{vertical-align:middle}.zen .zen-data th,.zen .zen-data td{padding:4px 7px}.zen .zen-data thead th,.zen .zen-data thead td{white-space:nowrap}.zen .zen-columnSort th,.zen .zen-columnSort td{border:1px solid #F2F3F3;border-top-width:0;border-left-width:0}.zen .zen-columnSort table{background-color:#fff;border:1px solid #c9dce2;border-right-width:0;border-bottom-width:0;border-top:3px solid #1797c0;-moz-border-radius:4px;border-radius:4px;border-collapse:separate}.zen .zen-themed .zen-inner .zen-columnSort table{border-top:1px solid #F2F3F3}.zen .zen-columnSort thead tr{background:#F2F3F3}.zen .zen-columnSort th.zen-sortable:hover{background:#E6EAEA;color:#015ba7}.zen .zen-columnSort .zen-sorted{background-color:#E0E3E6}.zen .zen-columnSort .zen-sorted:after{background-color:#E0E3E6;-moz-border-radius:7px;border-radius:7px;padding:1px 4px 2px;display:inline-block;margin-left:5px}.zen .zen-columnSort .zen-ascending:after{content:"\2191"}.zen .zen-columnSort .zen-descending:after{content:"\2193";color:#222}.zen .zen-columnSort thead .zen-selected{display:block;border:1px solid #55C8ed;-moz-border-radius:3px;border-radius:3px;background-color:#E0E3E6;color:#015ba7;margin:1px;margin-right:0}.zen .zen-columnSort tfoot tr{background:#fefefe;background:-moz-linear-gradient(top,#fefefe 0,#f6f5f5 100%);background:-webkit-linear-gradient(top,#fefefe 0,#f6f5f5 100%);background:-ms-linear-gradient(top,#fefefe 0,#f6f5f5 100%)}.zen .zen-columnSort tfoot td{border-right:0}.zen .zen-columnSort tfoot td:last-child{border-right:1px solid #c9dce2}.zen .zen-columnSort table :first-child tr:first-child th:first-child,.zen .zen-columnSort table :first-child tr:first-child td:first-child{-moz-border-radius-topleft:4px;border-top-left-radius:4px}.zen .zen-columnSort table :first-child tr:first-child th:last-child,.zen .zen-columnSort table :first-child tr:first-child td:last-child{-moz-border-radius-topright:4px;border-top-right-radius:4px}.zen .zen-columnSort table :last-child tr:last-child th:first-child,.zen .zen-columnSort table :last-child tr:last-child td:first-child{-moz-border-radius-bottomleft:4px;border-bottom-left-radius:4px}.zen .zen-columnSort table :last-child tr:last-child th:last-child,.zen .zen-columnSort table :last-child tr:last-child td:last-child{-moz-border-radius-bottomright:4px;border-bottom-right-radius:4px}.zen .zen-detailTable th{text-align:right;font-weight:bold;width:33%;padding:5px 10px 5px 2px}.zen .zen-detailTable td{padding:5px 2px 5px 10px}.zen .zen-detailTable tr{border-bottom:1px solid #ececec}.zen .zen-detailTable tr:last-child{border-bottom:0}.zen .zen-btn{overflow:visible;cursor:pointer;display:inline-block;position:relative;padding:2px 3px;margin:1px}.zen .zen-btn:active{bottom:-1px}.zen .zen-closeBtn{height:16px;line-height:16px;width:16px;display:block;text-align:center;padding:0;margin:0}.zen .zen-btn.zen-disabledBtn,.zen .zen-btn[disabled]{bottom:0}.zen .zen-btn{padding:3px 6px}.zen .zen-closeBtn{padding:0;margin:0}.zen .zen-btn{color:#222;border:1px solid #c3c3c3;border-color:#c3c3c3 #aaa #909090;font-size:.917em;font-weight:bold;text-decoration:none;-moz-border-radius:3px;border-radius:3px;background:#f0f0f0;background:-moz-linear-gradient(#fff,#f0f0f0);background:-webkit-linear-gradient(#fff,#f0f0f0);background:-ms-linear-gradient(#fff,#f0f0f0)}.zen .zen-btn:hover,.zen .zen-btn:focus{background:#e4f5ff;background:-moz-linear-gradient(#fff,#e4f5ff 60%);background:-webkit-linear-gradient(#fff,#e4f5ff 60%);background:-ms-linear-gradient(#fff,#e4f5ff 60%)}.zen .zen-btn:active{border-color:#6a6a6a #888 #a5a5a5;background:#cbcbcb;background:-moz-linear-gradient(#cbcbcb,#e5e5e5 10%,#f8f8f8);background:-webkit-linear-gradient(#cbcbcb,#e5e5e5 10%,#f8f8f8);background:-ms-linear-gradient(#cbcbcb,#e5e5e5 10%,#f8f8f8)}.zen .zen-primaryBtn{background:#eaf9ff;background:-moz-linear-gradient(top,#eaf9ff 0,#ccedfb 68%,#bee9f8 100%);background:-webkit-linear-gradient(top,#eaf9ff 0,#ccedfb 68%,#bee9f8 100%);background:-ms-linear-gradient(top,#eaf9ff 0,#ccedfb 68%,#bee9f8 100%)}.zen .zen-primaryBtn:hover,.zen .zen-primaryBtn:focus{background:#d3f2fd;background:-moz-linear-gradient(top,#f9fdff 0,#d3f2fd 100%);background:-webkit-linear-gradient(top,#f9fdff 0,#d3f2fd 100%);background:-ms-linear-gradient(top,#f9fdff 0,#d3f2fd 100%)}.zen .zen-primaryBtn:active{background:#bee7f6}.zen .zen-promoBtn{color:#fff;padding:5px 7px;font-size:1em;border:2px solid #fff;-moz-border-radius:7px;border-radius:7px;-moz-box-shadow:0 1px 3px 1px rgba(0,0,0,.15);-webkit-box-shadow:0 1px 3px 1px rgba(0,0,0,.15);box-shadow:0 1px 3px 1px rgba(0,0,0,.15);background:#6bc7e4;background:-moz-linear-gradient(#6bc7e4,#0599cc 65%);background:-webkit-linear-gradient(#6bc7e4,#0599cc 65%);background:-ms-linear-gradient(#6bc7e4,#0599cc 65%)}.zen .zen-promoBtn:hover,.zen .zen-promoBtn:focus,.zen .zen-promoBtn:active{background:#1b99c3;border-color:#fff}.zen .zen-closeBtn{color:#707474;border:0;background:#f6f7f7;font-size:1em;font-family:Verdana,Arial,Helvetica,sans-serif;-moz-border-radius:4px;border-radius:4px;-moz-box-shadow:inset 0 1px 0 0 #e4e4e4;-webkit-box-shadow:inset 0 1px 0 0 #e4e4e4;box-shadow:inset 0 1px 0 0 #e4e4e4}.zen .zen-highlightBtn{font-family:Arial;font-size:1.08em;background-color:#8ab529;border:1px solid #6c8049;background-image:-ms-linear-gradient(top,#8AB529 0,#87AC31 100%);background-image:-moz-linear-gradient(top,#8AB529 0,#87AC31 100%);background-image:-webkit-linear-gradient(top,#8AB529 0,#87AC31 100%);background-image:linear-gradient(top,#8AB529 0,#87AC31 100%);display:inline-block;padding-top:0;padding-bottom:1px;padding-left:10px;padding-right:10px;height:30px;color:#fff;-moz-border-radius:3px;border-radius:2px;-moz-box-shadow:0 1px 2px 0 #adadad;-webkit-box-shadow:0 1px 2px 0 #adadad;box-shadow:0 1px 2px 0 #adadad;margin:0}.zen .zen-btn.zen-highlightBtn:hover,.zen .zen-btn.zen-highlightBtn.onHover{background-color:#a0cb3d;background-image:-ms-linear-gradient(top,#a5cd48 0,#97bf3a 100%);background-image:-moz-linear-gradient(top,#a5cd48 0,#97bf3a 100%);background-image:-webkit-linear-gradient(top,#a5cd48 0,#97bf3a 100%);background-image:linear-gradient(top,#a5cd48 0,#97bf3a 100%)}.zen .zen-highlightBtn:active{background-color:#769b24;background-image:-ms-linear-gradient(top,#7ba229 0,#8ab237 100%);background-image:-moz-linear-gradient(top,#7ba229 0,#8ab237 100%);background-image:-webkit-linear-gradient(top,#7ba229 0,#8ab237 100%);background-image:linear-gradient(top,#7ba229 0,#8ab237 100%)}.zen .zen-highlightBtn:focus{background-color:#8AB529;background-image:-ms-linear-gradient(top,#8AB529 0,#87AC31 100%);background-image:-moz-linear-gradient(top,#8AB529 0,#87AC31 100%);background-image:-webkit-linear-gradient(top,#8AB529 0,#87AC31 100%);background-image:linear-gradient(top,#8AB529 0,#87AC31 100%)}.zen .zen-btn.zen-highlightBtn[disabled]{background:#dcdfe0;color:#fff;border:1px solid #c7ccce;-moz-box-shadow:none;-webkit-box-shadow:none;box-shadow:none}.zen .zen-closeBtn:hover,.zen .zen-closeBtn:focus{color:#015ba7;background:#e3f3ff;-moz-box-shadow:inset 0 1px 0 0 #d2d2d2;-webkit-box-shadow:inset 0 1px 0 0 #d2d2d2;box-shadow:inset 0 1px 0 0 #d2d2d2}.zen .zen-closeBtn:active{background:#dadfdf;-moz-box-shadow:inset 0 1px 0 0 #c7c7c7;-webkit-box-shadow:inset 0 1px 0 0 #c7c7c7;box-shadow:inset 0 1px 0 0 #c7c7c7}.zen .zen-btn[disabled],.zen .zen-btn.zen-disabledBtn{cursor:default;color:#c2c2c2;border-color:#e2e2e2;background:#fafafa}.zen .zen-promoBtn[disabled],.zen .zen-promoBtn.zen-disabledBtn{color:#fff;border-color:#fff;background:#e9e8e8}.zen .zen-closeBtn[disabled],.zen .zen-closeBtn.zen-disabledBtn{color:#bcbcbc;background:#f0f1f1}.zen .zen-promoBtn,.zen .zen-promoBtn:hover,.zen .zen-promoBtn:focus,.zen .zen-promoBtn:active{padding:5px 14px}.zen .zen-tooltip{position:relative}.zen .zen-tooltipBox{display:inline-block;position:relative}.zen .zen-tooltip .zen-tooltipBox{display:none;position:absolute}.zen .zen-tooltip:focus .zen-tooltipBox{display:inline-block;padding:6px;width:200px}.zen .zen-tooltip:hover .zen-tooltipBox{display:inline-block;padding:6px;width:200px}.zen .zen-tooltip .zen-tooltipBox.zen-tooltipTop{bottom:1.4em;left:0}.zen .zen-tooltip .zen-tooltipBox.tooltipBottom{top:1.4em;left:0}.zen.zen-popup{background:0}.zen body.zen-popupBody{overflow:hidden}.zen .zen-popupOverlay{position:fixed;top:0;left:0;z-index:100;width:100%;height:100%;background-color:hsla(0,0%,0%,.75)}.zen .zen-centerPopup{position:absolute;top:40%;left:35%;width:400px}.zen .zen-cropMe,.zen .zen-cropH{overflow-x:hidden !important}.zen .zen-cropMe,.zen .zen-cropV{overflow-y:hidden !important}.zen .zen-cropEllipsis{overflow:hidden;text-overflow:ellipsis;-moz-binding:url(/sync/ellipsis.xml#ellipsis)}.zen .zen-assistiveText{position:absolute !important;height:1px;width:1px;overflow:hidden;clip:rect(1px 1px 1px 1px);clip:rect(1px,1px,1px,1px)}.zen .zen-assistiveLink{padding:0 !important;margin:0 !important;height:1px !important;width:1px !important;line-height:0 !important;background-color:transparent !important;overflow:visible !important;text-decoration:none;color:#222}.helpIcon{background-image:url(/img/sprites/master.png);background-position:0 -142px;width:16px;height:16px}.recycleIcon{background-image:url(/img/func_icons/util/recycle.gif);background-position:0 0;width:19px;height:19px}.datePickerIcon{background-image:url(/img/func_icons/util/datePicker16.gif);background-position:0 0;width:16px;height:16px}.escalatedLarge{background-image:url(/img/func_icons/util/escalation16.gif);background-position:0 0;width:16px;height:16px}.printerIcon{background-image:url(/img/func_icons/util/print20.gif);background-position:0 0;width:20px;height:20px}.alertIcon{background-image:url(/img/func_icons/util/alert16.gif);background-position:0 0;width:16px;height:16px}.checkmarkIcon{background-image:url(/img/func_icons/util/checkmark16.gif);background-position:0 0;width:16px;height:16px}.groupEventIcon{background-image:url(/img/group_event.gif);background-position:0 0;width:16px;height:16px}.doubleArrowUp{background-image:url(/img/double_arrow_up.gif);background-position:0 0;width:24px;height:20px}.doubleArrowDwn{background-image:url(/img/double_arrow_dwn.gif);background-position:0 0;width:24px;height:20px}.colorPickerIcon{background-image:url(/img/func_icons/util/colorPicker16.gif);background-position:0 0;width:16px;height:16px}.downArrowIcon{background-image:url(/img/arrow_dwn.gif);background-position:0 0;width:24px;height:20px}.leftArrowIcon{background-image:url(/img/arrow_lt.gif);background-position:0 0;width:24px;height:20px}.rightArrowIcon{background-image:url(/img/arrow_rt.gif);background-position:0 0;width:24px;height:20px}.upArrowIcon{background-image:url(/img/arrow_up.gif);background-position:0 0;width:24px;height:20px}.unresolvedIcon{background-image:url(/img/icon/unresolved16.png);background-position:0 0;width:16px;height:16px}.escalatedLarge{background-image:url(/img/func_icons/util/escalation16.gif);background-position:0 0;width:16px;height:16px}.escalatedSmall{background-image:url(/img/func_icons/util/escalation12.gif);background-position:0 0;width:12px;height:12px}.infoIcon{background-image:url(/img/sprites/master.png);background-position:0 -162px;width:16px;height:16px}.mailCloseIcon{background-image:url(/img/func_icons/util/mailCloseEnv16.gif);background-position:0 0;width:16px;height:16px}.mailOpenIcon{background-image:url(/img/func_icons/util/mailOpenEnv16.gif);background-position:0 0;width:16px;height:16px}.mailFrontIcon{background-image:url(/img/func_icons/util/mailFrontEnv16.gif);background-position:0 0;width:16px;height:16px}.editLayoutIcon{background-image:url(/img/func_icons/util/editLayout20.gif);background-position:0 0;width:20px;height:20px}.alertIcon{background-image:url(/img/func_icons/util/alert16.gif);background-position:0 0;width:16px;height:16px}.checkmarkIcon{background-image:url(/img/func_icons/util/checkmark16.gif);background-position:0 0;width:16px;height:16px}.printerIconOn{background-image:url(/img/func_icons/util/print20.gif);background-position:0 0;width:20px;height:20px;background-position:0 -20px}.printerIconDisabled{background-image:url(/img/func_icons/util/print20.gif);background-position:0 0;width:20px;height:20px;background-position:0 -40px}.removeIcon{background-image:url(/img/func_icons/remove12.gif);background-position:0 0;width:12px;height:12px;background-position:top left}.removeIconOn{background-image:url(/img/func_icons/remove12_on.gif);background-position:0 0;width:12px;height:12px;background-position:top right}.dialogCloseIcon{background-image:url(/img/func_icons/util/dialogClose16.gif);background-position:0 0;width:16px;height:16px;background-position:top left}.dialogCloseIconOn{background-position:top right}.lookupIcon{background-image:url(/img/func_icons/util/lookup20.gif);background-position:0 0;width:20px;height:20px;background-position:top left}.lookupIconOn{background-image:url(/img/func_icons/util/lookup20.gif);background-position:0 0;width:20px;height:20px;background-position:top right}.closeIcon{background-image:url(/img/func_icons/closeSprite16.gif);background-position:0 0;width:16px;height:16px;cursor:pointer;background-position:top left}.closeIconOn{background-image:url(/img/func_icons/closeSprite16.gif);background-position:0 0;width:16px;height:16px;cursor:pointer;background-position:0 -16px}.closeNone{display:none}.searchIcon{background-image:url(/img/func_icons/util/search20.gif);background-position:0 0;width:20px;height:20px;background-position:top left}.searchIconOn{background-image:url(/img/func_icons/util/search20.gif);background-position:0 0;width:20px;height:20px;background-position:top right}.trashIcon{background-image:url(/img/func_icons/util/trash20.gif);background-position:0 0;width:20px;height:20px;background-position:top left}.trashIconOn{background-image:url(/img/func_icons/util/trash20.gif);background-position:0 0;width:20px;height:20px;background-position:top right}.comboboxIcon{background-image:url(/img/func_icons/util/combobox20.gif);background-position:0 0;width:20px;height:20px;background-position:top left}.comboboxIconOn{background-image:url(/img/func_icons/util/combobox20.gif);background-position:0 0;width:20px;height:20px;background-position:top right}.customizePageIcon{background-image:url(/img/func_icons/util/customize20.gif);background-position:0 0;width:20px;height:20px;background-position:top left}.customizePageIconOn{background-image:url(/img/func_icons/util/customize20.gif);background-position:0 0;width:20px;height:20px;background-position:top right}.editLayoutIcon{background-image:url(/img/func_icons/util/editLayout20.gif);background-position:0 0;width:20px;height:20px}.linkIcon{background-image:url(/img/func_icons/util/link20.gif);background-position:0 0;width:20px;height:20px;background-position:top left}.linkIconOn{background-image:url(/img/func_icons/util/link20.gif);background-position:0 0;width:20px;height:20px;background-position:top right}.videoPlay{background-image:url(/img/func_icons/videoPlay.png);background-position:0 0;width:24px;height:24px;background-position:top left}.videoPlayOn{background-image:url(/img/func_icons/videoPlay.png);background-position:0 0;width:24px;height:24px;background-position:top right}
.menuArrow1{background-image:url(/img/dcm/menuArrow_sprite.gif);background-position:0 0;width:16px;height:20px;background-position:0 0}
.menuArrowOn1{background-image:url(/img/dcm/menuArrow_sprite.gif);background-position:0 0;width:16px;height:20px;background-position:0 -20px}
.expanded .menuArrow1{background-image:url(/img/dcm/menuArrow_sprite.gif);background-position:0 0;width:16px;height:20px;background-position:0 -40px}
.expanded .menuArrowOn1{background-image:url(/img/dcm/menuArrow_sprite.gif);background-position:0 0;width:16px;height:20px;background-position:0 -60px}
.rtl .menuArrow1{background-image:url(/img/dcm/menuArrow_sprite.gif);background-position:0 0;width:16px;height:20px;background-position:0 -40px}
.rtl .menuArrowOn1{background-image:url(/img/dcm/menuArrow_sprite.gif);background-position:0 0;width:16px;height:20px;background-position:0 -60px}
.expanded .rtl .menuArrow1{background-image:url(/img/dcm/menuArrow_sprite.gif);background-position:0 0;width:16px;height:20px;background-position:0 0}
.expanded .rtl .menuArrowOn1{background-image:url(/img/dcm/menuArrow_sprite.gif);background-position:0 0;width:16px;height:20px;background-position:0 -20px}
.forceLogo{background-image:url(/img/forceMenuLogo.gif);background-position:0 0;width:91px;height:31px;background-position:0 0}
.forceLogoOn,a#forceLogoLink:focus .forceLogo{background-image:url(/img/forceMenuLogo.gif);background-position:0 0;width:91px;height:31px;background-position:0 -31px}
.helpIcon{background:transparent url(/img/alohaSkin/help_orange.png) no-repeat;vertical-align:bottom}
.infoIcon{background-image:url(/img/alohaSkin/info_sprite.png);background-position:left top;height:15px}
ul, menu, dir {
display: block;
list-style-type: disc;
-webkit-margin-before: 1em;
-webkit-margin-after: 1em;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
-webkit-padding-start: 40px;
}
</style>

Compoent Controller Code: 

public with sharing class ComponentControllerSlide 
{
    //Hold the page info like page name and controller type and name
    ApexPage apxPg =  null;
    //Hold the page name where this component use
    public String PageName{set;get;}
    //single link which we have to show
    //public String showLink{set;get;}
    
    public String ComponentName{set;get;}
    
  
    
   public List<LinksWrapper> getmyLinks()
    {
        
        String PgName =ApexPages.currentPage().getUrl();
        List<LinksWrapper> local = new List<LinksWrapper>(); 
        String thisReturn ='';
        if(PgName.containsIgnoreCase('/apex/'))
        {
            PgName = PgName.replaceAll('/apex/','');
            for(ApexPage tempIns :[ select  name,Markup,ControllerKey,ControllerType from ApexPage where name =:PgName])
                apxPg = tempIns;
         
            if(apxPg != null)
            {
                if(apxPg.ControllerType =='0')  //it means no controller and standard controller bind
                {   
                    PageName = PgName;
                    local.add(new LinksWrapper('','Not Found Controller',false));
                    
                }
                else if (apxPg.ControllerType =='1') // its mean standard controller included it may be standard obj or custom object
                {
   
                      Map<String, Schema.SObjectType> gd = Schema.getGlobalDescribe();
                      Schema.DescribeSObjectResult r =  gd.get(apxPg.ControllerKey).getDescribe();
                      PageName = r.getLabel();
                      thisReturn= '/'+r.getKeyPrefix()+'/o';
                      local .add(new LinksWrapper('/'+r.getKeyPrefix()+'/o','List Of Record',true));
                      local .add(new LinksWrapper('/'+r.getKeyPrefix()+'/e','Create new Record',true));
                }
                else if (apxPg.ControllerType =='2') // we are using controller 
                {
                    PageName = apxPg.ControllerKey;
                    local.add(new LinksWrapper('/'+apxPg.id,'You are using class',true));
                }
            }
        }
        Map<String ,String> co = new Map<String,String>();
        co = pageInfomation(ComponentName,apxPg.Markup);
        if(co.size()>0)
        {
            for(String x : co.keySet())
            local.add(new LinksWrapper(x,co.get(x),false) ) ;
        }
        return local ;
        
    }
    
    //Wrapper Class contain link n title of url
    public Class LinksWrapper{
        public String UrlLink{set;get;}
        public String LinkTitle{set;get;}
        public Boolean ActiveUrl{set;get;}
        
        public LinksWrapper(String uL,String lt,boolean au)
        {
                UrlLink   = uL; 
                LinkTitle = lt;
                ActiveUrl = au;
        }
    }
    
    public Map<String ,string> pageInfomation (String CompoNames,String pCode){
            Set<String>  compoNameSet = new Set<String>();
            List<String> compoNameList = new List<String>();
            Map<String,String>  compoNameListWithApex = new Map<String,String>();
            String Prefix ='<apex:';
        if(CompoNames !=null && CompoNames!='')
        {
            if(CompoNames.contains(','))
            {
                compoNameList = CompoNames.split(',');
            }else{
                if(CompoNames != null && CompoNames.trim() !='')
                compoNameList.add(CompoNames);
            }
            compoNameSet.addAll(compoNameList);
            for(String s :compoNameSet){
                if(pCode.contains(Prefix+s))
                {
                    Integer x = pcode.countMatches(Prefix+s);
                    compoNameListWithApex.put(s,''+x);
                }
                
            }
            compoNameSet =null;
        }
            return compoNameListWithApex;
        
    }
    

}

try this all thing in your end and see the magic.......

Thanks

Ashlekh Gera 

Trigger Info

Hi ,

Trigger in salesforce.

before insert --> trigger.new --- we got the values
before insert --> trigger.old --- null
---------------------------------------------------------
after insert --> trigger.new --- we got the values we can't change the value
after insert --> trigger.old --- null
---------------------------------------------------------
----------------------------------------------------------


before update ---> trigger.new -------we got the value and we can change the value by this
before update ----> trigger.old ------we got the value but we can not change the value as record is only read only

after update------>trigger.new----------->we got the value but we can not change the value
after update-------trigger.old------------> we got the value but we can not change the value
-------------------------------------------------------------------

after delete ----trigger.old ----- we got the value
after delete ----trigger.new ------ we can get the value

before delete ----trigger.old ----- we got the value
before delete ----trigger.new ------ we can get the value

--------------------------------------------------------------------

after undelete ---trigger.old ---------------null
after undelete ---trigger.new----------------we got the value

Thanks
Ashlekh

Hi,

This is for small trick that how button click  when we press enter in text field.
Small but very use fully.

<apex:inputText  value="{!text}"  id="textId"  onkeypress="if (event.keyCode == 13) { ClickOn(); }"/>
<apex:CommandButton Id="BTN" styleClass="BTN" action="{!a}" />

<script>
 function ClickOn(){
  $('.BTN').click();
}
</script>


Thanks
Ashlekh Gera.

Hi,

This is very useful to show processing image when some action going on.
Some time we forget how to show this so I post in my Blog to quick remember.

           

<apex:form>

   <apex:commandButton  status="statusProcess" action="{!actionA}" /> 

    <apex:outputPanel id="statusProcessId">

       <apex:actionStatus id="statusProcess">
               <apex:facet name="start">
                   <apex:outputPanel > 
                      &nbsp; Requesting...<img src="/apexpages/devmode/img/saveStatus.gif" />
                   </apex:outputPanel>  
               </apex:facet>
            </apex:actionStatus>
       </apex:outputPanel>
</apex:form>

Thanks

Ashlekh Gera

How to show more years in salesforce datepicker years list(options)

Hi,

Today I have a small requirment that is to show upto 100 years in year list of  salesforce default date picker.
I tried a lot and in last i find a small script by which we can do this

just use this script  and see the magic

<script>
  (function() {
    var windowOnload = window.onload;
    window.onload = function() {
      if (windowOnload) windowOnload();
      var select = document.getElementById('calYearPicker');
      if (!select) return;

      select.innerHTML = '';
      var startYear = new Date().getFullYear() - 100;
      for (var year = startYear; year < startYear + 120; year++) {
        select.appendChild(new Option(year, year));
      }
    }
  }());
</script>
Now you can see the magic on page where i put the script on page and showing a date field and list of years

I hope this will help you in many cases

Thanks
Ashlekh Gera

Hi,

Small but very usefull script. This script is for input field in which we want user can only enter phone number so if user enter any alphbates then it immediate clean .

<input type="text" id="" name="" placeholder="please enter only number and hipens" onkeyup="this.value=this.value.replace(/[^\d-]/g, '')" />

Very useful and very nice

Thanks