[RESOLVED] Problem with date field (p:calendar)

Elvis Fabiane
Posts: 15
Joined: 12 Dec 2013, 19:01

09 May 2018, 18:40

Hi.

The date field is misaligned, what can I do to fix this problem? It happens with all date fields (calendar);

https://drive.google.com/open?id=13IyQW ... sIIcDuskZf
Last edited by Elvis Fabiane on 24 May 2018, 18:49, edited 1 time in total.

kubrasulukan
Posts: 87
Joined: 10 Jan 2018, 16:04

11 May 2018, 10:00

Could you please send your css codes?

Elvis Fabiane
Posts: 15
Joined: 12 Dec 2013, 19:01

11 May 2018, 19:54

This is component

Code: Select all

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:cc="http://xmlns.jcp.org/jsf/composite"
      xmlns:p="http://primefaces.org/ui">

    <cc:interface>
        <cc:attribute name="value" required="true" />
        <cc:attribute name="required" type="java.lang.Boolean" default="false" />
        <cc:attribute name="requiredMessage" default="O campo data é obrigatório" />
        <cc:attribute name="yearRange" default="c-3:c+3" />
        <cc:attribute name="size" default="10" />
        <cc:attribute name="disabled" type="java.lang.Boolean" default="false" />
        <cc:attribute name="process" />
        <cc:attribute name="update" />
        <cc:attribute name="oncomplete" />
        <cc:attribute name="maxdate" />
        <cc:attribute name="styleClass" />
    </cc:interface>

    <cc:implementation>
        <!-- Função responsável por devolver o foco ao campo caso a data for inválida -->
        <script type="text/javascript">
            function focusFun(xhr, status, args) {
                if (args.paramInvalidDate) {
                    PrimeFaces.focus(args.idComponent);
                }
            }
        </script>

        <p:calendar id="cal" value="#{cc.attrs.value}" showOn="button" navigator="true"
                    locale="pt_BR" size="#{cc.attrs.size}" onfocus="this.select()"
                    pattern="dd/MM/yyyy" buttonTabindex="-1" converter="convInputDate" type="tel"
                    mask="99/99/?9999" placeholder="__/__/____" required="#{cc.attrs.required}"
                    yearRange="#{cc.attrs.yearRange}" requiredMessage="#{cc.attrs.requiredMessage}"
                    rendered="#{cc.attrs.rendered}" disabled="#{cc.attrs.disabled}" maxdate="#{cc.attrs.maxdate}"
                    styleClass="#{cc.attrs.styleClass}">

            <p:ajax process="@this #{cc.attrs.process}" update="@this #{cc.attrs.update}"
                    oncomplete="focusFun(xhr, status, args);#{cc.attrs.oncomplete}" />
        </p:calendar>
    </cc:implementation>
</html>
CSS is the original theme of Verona...

kubrasulukan
Posts: 87
Joined: 10 Jan 2018, 16:04

14 May 2018, 08:53

Which pf version you're using?
The code that you send me is not a runnable code so I altered it

Code: Select all

<p:calendar id="cal" showOn="button" navigator="true"
  pattern="dd/MM/yyyy" buttonTabindex="-1" type="tel"
  mask="99/99/?9999" placeholder="__/__/____" >
</p:calendar>
and it works perfectly Image

Elvis Fabiane
Posts: 15
Joined: 12 Dec 2013, 19:01

14 May 2018, 13:08

Hello. The code I sent you is a component but the way you did also happens the error, just add an "ajax" with update "@this". The prime version is 6.2 ...

kubrasulukan
Posts: 87
Joined: 10 Jan 2018, 16:04

14 May 2018, 15:33

With which browser?

Elvis Fabiane
Posts: 15
Joined: 12 Dec 2013, 19:01

14 May 2018, 15:52

Only in mozilla. In the browsers Edge, Opera and Google Chrome works correctly.

Elvis Fabiane
Posts: 15
Joined: 12 Dec 2013, 19:01

17 May 2018, 16:31

Has anyone had this problem? I need to generate a version and I can not solve it.
Thank you.

User avatar
aragorn
Posts: 3081
Joined: 29 Jun 2013, 12:38

21 May 2018, 08:48

Does the following code work for you on Mozilla?

Code: Select all

<p:calendar id="cal" showOn="button" navigator="true"
  pattern="dd/MM/yyyy" buttonTabindex="-1" type="tel"
  mask="99/99/?9999" placeholder="__/__/____" >
</p:calendar>

Elvis Fabiane
Posts: 15
Joined: 12 Dec 2013, 19:01

21 May 2018, 12:54

It works, but the problem is when you have an ajax @this update inside the component, so no ajax works.

--------------------------------
It does not work

Code: Select all

<p:calendar id="cal" showOn="button" navigator="true" pattern="dd/MM/yyyy" buttonTabindex="-1" type="tel" mask="99/99/?9999" placeholder="__/__/____" >
   <p:ajax update="@this ... " />
</p:calendar>

Post Reply

Return to “Verona - PrimeFaces”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 1 guest