jQuery Datepicker only works in the highest breakpoint

Community Beginner ,
Aug 24, 2017 Aug 24, 2017

Copy link to clipboard

Copied

Hello there,

I finally implemented a jQuery datepicker to my contactform and it is working. But as soon as I hit my next breakpoint when I resize my browser I can't click on it anymore, it just won't show up although it is definitely in the html file. I assigned the ID of a text field to the datepicker and it works just fine in the highest breakpoint. The ID also does not change when i resize my browser window. Also when I add a new higher breakpoint it will just show in the new (higher) one.

What can I do to make it show in every breakpoint? This date field should really be a standard feature for contact form widgets.

This is the website I'm talking about:

Test

I'm talking about the field with the labels Anreisedatum and Abreisedatum.

Thank you for your help!

Views

669

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Aug 24, 2017 Aug 24, 2017

Copy link to clipboard

Copied

what adobe program?

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Aug 24, 2017 Aug 24, 2017

Copy link to clipboard

Copied

Adobe Muse. I thought I posted in the correct category. Sorry

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Aug 24, 2017 Aug 24, 2017

Copy link to clipboard

Copied

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Aug 25, 2017 Aug 25, 2017

Copy link to clipboard

Copied

By the way, this is just custom jQuery inserted in the <head> element directly in Muse, not a jQuery widget or anything and as far as I know it's a feature of Muse to be able to handle jQuery.

I also found out, that the <div> elements get a new class after they hit the first breakpoint and the classes remain like that throughout the whole other breakpoints. So the classes in the first breakpoint are different from all other breakpoints.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Sep 01, 2017 Sep 01, 2017

Copy link to clipboard

Copied

I'm still waiting for a response. Isn't there anybody who can answer my question, not even someone from the Adobe staff?

My client wants to use this datepicker.

Best regards

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Sep 04, 2017 Sep 04, 2017

Copy link to clipboard

Copied

I even tried to use Adobe chat, but they told me I'm stuck with forums because they just give answer related to the application, not with programming.

Isn't there really anyone on earth who can answer this question?

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Sep 05, 2017 Sep 05, 2017

Copy link to clipboard

Copied

Maybe I'm annoying or something like that but I really need to fix this problem.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Sep 05, 2017 Sep 05, 2017

Copy link to clipboard

Copied

There was an issue with forms recently with another kind, I guess.

Maybe you have to use the date picker and insert the html into a widget?

Bildschirmfoto 2017-09-05 um 17.06.54.png

found on muse widgets.com

For this you would maybe need one of these widgets to insert html and this widget needs to be hidden in other breakpoints.

You would need this widget in every breakpoint and hide in other breakpoints?

Best Regards,

Uwe

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Sep 05, 2017 Sep 05, 2017

Copy link to clipboard

Copied

Thank you for answering!

Unfortunately, this didn't work either.

I inserted all of this code inside the widget:

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">

  <link rel="stylesheet" href="/resources/demos/style.css">

  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>

  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<script>

$( function() {

$( "#widgetu150403_input" ).datepicker({

dateFormat: "dd.mm.yy",

firstDay: 1,

minDate: 2,

currentText: 'Heute',

dayNames: ['Sonntag', 'Montag', 'Dienstag', 'Mittwoch', 'Donnerstag', 'Freitag', 'Samstag'],

dayNamesMin: ['So', 'Mo', 'Di', 'Mi', 'Do', 'Fr', 'Sa'],

monthNames: [ 'Januar', 'Februar', 'März', 'April', 'Mai', 'Juni', 'Juli', 'August', 'September', 'Oktober', 'November', 'Dezember'],

} );

} );

</script>

<script>

$( function() {

$( "#widgetu150407_input" ).datepicker({

dateFormat: "dd.mm.yy",

firstDay: 1,

minDate: 2,

currentText: 'Heute',

dayNames: ['Sonntag', 'Montag', 'Dienstag', 'Mittwoch', 'Donnerstag', 'Freitag', 'Samstag'],

dayNamesMin: ['So', 'Mo', 'Di', 'Mi', 'Do', 'Fr', 'Sa'],

monthNames: [ 'Januar', 'Februar', 'März', 'April', 'Mai', 'Juni', 'Juli', 'August', 'September', 'Oktober', 'November', 'Dezember'],

} );

} );

</script>

This code works, if I put in the head part. But not when I put it before the closing body tag.

Best regards!

Sebastian

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Sep 05, 2017 Sep 05, 2017

Copy link to clipboard

Copied

I am sorry, I search some more.

Uwe

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Sep 06, 2017 Sep 06, 2017

Copy link to clipboard

Copied

Thank you very much, that would be awesome!

Best regards!

Sebastian

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Nov 13, 2017 Nov 13, 2017

Copy link to clipboard

Copied

LATEST

Whether you put the datepicker on the head or before ending body tag, it will work on both cases. Can you see what error you get on chrome console when the datepicker is on the ending body ?

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Sep 08, 2017 Sep 08, 2017

Copy link to clipboard

Copied

So, now happened what I was afraid of. Our customer will just pay the rest of the money if this works.

Please, we really need this to work, otherwise all our efforts were in vain.

Thanks to fotoroeder anyway for at least trying to think of something!

Best regards!

Sebastian

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Sep 08, 2017 Sep 08, 2017

Copy link to clipboard

Copied

Did you try other widgets?

Maybe one of these could help as well, additionally?

Bildschirmfoto 2017-09-08 um 14.14.59.png

Bildschirmfoto 2017-09-08 um 14.17.46.png

Maybe check for this:

Bildschirmfoto 2017-09-08 um 14.30.30.png

or this:

Bildschirmfoto 2017-09-08 um 14.31.42.png

Best Regards,

Uwe

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Sep 08, 2017 Sep 08, 2017

Copy link to clipboard

Copied

Also here:

Bildschirmfoto 2017-09-08 um 14.32.44.png

It might be a question of money though.

Unfortunately

Uwe

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines