1. Fabrik 3.9 has been released. If you have updated Joomla to 3.9, this is a required update.
    Dismiss Notice

Date picker stopped working J!3.9.3 Fabrik 3.9

Discussion in 'Community' started by ontarget, Feb 12, 2019.

  1. ontarget

    ontarget Member

    Level: Community
    Hi i just updated my site and can no longer use date picker in my calendar viz - see console error

    date-min.js:3 Uncaught TypeError: Date.parseDate is not a function
    at Object.makeCalendar (date-min.js:3)
    at Object.e.extend.$owner (mootools-core.js?4c6dab2eff07404ee76bbee0265de1e9:38)
    at Object.setUp (date-min.js:3)
    at Object.e.extend.$owner (mootools-core.js?4c6dab2eff07404ee76bbee0265de1e9:38)
    at Object.initialize (date-min.js:3)
    at Object.<anonymous> (mootools-more.js?4c6dab2eff07404ee76bbee0265de1e9:27)
    at Object.e.extend.$owner [as initialize] (mootools-core.js?4c6dab2eff07404ee76bbee0265de1e9:38)
    at new <anonymous> (mootools-core.js?4c6dab2eff07404ee76bbee0265de1e9:37)
    at Object.<anonymous> (form.js:3)
    at Array.forEach (<anonymous>)
    makeCalendar @ date-min.js:3
    e.extend.$owner @ mootools-core.js?4c6dab2eff07404ee76bbee0265de1e9:38
    setUp @ date-min.js:3
    e.extend.$owner @ mootools-core.js?4c6dab2eff07404ee76bbee0265de1e9:38
    initialize @ date-min.js:3
    (anonymous) @ mootools-more.js?4c6dab2eff07404ee76bbee0265de1e9:27
    e.extend.$owner @ mootools-core.js?4c6dab2eff07404ee76bbee0265de1e9:38
    (anonymous) @ mootools-core.js?4c6dab2eff07404ee76bbee0265de1e9:37
    (anonymous) @ form.js:3
    (anonymous) @ mootools-core.js?4c6dab2eff07404ee76bbee0265de1e9:5
    each @ mootools-core.js?4c6dab2eff07404ee76bbee0265de1e9:9
    (anonymous) @ form.js:3
    (anonymous) @ mootools-core.js?4c6dab2eff07404ee76bbee0265de1e9:9
    forEach @ mootools-more.js?4c6dab2eff07404ee76bbee0265de1e9:139
    addElements @ form.js:3
    e.extend.$owner @ mootools-core.js?4c6dab2eff07404ee76bbee0265de1e9:38
    (anonymous) @ VM35754:51
    execCb @ VM35730:29
    check @ VM35730:18
    (anonymous) @ VM35730:23
    (anonymous) @ VM35730:8
    (anonymous) @ VM35730:23
    v @ VM35730:7
    emit @ VM35730:23
    check @ VM35730:19
    (anonymous) @ VM35730:23
    (anonymous) @ VM35730:8
    (anonymous) @ VM35730:23
    v @ VM35730:7
    emit @ VM35730:23
    check @ VM35730:19
    (anonymous) @ VM35730:23
    (anonymous) @ VM35730:8
    (anonymous) @ VM35730:23
    v @ VM35730:7
    emit @ VM35730:23
    check @ VM35730:19
    (anonymous) @ VM35730:23
    (anonymous) @ VM35730:8
    (anonymous) @ VM35730:23
    v @ VM35730:7
    emit @ VM35730:23
    check @ VM35730:19
    enable @ VM35730:23
    init @ VM35730:17
    E @ VM35730:14
    completeLoad @ VM35730:28
    onScriptLoad @ VM35730:29
    load (async)
    h.load @ VM35730:34
    load @ VM35730:29
    load @ VM35730:18
    (anonymous) @ VM35730:17
    (anonymous) @ VM35730:8
    execCb @ VM35730:29
    check @ VM35730:18
    enable @ VM35730:23
    init @ VM35730:17
    (anonymous) @ VM35730:26
    setTimeout (async)
    h.nextTick @ VM35730:32
    g @ VM35730:26
    fetch @ VM35730:17
    check @ VM35730:19
    enable @ VM35730:23
    enable @ VM35730:27
    (anonymous) @ VM35730:23
    (anonymous) @ VM35730:8
    v @ VM35730:7
    enable @ VM35730:22
    init @ VM35730:17
    E @ VM35730:14
    completeLoad @ VM35730:28
    onScriptLoad @ VM35730:29
    load (async)
    h.load @ VM35730:34
    load @ VM35730:29
    load @ VM35730:18
    fetch @ VM35730:17
    check @ VM35730:19
    enable @ VM35730:23
    enable @ VM35730:27
    (anonymous) @ VM35730:23
    (anonymous) @ VM35730:8
    v @ VM35730:7
    enable @ VM35730:22
    init @ VM35730:17
    E @ VM35730:14
    completeLoad @ VM35730:28
    onScriptLoad @ VM35730:29
    load (async)
    h.load @ VM35730:34
    load @ VM35730:29
    load @ VM35730:18
    (anonymous) @ VM35730:17
    (anonymous) @ VM35730:8
    execCb @ VM35730:29
    check @ VM35730:18
    enable @ VM35730:23
    init @ VM35730:17
    (anonymous) @ VM35730:26
    setTimeout (async)
    h.nextTick @ VM35730:32
    g @ VM35730:26
    fetch @ VM35730:17
    check @ VM35730:19
    enable @ VM35730:23
    enable @ VM35730:27
    (anonymous) @ VM35730:23
    (anonymous) @ VM35730:8
    v @ VM35730:7
    enable @ VM35730:22
    init @ VM35730:17
    (anonymous) @ VM35730:26
    setTimeout (async)
    h.nextTick @ VM35730:32
    g @ VM35730:26
    requirejs @ VM35730:31
    (anonymous) @ VM35754:48
    c @ jquery.min.js?4c6dab2eff07404ee76bbee0265de1e9:2
    fireWith @ jquery.min.js?4c6dab2eff07404ee76bbee0265de1e9:2
    C @ jquery.min.js?4c6dab2eff07404ee76bbee0265de1e9:2
    n @ jquery.min.js?4c6dab2eff07404ee76bbee0265de1e9:2
    XMLHttpRequest.send (async)
    send @ jquery.min.js?4c6dab2eff07404ee76bbee0265de1e9:2
    ajax @ jquery.min.js?4c6dab2eff07404ee76bbee0265de1e9:2
    p.(anonymous function) @ jquery.min.js?4c6dab2eff07404ee76bbee0265de1e9:2
    getScript @ jquery.min.js?4c6dab2eff07404ee76bbee0265de1e9:2
    (anonymous) @ VM35754:6
    setTimeout (async)
    (anonymous) @ VM35754:2
    (anonymous) @ jquery.min.js?4c6dab2eff07404ee76bbee0265de1e9:2
    globalEval @ jquery.min.js?4c6dab2eff07404ee76bbee0265de1e9:2
    _e @ jquery.min.js?4c6dab2eff07404ee76bbee0265de1e9:2
    append @ jquery.min.js?4c6dab2eff07404ee76bbee0265de1e9:2
    (anonymous) @ window.js:3
    c @ jquery.min.js?4c6dab2eff07404ee76bbee0265de1e9:2
    fireWith @ jquery.min.js?4c6dab2eff07404ee76bbee0265de1e9:2
    C @ jquery.min.js?4c6dab2eff07404ee76bbee0265de1e9:2
    n @ jquery.min.js?4c6dab2eff07404ee76bbee0265de1e9:2
    XMLHttpRequest.send (async)
    send @ jquery.min.js?4c6dab2eff07404ee76bbee0265de1e9:2
    ajax @ jquery.min.js?4c6dab2eff07404ee76bbee0265de1e9:2
    loadContent @ window.js:3
    e.extend.$owner @ mootools-core.js?4c6dab2eff07404ee76bbee0265de1e9:38
    makeWindow @ window.js:3
    e.extend.$owner @ mootools-core.js?4c6dab2eff07404ee76bbee0265de1e9:38
    initialize @ window.js:3
    (anonymous) @ mootools-more.js?4c6dab2eff07404ee76bbee0265de1e9:27
    e.extend.$owner @ mootools-core.js?4c6dab2eff07404ee76bbee0265de1e9:38
    (anonymous) @ mootools-core.js?4c6dab2eff07404ee76bbee0265de1e9:37
    b.getWindow @ window.js:3
    addEvForm @ fullcalendar-min.js:3
    e.extend.$owner @ mootools-core.js?4c6dab2eff07404ee76bbee0265de1e9:38
    editEntry @ fullcalendar-min.js:3
    e.extend.$owner @ mootools-core.js?4c6dab2eff07404ee76bbee0265de1e9:38
    (anonymous) @ fullcalendar-min.js:3
    c @ mootools-core.js?4c6dab2eff07404ee76bbee0265de1e9:124
    w @ mootools-core.js?4c6dab2eff07404ee76bbee0265de1e9:128
    m @ mootools-core.js?4c6dab2eff07404ee76bbee0265de1e9:119
     
  2. troester

    troester Well-Known Member Staff Member

    Level: Community
    Did you clear all Joomla and browser cache?
    Did you only update Joomla or also Fabrik?
    Which exact Fabrik: 3.9 official version or some GitHub version?
     
  3. ontarget

    ontarget Member

    Level: Community
    Did you clear all Joomla and browser cache? YES
    Did you only update Joomla or also Fabrik? BOTH
    Which exact Fabrik: 3.9 official version or some GitHub version? https://github.com/Fabrik/fabrik

    I have rolled my installation back to v3.8.11 again and its working.
    I am going to try the project on a clean install of Fabrik and joomla just in case there was something else affecting it.
     
  4. troester

    troester Well-Known Member Staff Member

    Level: Community
    I assume this is an "old" calendar viz (not fullcalendar)?

    I can see an error, too.
    Slightly different
    Uncaught TypeError: jQuery(...).wickedpicker (resp. clockpicker) is not a function (date.js:603)
    coming from the new time pickers in the GitHub version.

    They are working in normal forms, popup forms and fullcalendar viz but not in old calendar viz.
    Smaller issues:
    https://github.com/Fabrik/fabrik/issues/2085

    Fabrik3.9 (with old datepicker) is working in old calendar viz (although I can see issues with updating modified events in the viz: you have to reload)
     
    Last edited: Feb 13, 2019
  5. cheesegrits

    cheesegrits Support Gopher Staff Member

    Level: Community
    Do you have both types of date picker on your form?

    There are now two date elements - the original 'date' which has been updated to use a better time picker, but still uses the old (deprecated) J! date picker widget, and the new 'jdate' element, which uses the "new" (since J! 3.7) J! date picker widget.

    A limitation of this is that you can't use both types of date element on the same form, as one of them overrides the Date.parseDate function needed by the other (outside my control, happens in J!'s JS).

    -- hugh
     
  6. ontarget

    ontarget Member

    Level: Community
    Hi Sorry for the slow response to this and thank you for the feedback.

    I assume this is an "old" calendar viz (not fullcalendar)? - NO I AM USING FULLCALENDAR
    The Date picker popup is ok but the Time picker elelement on the fabrik "date" plugin doesnt work in the frontend - ok in the backend.
    If i enable the clock type time picker i can see the clock but the time does not set after it has been selected

    I then enabled JDate plugin and unpublished the old Date elements setup new JDate start date and end date. However the fabrik form in the modal popup form becomes blank when they are enabled.
    Here is the console error

    jquery.min.js?4f34d84d7cacb4305c4c768fd44be4a1:2 Uncaught SyntaxError: Unexpected token <
    at eval (<anonymous>)
    at jquery.min.js?4f34d84d7cacb4305c4c768fd44be4a1:2
    at Function.globalEval (jquery.min.js?4f34d84d7cacb4305c4c768fd44be4a1:2)
    at text script (jquery.min.js?4f34d84d7cacb4305c4c768fd44be4a1:2)
    at jquery.min.js?4f34d84d7cacb4305c4c768fd44be4a1:2
    at C (jquery.min.js?4f34d84d7cacb4305c4c768fd44be4a1:2)
    at n (jquery.min.js?4f34d84d7cacb4305c4c768fd44be4a1:2)
    at Object.send (jquery.min.js?4f34d84d7cacb4305c4c768fd44be4a1:2)
    at Function.ajax (jquery.min.js?4f34d84d7cacb4305c4c768fd44be4a1:2)
    at Function.p._evalUrl (jquery.min.js?4f34d84d7cacb4305c4c768fd44be4a1:2)


    The JDate plugin and form works in the backend.
    I am using protostar template in the frontend
     
    Last edited: Feb 26, 2019
  7. ontarget

    ontarget Member

    Level: Community
    Update
    Actually the clock system works for Time picker on the Fabrik Date element however not the Numbers method with FullCalendar.
    However to set the time you must click the unlabelled button below the clock interface.
    <button type="button" class="btn btn-sm btn-default btn-block clockpicker-button"></button>
    It would be great in the next update if a button label could be added.
    As a work around you can edit
    /media/com_fabrik/js/lib/clockpicker/bootstrap-clockpicker.css
    Then create a background image button something like this:
    .clockpicker-button {
    background-image: url("images/settime.png");
    }
     
  8. cheesegrits

    cheesegrits Support Gopher Staff Member

    Level: Community
    Re the jdate on fullcalendar.

    I just committed a fix which would resolve one issue with jdate in popups:

    https://github.com/Fabrik/fabrik/commit/6f3c76dfc9a2067331c0b5ff353c5016e54bb0fb

    ... but your description of the issue doesn't match the problem I fixed. Your error is to do with an invalid JSON response, which usually indicates a PHP error getting inserted into a JSON response.

    Can you use your dev tools in browser, and take a look at the actual network response that is generating that error, and see what it says? You'll usually find a PHP warning embedded in the response.

    -- hugh
     
  9. cheesegrits

    cheesegrits Support Gopher Staff Member

    Level: Community
    I also just fixed an issue with jdate, where it wasn't correctly applying the TZ offset when displaying in forms.

    -- hugh
     
    startpoint likes this.
  10. ontarget

    ontarget Member

    Level: Community
    Thanks Hugh,
    Project is in a critical stage so i cant really swap my datepickers at the moment to test - i will setup a new project and try it out.
    I got the time part of the date element working with the sexy clock interface and people are happy with that - see my CSS fix to show the button to set the clock time.
     
  11. cheesegrits

    cheesegrits Support Gopher Staff Member

    Level: Community
    What's the issue with the number picker? I had to just add a z-index to it (in github now) to get it to show above the popup, but it works fine with the fullcalendar viz ...

    picker_001.png

    -- hugh
     
  12. cheesegrits

    cheesegrits Support Gopher Staff Member

    Level: Community
    The button label thing should be fixed as of this commit:

    https://github.com/Fabrik/fabrik/commit/dcf6c0ac53ebd19db1252df67e252524e1500450

    The problem was that we're using a Joomla.JText string for that, which gets added on the server side during form building, and picked up by the Joomla core Javascript on page load, so it can then be used like this when we set up the clock picker in our date JS ...

    Code (Text):

    'donetext': Joomla.JText._('JLIB_HTML_BEHAVIOR_CLOSE'),
     
    But ... because this use case in fullcalendar is in a popup, where the form building code runs as part of the AJAX call when opening the popup (rather than on initial page load), the JText strings added during that AJAX call weren't then getting added to the core Joomla options storage on the page.

    I added a line to our window JS to re-run Joomla.getOptions() on the new DOM content, which picks up and adds the new JText strings.

    -- hugh
     
  13. ontarget

    ontarget Member

    Level: Community
    Great thanks Hugh
    Attached is the popup time picker using the clock showing my CSS fix (red labelling) for the "submit time" button
    [​IMG]
     
    cheesegrits likes this.

Share This Page