原理3.3.1和jQuery Datepicker不工作 [英] Primefaces 3.3.1 and jQuery Datepicker not working

问题描述

我的xhtml下面有一个datepicker，它工作正常，直到我包括命名空间的字符使用自动完成功能。这里是我的xhtml之前包括原点自动完成

My xhtml below has a datepicker which was working fine until I included the namespace for primefaces to use autocomplete feature. Here is my xhtml before including primefaces autocomplete

在Primeface xhtml之前：

<div xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" 
    lang="en" xml:lang="en" style="padding-bottom: 8px;">
    <h:head>
        <script type="text/javascript" src="#{lookupBean.themePath}/js/jquery-1.7.2.min.js" />
        <script type="text/javascript" src="#{lookupBean.themePath}/js/javascript.js" />
        <script type="text/javascript" src="#{lookupBean.themePath}/js/jquery.tablesorter.min.js" />
        <script type="text/javascript" src="#{lookupBean.themePath}/js/ui.datepicker.js" />

        <script type="text/javascript">
           jQuery(document).ready(function() 
            {
                jQuery('input:text[id$="endDate"]').datepicker({
                showOn : 'button',
                buttonImageOnly : true,
                buttonImage : '/vcc-theme/images/common/calendar.png',
                minDate : +0
            });
        </script>
    </h:head>
    <h:body>
        End Date:  <h:inputText id="endDate" for="endDate" value="#{manageMarketingProgramsBean.endDate}">
                        <f:convertDateTime pattern="MM/dd/yyyy" timeZone="America/New_York" />
                    </h:inputText>
    </h:body>
</div>

strong>包含原点自动填充后：

After including primefaces autocomplete:

<div xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" 
     xmlns:p="http://primefaces.org/ui"
    lang="en" xml:lang="en" style="padding-bottom: 8px;">
    <h:head>
        <script type="text/javascript" src="#{lookupBean.themePath}/js/jquery-1.7.2.min.js" />
        <script type="text/javascript" src="#{lookupBean.themePath}/js/javascript.js" />
        <script type="text/javascript" src="#{lookupBean.themePath}/js/jquery.tablesorter.min.js" />
        <script type="text/javascript" src="#{lookupBean.themePath}/js/ui.datepicker.js" />

        <script type="text/javascript">
           jQuery(document).ready(function() 
            {
                jQuery('input:text[id$="endDate"]').datepicker({
                showOn : 'button',
                buttonImageOnly : true,
                buttonImage : '/vcc-theme/images/common/calendar.png',
                minDate : +0
            });
        </script>
    </h:head>
    <h:body>
        End Date:  <h:inputText id="endDate" for="endDate" value="#{manageMarketingProgramsBean.endDate}">
                        <f:convertDateTime pattern="MM/dd/yyyy" timeZone="America/New_York" />
                    </h:inputText>

        Name:<p:autoComplete value="#{programManagerBean.programManager}"
                        completeMethod="#{programManagerBean.getInternalUsers}" maxResults="150" scrollHeight="250" size="50"
                        minQueryLength="2">
                    </p:autoComplete>
    </h:body>
</div>

Prime Faces之前的Datepicker自动填充：

Prime Faces之后的Datepicker自动完成

自动完成正在工作，但添加该标签在我的xhtml螺丝钉日期选择器，不知道可能发生什么？我可以选择一个月，但没有一个日期出现。如果我在这里做错了，请让我知道。

The autocomplete is working but adding that tag in my xhtml screws up the date picker, not sure what could be happening? I am able to pick the month, year but none of the dates are appearing. Please let me know if I am doing anything wrong here.

另外我注意到，datepicker问题不是特定于主要的脸部自动完成功能。如果我添加任何其他主要面孔元素或标签，我正在面对datepicker的问题。

Also I noticed that the datepicker issue is not specific to prime face autocomplete feature. If I add any other prime faces element or tag I am facing the issue with datepicker.

推荐答案

你的CSS被弄乱了。看看这个问题来解决你的问题：

Your css is getting messed up. Look at this question to resolve your issues:

如何覆盖原型jQuery和css

这篇关于原理3.3.1和jQuery Datepicker不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！