nuBuilder Forum

Posted: **Sun Aug 14, 2022 2:04 pm**

Hello,
I'm using an Input field (datetime-local).
In order to change the weekday in another field I've added following custom code (oninput).
Unfortunately it's not possible to select the date / time per calendar pop-up anymore - it's only possible to fill in the date and time directly into the field.

Does anyone know how to change the custom code to enable the calendar pop-up widget again?

Thanks in adavance
BR, Oli

Code: Select all

if(nuIsNewRecord()){
    // Set Value in field kal_saison
    var startdatum = $("#kal_startzeit").val();
    var monat = startdatum.substr(5, 2);
    var jahr = startdatum.substr(0, 4);
    
    if(monat>7){
        var saison = jahr + "/" + parseInt(parseInt(jahr) + 1);
    }else{
        var saison = parseInt(parseInt(jahr) - 1) + "/" + jahr;
    }
    
    $('#kal_saison').val(saison).change();
}

// Get the day of the week based on the selected date
var startzeit = $("#kal_startzeit").val();
wochentag = new Array("Sonntag", "Montag", "Dienstag", "Mittwoch", "Donnerstag", "Freitag", "Samstag");
var day = new Date(startzeit).getDay();
var tag = wochentag[day];
$('#kal_wochentag').val(tag).change();     

// Set field kal_endezeit based on kal_startzeit
$('#kal_endezeit').val(startzeit).change();

Posted: **Sun Aug 14, 2022 6:50 pm**

Hi,

Should the calendar pop up for kal_endezeit ?

And is this code relevant for your question?

Code: Select all

if(nuIsNewRecord()){
    // Set Value in field kal_saison
    var startdatum = $("#kal_startzeit").val();
    var monat = startdatum.substr(5, 2);
    var jahr = startdatum.substr(0, 4);
    
    if(monat>7){
        var saison = jahr + "/" + parseInt(parseInt(jahr) + 1);
    }else{
        var saison = parseInt(parseInt(jahr) - 1) + "/" + jahr;
    }
    
    $('#kal_saison').val(saison).change();
}

Could you also upload a screenshot of your object that shows what the format of the value looks like?

Posted: **Mon Aug 15, 2022 12:12 pm**

Hi Kev1n,

kal_endezeit works fine and I can use the calendar pop-up on this field.

The problem occurs on the field kal_startzeit (Label: Startzeit). Whenever I want to use the calendar pop-up the focus jumps to the field kal_wochentag (Label: Wochentag) and no pop-up appears.

screenshot_1.jpg

The posted code is the custom code of the field kal_startzeit and this code is causing the issue.
Because I try to set the value of the correct day of the week in the field kal_wochentag based on the selected date of the field kal_startzeit.
I guess that this part of the code is triggering the change of the focus to the field kal_wochentag and prevents the calendar pop-up.

kal_startzeit_custom-code.jpg

kal_startzeit.jpg

Was this information helpful to understand the problem?

Posted: **Mon Aug 15, 2022 12:52 pm**

I don't seem to be able to replicate this issue on my side.

https://test.nubuilder.cloud/
User Home -> Datepicker Test

Posted: **Mon Aug 15, 2022 2:23 pm**

Thank you Kev1n.

It was no issue with the code but the field "Wochentag" was too close to the field "Starttag".
It seems that there was an overlapping of both fields in the background and the calendar icon partially lies over the field "wochentag".
After moving "Wochentag" a few pixels everything worked fine.

Thanks a lot!

Posted: **Sun Jul 30, 2023 12:53 am**

Hello,
How can I do something like this but with nuDate (Data Type: date)?
With Datetime-Local works great but with nuDate doesn't.
I try nuDate with yyyy-mm-dd, dddd format. Looks fine with first set but works terrible if try to change date and Your way has more potential.

Have a nice day.

nuBuilder Forum

Calendar pop-up doesn't work on Input field

Calendar pop-up doesn't work on Input field

Re: Calendar pop-up doesn't work on Input field

Re: Calendar pop-up doesn't work on Input field

Re: Calendar pop-up doesn't work on Input field

Re: Calendar pop-up doesn't work on Input field

Re: Calendar pop-up doesn't work on Input field