将 Jquery 日期选择器与 VisualForce Apex inputText 结合使用

Question

我正在尝试使用 Apex inputText 控件从使用 jquery 日期选择器的用户输入日期。

下面给出了页面代码和使用的 javascript 函数，当我使用 HTML 输入控件但不使用 Apex inputText 控件时，代码在我看来工作得非常好。

<apex:page showHeader="false" id="mypage" docType="html-5.0" controller="ControllerCalculateIncentive" sidebar="false" standardStylesheets="false">
  <html>
    <head>
     <apex:stylesheet value="{!URLFOR($Resource.styles, 'bootstrap.css')}" />
     <apex:stylesheet value="{!URLFOR($Resource.styles, 'scrum.css')}" />
     <apex:stylesheet value="{!URLFOR($Resource.styles, 'jquery-ui.css')}" />
     <apex:stylesheet value="{!URLFOR($Resource.styles, 'font-awesome.css')}" />
     <apex:includeScript value="{!URLFOR($Resource.styles, 'jquery-1.11.1.js')}"/>
     <apex:includeScript value="{!URLFOR($Resource.styles, 'bootstrap.js')}"/>
     <apex:includeScript value="{!URLFOR($Resource.styles, 'jquery.min.js')}"/>
     <apex:includeScript value="{!URLFOR($Resource.styles, 'jquery-ui.js')}"/>    
     <script type="text/javascript">
        var j$ = jQuery.noConflict();
        j$(document).ready(function(){           
           var v= '{!$Component.mypage:frm:StartDate}';
            j$(v).datepicker({
                dateFormat: 'dd-mm-yyyy',
                changeMonth: true,
                changeYear: true});

            });
     </script>
    </head>
    <body>
     <apex:form id="frm">
     <apex:inputText id="StartDate" value="{!StartDate}"  ></apex:inputText> 
     <apex:form>
    </body>
  </html>
</apex:page>

Answer 1

你能试试下面的代码吗:

j$(document).ready(function(){           
     var v= '#StartDate'; //putting id of the input field directly
     j$(v).datepicker({
     dateFormat: 'dd-mm-yyyy',
     changeMonth: true,
     changeYear: true});

});

Answer 2

使用这条线

j$('input[id$="StartDate"]')

这会用到里面的控件jquery

将 Jquery 日期选择器与 VisualForce Apex inputText 结合使用

Using Jquery Date Picker with VisualForce Apex inputText

jquery

salesforce

apex-code

visualforce

apex