You need to sign in to do that
Don't have an account?
shashi kanaparthi
Jquery Datepicker style not overriding the salesforce style of Apec input field
Hi,
I am trying to use JQuery date picker in visualforce page. The JQuery date picker is not overwriting the standard salesforce style for apex:input field. Code below:
<apex:page id="thePage" standardController="Interaction__c">
<head>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" target="_blank" rel="nofollow"/>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css</a>" rel="stylesheet" type="text/css"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" target="_blank" rel="nofollow">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js</a>"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js" target="_blank" rel="nofollow">
<script src="<a href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js</a>"></script>
<script>
jQuery(function(){
var $j = jQuery.noConflict();
$j("input[id$=datepicker]").datepicker({
changeYear: true,
changeMonth: true,
dateFormat: "mm/dd/yy"
});
});
</script>
</head>
<apex:form >
<apex:pageBlock >
<apex:pageblockSection >
<apex:inputfield value="{!Interaction__c.Call_Date__c}" id="datepicker"/>
<apex:pageBlockSectionItem />
</apex:pageblockSection>
</apex:pageBlock>
</apex:form>
</apex:page>
Let me know if some thing else needs to be done.
I am trying to use JQuery date picker in visualforce page. The JQuery date picker is not overwriting the standard salesforce style for apex:input field. Code below:
<apex:page id="thePage" standardController="Interaction__c">
<head>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" target="_blank" rel="nofollow"/>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css</a>" rel="stylesheet" type="text/css"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" target="_blank" rel="nofollow">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js</a>"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js" target="_blank" rel="nofollow">
<script src="<a href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js</a>"></script>
<script>
jQuery(function(){
var $j = jQuery.noConflict();
$j("input[id$=datepicker]").datepicker({
changeYear: true,
changeMonth: true,
dateFormat: "mm/dd/yy"
});
});
</script>
</head>
<apex:form >
<apex:pageBlock >
<apex:pageblockSection >
<apex:inputfield value="{!Interaction__c.Call_Date__c}" id="datepicker"/>
<apex:pageBlockSectionItem />
</apex:pageblockSection>
</apex:pageBlock>
</apex:form>
</apex:page>
Let me know if some thing else needs to be done.
2). Removed unnecessary jquery files.
3). Added rel="stylesheet" attribute to <link> tag.
Hope it will work now.
Thanks
Satya.
Can you please let me know how to hide the datepicker as it is not autoclose in safari browser
What's the best solution to close data picker on page load.