Datepicker value disappears in custom form???

Ask the community
,
1

Hello,

I’ve created a custom form on a slideshow with a “Back” and “Next” button.

“Back” returns users to previous questions and “Next” button sends users to following questions.

My custom form has a datepicker and when users selects a date, continues with form and later returns to datepicker (if they wish to change the date), the value disappears.

How can I stop this?

2

@callumatchison

This is a bug in the wix platform. To get around it create a function that captures the selected date and then each time the user presses the back button on your slideshow run the function to set the date automatically to the previous captured date. Something like this…

function preventDateFromResetting() {
let stopWixGlitch = $w(“#datePicker1”).value;
$w(“#datePicker1”).value = stopWixGlitch;
}

//after date has been set run the function

preventDateFromResetting()

//run the function when the back buitton is pressed also

$w(‘#backButton’).onClick( function () {
$w(‘#slideshow1’).changeSlide(0);
preventDateFromResetting()
})

3

Hi Mike and thank you for your message. However, where would you advise I enter the code below? Thanks!

function showQuestion1() {
$w(‘#slideshow1’).changeSlide(0);
}

function showQuestion2() {
$w(‘#slideshow1’).changeSlide(1);
}

function showQuestion3() {
$w(‘#slideshow1’).changeSlide(2);
}

export function backbutton_click(event) {
showQuestion1();
}

export function nextbutton_click(event) {
showQuestion3();
}

$w.onReady( function () {
$w(“#datePicker”).onChange((event) => {
$w(“#datePicker”).valid ? $w(“#nextbutton”).enable() : $w(“#nextbutton”).disable();
})
})

4

In your $w.onReady(), you can do something like:

$w.onReady(function () {
  let dateValue; 
    $w("#datePicker").onChange((event) => {
        dateValue = $w("#datePicker").value;
        $w("#datePicker").valid ? $w("#nextbutton").enable() : $w("#nextbutton").disable();
    })
    $w("#slideshow1").onChange((event) => {
 if(typeof dateValue !== "undefined"){
            $w("#datePicker").value = dateValue;
        }
})
})

[UPDATED]

5

Thankyou, but what is “#fullWidthSlides1”? Wix says it’s not a valid sector.

6

replace it by “#slideshow1”

7

@jonatandor35

Thanks, but it still doesn’t work and this is what the console says when I tested it.

2462×408 42.6 KB

8

@callumsaffet it should work (I’ve updated the code above because the element selector was “#datePicker1” instead of “#datePicker”). Make sure you’re using the right property ID’s.

9

@jonatandor35 this is my screen:

2457×1282 247 KB

Select a date box = #datePicker3
Next button = #button5

The following appears in preview mode after I select a datepicker value, select the Next button, then select the Back button to return to the question.

2462×408 42.6 KB

10

@callumsaffet I can’t tell you what’s going wrong. I’ve tested the code and didn’t get any error.
But I can see that you’re using more than one $w.onReady() on the same page, and I think you better use one for the entire page, and put everything inside it (but that’s probably not the issue).

11

Okay, well thank you very much for you help. Not too sure how to fix this though :frowning:

12

I can see where the problem is. In line 74 (on your screenshot) it should be:

dateValue = $w("#datePicker3").value;

(Sorry for that)

13

@jonatandor35

After making the changes, the Back and Next buttons don’t work.

14

@callumsaffet This is not descriptive enough. What’s exactly happening? Is it disabled? Is it not click-able? Do you see any error in the console? what’s the code for these buttons?