jqueryDayField is broken

[ghost]

in https://www.yesodweb.com/book/forms#forms_synopsis jqueryDayField is a plain <input type=date> that allows any range

[schoettl]

Can you link the Hackage documentation of the function (with the package version you are using)?

Also, can you post the jQuery / jQuery CSS versions you're using?

[ghost]

https://www.stackage.org/haddock/lts-18.20/yesod-form-1.7.0/Yesod-Form-Jquery.html#v:jqueryDayField
the generated links looks weird, but they seem to work:

...
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/cupertino/jquery-ui.css">
...
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script><script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
...

[jezen]

the generated links looks weird

Just curious, what looks weird about them exactly?

[ghost]

there's no http: or https: before //

[jezen]

there's no http: or https: before //

This is a URL with an implicit or relative protocol. It just means it will pick the same protocol as the page the script is being called from.

https://developer.mozilla.org/en-US/docs/Learn/Common_questions/What_is_a_URL#:~:text=In%20this%20case%2C%20the%20browser%20will%20call%20that%20URL%20with%20the%20same%20protocol%20as%20the%20one%20used%20to%20load%20the%20document%20hosting%20that%20URL.

[schoettl]

The generated HTML should be fine but the generated JS code to initialize the date picker may not work anymore. Maybe jQuery or jQuery UI changed the API. Does the JS console in the browser show any exceptions on page load?

Maybe you find the bug in this piece of code:

        toWidget [julius|
$(function(){
    var i = document.getElementById("#{rawJS theId}");
    if (i.type != "date") {
        $(i).datepicker({
            dateFormat:'yy-mm-dd',
            changeMonth:#{jsBool $ jdsChangeMonth jds},
            changeYear:#{jsBool $ jdsChangeYear jds},
            numberOfMonths:#{rawJS $ mos $ jdsNumberOfMonths jds},
            yearRange:#{toJSON $ jdsYearRange jds}
        });
    }
});
|]

-- https://www.stackage.org/haddock/lts-18.20/yesod-form-1.7.0/src/Yesod.Form.Jquery.html#jqueryDayField

[ghost]

nope, there aren't any errors, but in the code the condition i.type != "date" looks odd, shouldn't it be i.type == "date"?

[schoettl]

I don't know how jqueryDayField and jqueryDatePickerDayField are meant to work.

Indeed, the JS has only effect on the date picker field which has input type text, i.e. jqueryDatePickerDayField.

EDIT: Sorry, I confused the lines, actually peng changed this line in 2014. Michael only changed the type signature.
@snoyberg You changed the jqueryDayField implementation in 2018. Do you remember what the difference of these two fields should be? Was it intended to change jqueryDayField to be a normal input type date?

[snoyberg]

I don't remember the details, sorry.

[schoettl]

So, apparently, there is only one "jQuery date field": https://jqueryui.com/datepicker/

I see no reason why jqueryDayField and jqueryDatePickerDayField shouldn't both use jQuery Datepicker.

My suggestion is to make them both acting same. For this, they must both be type text (which conforms to jQuery Datepicker documentation).

(i18n is still a problem... nowadays I would always prefer the native date pickers.)