我在XHTML中使用Primefaces 我决定在我的网页上使用带有图标触发器的jQuery的datePicker而不是PrimeFaces日历。 datepicker的代码是:
<h:panelGrid id="searchGrid" columns="3" styleClass="grid" columnClasses="one,two,three">
<p:column>
<h:outputLabel for="date" value="Date" />
</p:column>
<p:column>
<script type="text/javascript">
$(function() {
$("#date").datepicker({
minDate : "#{indexBean.searchCriteria.mindate}",
maxDate : "#{indexBean.searchCriteria.maxdate}",
dateFormat : "dd/mm/yy",
showOn : "button",
buttonImage : "/style/images/calendar.png",
buttonImageOnly : true
});
});
</script>
<p:inputText id="date" value="#{indexBean.searchCriteria.date}" label="Date" validator="#{indexBean.validateDate}">
<p:watermark value="eg: 01/01/2013" for="date" />
</p:inputText>
然而,datePicker的按钮(图标)不会显示在页面上。 有什么遗漏? 提前致谢
答案 0 :(得分:0)
看起来你没有导入jQuery UI。确保页面顶部有这样的内容:
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
另外,我会将你的javascript移动到datepicker输入元素下面:
<h:panelGrid id="searchGrid" columns="3" styleClass="grid" columnClasses="one,two,three">
<p:column>
<h:outputLabel for="date" value="Date" />
</p:column>
<p:column>
<p:inputText id="date" value="#{indexBean.searchCriteria.date}" label="Date" validator="#{indexBean.validateDate}">
<p:watermark value="eg: 01/01/2013" for="date" />
</p:inputText>
<script type="text/javascript">
$(function() {
$("#date").datepicker({
minDate : "#{indexBean.searchCriteria.mindate}",
maxDate : "#{indexBean.searchCriteria.maxdate}",
dateFormat : "dd/mm/yy",
showOn : "button",
buttonImage : "/style/images/calendar.png",
buttonImageOnly : true
});
});
</script>
答案 1 :(得分:0)
Yepeeee 我修好了它 我需要改变一件小事
id =“date”to styleclass =“date”(in the) 谢谢大家