New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Datepicker: js error uncaught Extra/unparsed characters found in date (selectionMode="range") #4496

Closed
majulvez opened this Issue Feb 4, 2019 · 13 comments

Comments

Projects
None yet
4 participants
@majulvez
Copy link

majulvez commented Feb 4, 2019

1) Environment

  • PrimeFaces version: 6.2.15 and 7.0-SNAPSHOT
  • Does it work on the newest released PrimeFaces version? No. Version? 6.2.15
  • Does it work on the newest sources in GitHub? No
  • Application server + version: Apache Tomcat 7.0.62
  • Affected browsers: Chrome/Firefox

2) Expected behavior

Datepicker shows the range of dates selected in the calendar (today and tomorrow)

3) Actual behavior

Datepicker shows a javascript error 'Uncaught Extra/unparsed characters found in date: -5/02/19'

4) Steps to reproduce

Just load the .xhtml page and look in the web browser console

5) Sample XHTML

<?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: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"
      xmlns:a="http://xmlns.jcp.org/jsf/passthrough"
>

<h:head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <title>PrimeFaces Showcase</title>

    <script type="text/javascript">
        PrimeFaces.locales['es'] = {
            closeText: 'Cerrar',
            prevText: 'Anterior',
            nextText: 'Siguiente',
            monthNames: ['Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre'],
            monthNamesShort: ['Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun', 'Jul', 'Ago', 'Sep', 'Oct', 'Nov', 'Dic'],
            dayNames: ['Domingo', 'Lunes', 'Martes', 'Miércoles', 'Jueves', 'Viernes', 'Sábado'],
            dayNamesShort: ['Dom', 'Lun', 'Mar', 'Mie', 'Jue', 'Vie', 'Sab'],
            dayNamesMin: ['D', 'L', 'M', 'X', 'J', 'V', 'S'],
            weekHeader: 'Semana',
            firstDayOfWeek: 1,
            isRTL: false,
            showMonthAfterYear: false,
            yearSuffix: '',
            timeOnlyTitle: 'Sólo hora',
            timeText: 'Tiempo',
            hourText: 'Hora',
            minuteText: 'Minuto',
            secondText: 'Segundo',
            currentText: 'Fecha actual',
            ampm: false,
            month: 'Mes',
            week: 'Semana',
            day: 'Día',
            allDayText: 'Todo el día'
        };
    </script>

</h:head>
<h:body>
    <h1>Datepicker</h1>

    <h:form id="form">
        <p:datePicker value="#{calendarView.dates}" locale="es" selectionMode="range" numberOfMonths="2" />
    </h:form>

</h:body>
</html>

6) Sample bean

package com.primefaces.test;

import javax.faces.bean.ManagedBean;
import java.io.Serializable;
import java.util.ArrayList;
import java.util.Calendar;
import java.util.Date;
import java.util.List;

@ManagedBean(name = "calendarView")
public class CalendarView implements Serializable {

    private String test = "test";

    private List<Date> dates;

    public CalendarView() {
        Date today = Calendar.getInstance().getTime();
        long oneDay = 24 * 60 * 60 * 1000;
        Date tomorrow = new Date(today.getTime() + (1 * oneDay));

        dates = new ArrayList<>();
        dates.add(today);
        dates.add(tomorrow);

    }

    public List<Date> getDates() {
        return dates;
    }

    public void setDates(List<Date> dates) {
        this.dates = dates;
    }

    public String getTest() {
        return test;
    }

    public void setTest(String test) {
        this.test = test;
    }
}
@melloware

This comment has been minimized.

Copy link
Contributor

melloware commented Feb 4, 2019

Attached is a runnable sample:
pf-datepicker.zip

Just run "mvn clean jetty:run-exploded" and navigate to http://localhost:8080/primefaces-test/test.xhtml

It appears this is fixed in the upcoming 7.0 and most likely in 6.2.16.

@tandraschko

This comment has been minimized.

Copy link
Member

tandraschko commented Feb 4, 2019

@mertsincan can you verify?

@majulvez

This comment has been minimized.

Copy link
Author

majulvez commented Feb 4, 2019

Thanks @melloware , but if you use inline="true" property in your example, you'll see that the range given is not showed

@melloware

This comment has been minimized.

Copy link
Contributor

melloware commented Feb 4, 2019

@majulvez Then you should have had inline in your example code above. I literally copied and pasted what you had. I just ran it with inline="true" and I still get no JS errors and my screen looks like this...

image

@majulvez

This comment has been minimized.

Copy link
Author

majulvez commented Feb 4, 2019

I meant with your example no js errors is showed (not like in 6.2.15) but I still don't see that range selected. I've tested with chrome and firefox (last version).

I told you about inline="true" because is easier to see the behaviour.

This is what I see

https://imgur.com/a/Scyaph4

@melloware

This comment has been minimized.

Copy link
Contributor

melloware commented Feb 4, 2019

I selected that range by hand. So I guess the real bug here is that its not preselecting the dates from the backing beans values. That is the bug.

@majulvez

This comment has been minimized.

Copy link
Author

majulvez commented Feb 4, 2019

Yes. That is what I was testing when I see the js error. It's wrote down in the expected behaviour in the issue.

Thanks

@melloware

This comment has been minimized.

Copy link
Contributor

melloware commented Feb 4, 2019

Right I was focused on that the JS Error was your problem. Not the fact its not preselecting the dates. @mertsincan this is definitely an issue you can test with my test case above.

@mertsincan mertsincan self-assigned this Feb 6, 2019

@mertsincan mertsincan added this to the 7.0 milestone Feb 6, 2019

@mertsincan mertsincan closed this in b5ff3f9 Feb 6, 2019

@mertsincan

This comment has been minimized.

Copy link
Member

mertsincan commented Feb 6, 2019

Hi @majulvez and @melloware,

Could you please check my fix? Thanks a lot!

@majulvez

This comment has been minimized.

Copy link
Author

majulvez commented Feb 6, 2019

Hi @mertsincan ,

I still don't see the dates preselected when the calendar is showed

Thanks

@mertsincan

This comment has been minimized.

Copy link
Member

mertsincan commented Feb 7, 2019

Hi,

Datepicker shows a javascript error 'Uncaught Extra/unparsed characters found in date: -5/02/19'

Is this issue resolved?

@mertsincan

This comment has been minimized.

Copy link
Member

mertsincan commented Feb 7, 2019

I still don't see the dates preselected when the calendar is showed

Please see; #4514

Could you please check #4514 fix? Thanks,

@majulvez

This comment has been minimized.

Copy link
Author

majulvez commented Feb 7, 2019

Yes. It works fine now.

Thanks

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment