Created
September 4, 2014 05:51
-
-
Save tyoshikawa1106/9af97ab6c43905cd2ec5 to your computer and use it in GitHub Desktop.
datepickerのサンプル
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<apex:page controller="OpportunityDateSearchController" showHeader="true" sidebar="false" docType="html-5.0" tabStyle="Opportunity" id="page"> | |
<apex:includeScript value="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" /> | |
<apex:includeScript value="https://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js" /> | |
<apex:includeScript value="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/i18n/jquery.ui.datepicker-ja.js" /> | |
<apex:styleSheet value="https://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/redmond/jquery-ui.css" /> | |
<apex:include pageName="OpportunityDateSearchCss" /> | |
<div id="vf-page"> | |
<apex:sectionHeader title="{!$Label.Forcedotcom}" subTitle="{!$Label.Opportunity_Search}" /> | |
<apex:form id="form"> | |
<apex:actionFunction name="fcSearch" action="{!doSearch}" reRender="resultTable"/> | |
<apex:pageBlock id="block"> | |
<apex:pageBlockButtons location="bottom"> | |
<apex:commandButton value=" {!$Label.Search} " onclick="return doSearch();"/> | |
</apex:pageBlockButtons> | |
<apex:pageBlockSection columns="1" id="section"> | |
<apex:pageBlockSectionItem id="sectionItem"> | |
<apex:outputLabel value="{!$ObjectType.Opportunity.Fields.CloseDate.Label}" /> | |
<!-- datepicker --> | |
<apex:outputPanel id="panel"> | |
<apex:input value="{!fromDate}" type="text" styleClass="datepicker" id="fromDate" /> | |
<apex:outputText value=" {!$Label.Wave_Dash} " /> | |
<apex:input value="{!fromDate}" type="text" styleClass="datepicker" id="toDate" /> | |
</apex:outputPanel> | |
</apex:pageBlockSectionItem> | |
</apex:pageBlockSection> | |
</apex:pageBlock> | |
</apex:form> | |
</div> | |
<apex:include pageName="OpportunityDateSearchScript" /> | |
</apex:page> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<apex:page > | |
<script type="text/javascript"> | |
jQuery( function() { | |
jQuery('.datepicker').datepicker( { | |
showOn: "button", | |
buttonImage: "/resource/FreeIcons/img/Calendar.png", | |
buttonImageOnly: true, | |
dateFormat: 'yy/mm/dd', | |
firstDay: 0, | |
numberOfMonths: 3, | |
defaultDate : "-1m", | |
showOtherMonths: true, | |
selectOtherMonths: true | |
} ); | |
jQuery(".datepicker").datepicker({minDate:-1,maxDate:-2}).attr('readonly','readonly'); | |
jQuery('.ui-datepicker-trigger').css({'margin-left': '5px', 'margin-bottom': '-2px', 'width': '15px'}); | |
jQuery('.ui-datepicker-week-end').css({'color': '#00f'}); | |
}); | |
</script> | |
</apex:page> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment