Hi everyone, @mgol,

I have an issue with the jQuery UI Autocomplete widget after migrating from version 1.12.0 to 1.13.0 to fix security issues. This new version doesn't work smoothly. The results display on the screen slowly and sometimes freeze the UI.

Below is an example that I reproduced to demonstrate the speed difference between the 2 versions of jQuery UI.

• 1.12.0: https://codepen.io/tructapi/pen/GRMzBwL
• 1.13.0: https://codepen.io/tructapi/pen/eYGxjXR

The environment and libraries I use:

• Chrome 97.0.4692.71
• jQuery 3.6.0

Steps to reproduce

1. Type a few characters into the textbox and wait for the results to appear.
2. Clear all characters in the textbox by pressing the backspace key on the keyboard.

Result:

• 1.12.0: the results show up quickly (1-2 seconds) and I can change the characters in the text box to next search.
• 1.13.0: very slow display results (5-6 seconds), screen freezes and I can't do anything.

Anyone have a solution for this issue? @mgol, I think this is a bug and it affects the user experience.

Many thanks,
Tapi

dropdown is too slow to render when data is close 5000. How to limit options like show first 100 data then add option like more data avaible then when clicked on this it bring another 100 and so on

To reproduce simply use the Themeroller attached below.

It has a backgroundcolor for hover state (a red one) configured.
When opening the Dialog you can see the ok Button is already in hover State.
But the really strange thing is: When you open Dev-Tools, hover State disappears and everything works as expected.
It can be reproduced with Firefox as well as Chrome.

https://jqueryui.com/themeroller/#!zThemeParams=5d00008000d805000000000000003d8888d844329a8dfe02723de3e5700bbb34ecf36cdef1e1654faa0015427bdb9eb45ebe89aaede0ec5f0d92417fcc6551ce804ff46bf543167700d2cf4e583f2515147aacb86ffa11c0e588dae72a13c98dc37478199f7eea536e99705404149ad3e00bc8b1ab61d369a189b8543dfe7c6f3b8773513a278552790da0a3ff391cfa52421f68c6fa7223f7e87b0f0d8410077deb02c07796d7baf36e6281ad8154b7e79274ba2809c56dd4c8ced5a6a8ee71375703912c06842ac53fb1ef3d881a18eb5c3d861a2ba189277ed605f7b709af46f8e83dd6ba4da1d640356231cacd8c403b352edec8c0ebebc1984e825f669a6ce394187e8af35766688dae80ac7f0b6093ef6cc5bca63e9cadd47525819e262c0fb514bfab42ada2241f5b62ab018de2b786e59487fad43240cb6de3b8e65a140d4707fedb0d26f19777105785a55af6c4d1f8edacb855bcc6e02eca424dbdcb94a814f58df3e330a1ab73c8197df50597a693eb4fe65ce4f736e875f3c9a0ec187e16312e4afc0a928463c2aa4300cceccf0da72fd6c8ca2cfc6e02fc5b542ebb69a074392ebc865f3f917307b8b6a8bf6c313b83d3ad080e9c472ebb7cc8d3a1b2856931a1933df889c44d96ff33eeefaee4f4c8fff2a25c2e

When using selectable on html elements with css transform constraints such as scale, translate, the lasso position will be offseted by alot. The calculation is not working anymore.
Previously I found out a fix myself, however this one is not working anymore:
https://stackoverflow.com/questions/48097407/jquery-ui-selectable-css-transform-issue

Chrome 96:

A page or script is accessing at least one of navigator.userAgent, navigator.appVersion, and navigator.platform. Starting in Chrome 101, the amount of information available in the User Agent string will be reduced.
To fix this issue, replace the usage of navigator.userAgent, navigator.appVersion, and navigator.platform with feature detection, progressive enhancement, or migrate to navigator.userAgentData.
Note that for performance reasons, only the first access to one of the properties is shown.

When format in ('mm/yy' or 'yy-mm') the expression "date.getDate() !== day" will be true, but there is no need to judge the "day" variable.

Stupid question, but I installed this repo via NPM and I want to import it locally.

Where is the file jquery-ui.min.js ready to use, that you get for example from here?

Normally every npm project has a dist/ directory from where you can fetch the files ready to use.

Hello, jquery-ui community!

We consume jQuery-ui library through a following nuget package - jQuery.UI.Combined - on my project. However, this package has not been updated recently and it lacks the 1.13.0 version of the library.

We are forced to make an upgrade to 1.13.0 due to a recent security issue found in jquery-ui 1.12.1, however it is impossible to do that via a nuget package right now.

Could you upload the most recent jquery-ui version as a nuget package, please, if this is possible at all?
Thank you.

The fiddle shows the problem (reproducible in FF and Chrome):
https://jsfiddle.net/cLwn4do7/1/

When the button is automatically opened, it shows the blue focus-ring, but if it is opened by a click-event (link or button), then the blue focus-ring is not shown.

The fiddle is a minimal modified code from the official example at https://jqueryui.com/dialog/#modal-message

Please see the demo of the issue here: https://jsfiddle.net/ea8utdyx/

Here are the steps to reproduce the problem:

1. Use a nonstandard date format, like 'D M d yy'
2. Pass dayNamesShort, example: dayNamesShort: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"],
3. Pass a callback function to beforeShowDay argument

Notice that the date which is passed to the beforeShowDay callback is incorrect, it's about 6 years in the future. As a result, we cannot determine if a date should be visible or not.

In the demo, I have added console.log, which in the callback, you can check that it doesn't log the correct date.

I notice the problem doesn't happen when we comment the dayNamesShort argument.

After upgrading from 1.12.1 to 1.13.0 dragging an item to a sortable causes the helper to go out of page when it is over the sortable.

The code to create the draggable is below.

	$('#widgets .available-widgets .widget-panel').draggable({
			helper: 'clone',
			distance: 10,
			connectToSortable: '.widget-area',
		});

Same code works fine on 1.12.1. Feel free to close if this is already reported since I saw some other issues with draggable on 1.13.0

Inside a dialog when start scrolling it's content, if a selectmenu was opened, the items container shows like a fixed element.

Steps:

1. Click on select menu to show items
2. Using the mousewheel, start scrolling down

Result: Items remain visible, fixed and on top of the rest of the content

Expected: Maybe the items must hide or move along with the select menu.

The same happens with the datepicker widget

Demo: ​http://jsfiddle.net/w8bqpmev/

Github webhook with Jenkins doesn't work.

jQuery: v3.6.0
jQuery UI: - v1.12.1 (with 3.6.0) - 2021-06-12
jQuery UI: - v1.13.0 (with 3.6.0) - 2021-06-12 (still broken)

Drop animation is broken, I'm not sure about other animations since I haven't tried.
Basically, after completing the animation hide-drop animation, the element is showing again. however this is happening in some specific case. This animation works correctly in jQuery UI - v1.11.4 - 2021-06-28

I tried using jQuery 3.6.0 but unfortunately lots of other UI elements, animation and components are broken too so I had to downgrade back to jQuery 1.11.3 to get website working again.

Issue
Clicking on menu1~3 will hide title and then show submenu1~3.
After mouse leave the menu, animation will trigger (a 1 second timer) and hide submenu1~3 and show title again.
This doesn't work on menu1 and 2 but works on menu3. after completing hide-drop animation, sub menu 1 and 2 show again over title which is also visible.

Additional Info
Now if you add

<div id="menu4" class="submenu hidden"></div>

after menu 3, menu 3 will show same symptoms too but not menu4. Same way if you remove submenu 3, sub menu 2 will work correctly (last menu item is the only one working as expected).

This works correctly on 1.11.4 but something else is broken in 1.11.4 and that was my reason to upgrade to 1.12.1

Following is the test code that I am using (attached as file too)

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport" />
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <!--script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.min.js"></script-->
    <!--script type="text/javascript" src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script-->
    <script type="text/javascript" src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
    <script type="text/javascript">
        var MenuTimer;
        $(function () {
            $('.button').button();
            $('.menu a').hover(
                function () {
                    clearTimeout(MenuTimer);
                },
                function () {
                    MenuTimer = setTimeout(function () {
                        $('.submenu').hide('drop', { direction: 'up' });
                        $('.title').show('drop', { direction: 'right' });
                        $('.menu a').blur();
                    }, 1000);
                }
            )

            $('.menu').on('click', 'a', function () {
                $('.submenu').hide();
                $('.title').hide('drop', { direction: 'right' });
                $('#' + $(this).attr('data-id')).show('drop', { direction: 'up' });
                if ($(this).attr('href') == '#')
                    return false;
            });
        });
    </script>
    <style type="text/css">
        .hidden { display: none; }
        .title { position: absolute; top: 0px; left: 0px;background-color:red }
        .submenu { position: absolute; top: 0px; left: 0px;background-color:green }
        .menu { flex-grow: 2; display: flex; flex-direction: column; }
        .header { height: 126px; }
    </style>
</head>
<body>
    <div class="header">
        <div class="m-1 menu">
            <div class="mainmenu">
                <a href="#" class="button" data-id="menu1">menu1</a>
                <a href="#" class="button" data-id="menu2">menu2</a>
                <a href="#" class="button" data-id="menu3">menu3</a>
            </div>
            <div style="flex-grow:2; position:relative;">
                <div class="title">TITLE TITLE TITLE TITLE TITLE</div>
                <div id="menu1" class="submenu hidden">
                    <a href="#" class="button">Sub Menu 1</a>
                </div>
                <div id="menu2" class="submenu hidden">
                    <a href="#" class="button">Sub Menu 2</a>
                </div>
                <div id="menu3" class="submenu hidden">
                    <a href="#" class="button">Sub Menu 3</a>
                </div>
            </div>
        </div>
    </div>
</body>
</html>

1.html.txt

Every widget i'm using from the jquery UI has a .prototype, but not datepicker.
I've found this issue by trying to overwrite classes, as per the guide here.

Here's my code snippet, which works for every widget, except datepicker:
$.extend( $.ui.selectmenu.prototype.options.classes, { "ui-selectmenu-menu": "custom-class-name" });

The NPM package and/or this repo doesn't have the minified jquery-ui js? There's also no documentation on building it manually. What's the point of having an npm is I have to use a manual process to get the complete file?

Hi everyone,
I use jquery-ui: 1.13.0 in particullary widget draggable.js, in Angular 12. Bu when I refresh the page I get this error:
Uncaught TypeError: Cannot read properties of undefined (reading 'mouse')
at draggable.js:39
at draggable.js:35
at draggable.js:37

Could anyone help me?
I could possibly also open a pull request because I added a code snippet that handles the error.

Thanks, I'm waiting for updates.

Hello there i was testing a Selector : DatePicker and added a date range with years -100 and + 100

props.setDatePicker = (idItem) => {
let _default = $(#${idItem}).val();
if (_default === "01/01/0001")
$(#${idItem}).val(null);
$(#${idItem}).datepicker({
showOn: 'focus',
changeMonth: true,
changeYear: true,
altFormat: "mm/dd/yy",
dateFormat: "mm/dd/yy",
yearRange: "-100:+100",
beforeShow: function () {
setTimeout(function () {
$('.ui-datepicker').css('z-index', 99999999999999);
}, 0);
},
onClose: function (date, datepicker) {
datepicker.input.valid();
}
});

And when i select a date with +100 years or - 100 years such as 05/24/2123 manually as an example ,the year 1921 is auto selected on my html input to 1921

I thought I had a bug in my project after upgrading to jQuery 3.6.0 and jQuery UI - v1.13.0 but this is reproducible with downloading the full jQuery UI as of today:

Not just hovering, but any mouse move on any of the items in the autocomplete result list clones every item inside .ui-helper-hidden-accessible DOM element. Keep going and the debug console scrollbar starts to become very small.

Is this the intention? I have some performance concerns here over cloning so many elements in a hidden DOM, therefore polluting the DOM significantly.

Description

I am not fully understanding why this simple code is not working,
it's a simple accordion like thingy,
I'm pretty sure it was working with previous version of jquery / jqueryui but with 3.5.1/1.12.1 and 3.6.0/1.13.0 it is not.

Link to test case

https://jsfiddle.net/apos2d3u/

This may not be the correct place to post this issue but there seems to be a problem with the HTTPS certificate at https://jqueryui.com/ and thus it is impossible to access the documentation or download functions there. Firefox gives the error: SEC_ERROR_REVOKED_CERTIFICATE

Hi, I noticed there are icons being downloaded which are slowing down my site. I only use the accordion and tag features on my site and do not need the icons. Can you let me know how I would remove this from the download?

This is what shows up on my waterfall and is taking quite a bit of time to load:
https://www.cuisineandtravel.com/wp-content/uploads/tag-clouds-color/images/ui-icons_ffffff_256x240.png
https://www.cuisineandtravel.com/wp-content/uploads/tag-clouds-color/images/ui-icons_444444_256x240.png

Upgrading jquery-ui from 1.12.1 to 1.13.0 seems to have introduced an exception coming from sortable.

jQuery: 3.6.0
jquery-ui: 1.13.0 (not present in 1.12.1)

When you first drag a sortable component, the page freezes, and this error appears in the console:

Uncaught TypeError: Cannot read properties of undefined (reading 'vertical')
    at $.<computed>.<computed>._intersectsWithPointer (sortable.js:595)
    at $.<computed>.<computed>.<anonymous> (widget.js:123)
    at $.<computed>.<computed>._intersectsWithPointer (widget.js:123)
    at $.<computed>.<computed>._mouseDrag (jquery.mjs.nestedSortable.js:203)
    at $.<computed>.<computed>._mouseDrag (widget.js:123)
    at $.<computed>.<computed>._mouseStart (sortable.js:316)
    at $.<computed>.<computed>.<anonymous> (widget.js:123)
    at $.<computed>.<computed>._mouseStart (widget.js:123)
    at $.<computed>.<computed>._mouseMove (mouse.js:150)
    at $.<computed>.<computed>.<anonymous> (widget.js:123)

It looks to come from this line in sortable.js, while evaluating this.dragDirection.vertical.

The only recent commit to sortable.js is 70dae67, but the file history shows a few other commits that I think were added after 1.12.1, so that may be misleading.

This seems to have a lot in common with issue #1991, though I suspect they're distinct.

A lot of node developers use the jquery-ui-dist package to get the min versions of jquery-ui into there projects. Can someone update that package so it also uses 1.13.1?

https://www.npmjs.com/package/jquery-ui-dist/v/1.13.0

We encountered a problem where the datepicker position would be incorrect for a date input inside a Bootstrap modal. The datepicker would end up offscreen, far below the actual input element.

The culprit was this line of code (as well as the line above it):

https://github.com/jquery/jquery-ui/blob/main/ui/widgets/datepicker.js#L931

This code uses strict equality (===) to compare two floating-point numbers; not pixels, but fractions of pixels. Here's how we fixed it (and how the line above it should be fixed):

                offset.left -= ( this._get( inst, "isRTL" ) ? ( dpWidth - inputWidth ) : 0 );
                offset.left -= ( isFixed && offset.left === inst.input.offset().left ) ? $( document ).scrollLeft() : 0;
-               offset.top -= ( isFixed && offset.top === ( inst.input.offset().top + inputHeight ) ) ? $( document ).scrollTop() : 0;
+               offset.top -= ( isFixed && Math.floor(offset.top) === Math.floor( inst.input.offset().top + inputHeight ) ) ? $( document ).scrollTop() : 0;
 
                // Now check if datepicker is showing outside window viewport - move to a better place if so.
                offset.left -= Math.min( offset.left, ( offset.left + dpWidth > viewWidth && viewWidth > dpWidth ) ?

e.g. in component autocomplete, the attribute autocomplete is set to off to prevent the browser from autofilling. In many cases the browser ignores this attribute with "off". It looks like setting "one-time-code" will prevent it from autofilling.

Hi, I'm with the OpenJS Foundation and we are migrating projects that use the old JSF CLA bot over to the new OpenJS CLA using EasyCLA. If you're a regular contributor you'll want to keep reading for some tips on handling the transition. The JSF CLA bot is no longer working and so we are doing this migration over the next few days. If you've already signed the OpenJS Foundation CLA using EasyCLA, you will see no impact. One signature is all that's required across all OpenJS Foundation projects.

First, some brief background. A few years ago the JS Foundation merged with Node.js Foundation to form the OpenJS Foundation. The JS Foundation required a CLA, and operated a bot to enforce signatures. The OpenJS Foundation no longer requires projects to use a CLA; it is left to each project's maintainers to decide whether to use the DCO (at minimum) or the OpenJS Foundation CLA.

For projects that continue using a CLA, two big things changed. First, we're using a different tool called EasyCLA. It is developed and managed by the Linux Foundation (including the underlying infrastructure). CLAs can be signed either by individuals acting on their own behalf, or signed by companies on behalf of their employees. Also, because we're working from a centralized CLA infrastructure, contributors who sign the OpenJS Foundation CLA once are covered for any other OpenJS Foundation projects.

Second, we've changed the text of the CLA. The JSF CLA was essentially a bespoke wrapper around the text of the DCO, which meant contributors (and their legal counsel) would have to evaluate something completely new. In keeping with the Principle of Least Astonishment, we've changed to the much more common Apache-style CLA templates. If you need your company to sign your CLA, there's now a much better chance your counsel will recognize what they're seeing.

Because the organization and the CLA text have both changed, we can't continue to use the old signatures. Subsequent contributions will require you to sign the new document. To be clear, this only applies to new contributions; prior contributors do not need to go back and re-sign the document unless they make a new contribution.

So what do you need to do? You can always just wait until the bot is enabled and sign the doc when you open your first PR. If you aren't already in the system, it'll leave a comment on your PR with a link to follow. If you want to make things easier, or if you're a high-volume contributor and want to get it out of the way early, you can pre-sign the OpenJS Foundation CLA by opening a trivial PR against this repo (we periodically close open PRs).

If you have any questions, please ask!

Is it possible to lock parent elements on the sortable component but leave the children to be sortable?

For instance: https://jsfiddle.net/5mvLfw74/

I would like to sort items 11 and 12 but looks like since the parent is on the cancel selector the whole "tree" is locked.

For what i see the issue might be coming from

Looks like the closest element that matches the cancel selector is the parent and then the mouse event is not triggered

Our package.json has jQuery as a dependency 3.5.1 and jQuery-UI has a it at >1.8.0 & <4.0.0
However when doing a Yarn install, two version of jQuery are installed. 3.5.1 and 3.6.0, which breaks jQuery-UI.

When I request jQuery to set at 3.6.0 or ^3.5.1 (3.5.1 and up) its works fine.
Before, a node_modules was added to jQuery-UI folder inside node_modules.

We have it working now, but just wanted to mention it for others who had similar issues, and comments in case we were doing something wrong?

Please update jquery-ui-dist npm package to 1.13.1 (it's currently 1.13.0) Thanks

I am having some issues with my project when trying to import JQuery UI css files. I have added the following to my projects' App.scss file.

@import url("../node_modules/jquery-ui/themes/base/all.css");

When I try to build my web application (react/typescript) I get the following error.

> ./src/App.scss Error: resolve-url-loader: CSS error   Invalid mapping:
> {"generated":{"line":10,"column":538},"source":"file://C:\\Jenkins\\workspace\\MyWebApp\\node_modules\\jquery-ui\\themes\\base\\base.css","original":{"column":null},"name":null}

Whats strange is when I open look in base.css which is the file the error is being thrown I can see that there are additional imports all being imported with the format - @import url("file.css")

When I adjust the imports in base.css to the format - @import "file.css" then the application builds successfully.

Can anyone explain why this is happening or how to fix this without modifying the package directly? I am not that familiar with resolve-url-loader

Help Required.docx
Help Required.pdf

We are using the JQuery-UI product (version 1.12.1) in our application and had a few queries around it.
Background :-
We were using JQuery-UI (1.10.4) in our product and we started an upgrade to 1.12.1 version. During the upgrade, we found that the i18n folder which was available in the 1.10.4 has been removed in 1.12.1 version.

Few queries around this –

1. Can you let us know why the folder was removed?
2. What is the alternative for these files in 1.12.1 formal download?
3. We have seen the JQuery blog which also lists the JQuery-UI versions and their respective files. On this Github link we have the version 1.12.1 available. This link also contains the i18n folder.
   Can this folder be used for the purposes of Language Support in our application ?
   https://blog.jqueryui.com/2016/09/jquery-ui-1-12-1/

Git (contains source files, with @Version replaced with 1.12.1, base theme only)
http://github.com/jquery/jquery-ui/tree/1.12.1

I've got a very specific bug that only happens when I have a datepicker in a position: fixed element and the html font-size is not set to 12px and the root scroll container is not scrolled to the top.

• It works correctly in other Chomium browsers like Edge.
• It works if the font-size is exactly 12px.
• It works if the element it is in anything other than a position: fixed element (such as position: sticky).
• It works if you are scrolled to the top of the page.

It happens in both 1.12.1 and 1.13.0.

I know it's a pretty specific issue that I'm not sure how easy it will be to reproduce. I'll try to set something up. But I'm hoping the symptoms might be enough for someone who knows the code.

In the meantime, is there a method that can be called to recalculate the position? Or is there an option that can be set to tie the position/scroll linkage to a certain parent (other than the root element? (sometimes scrolling the main window doesn't move the element the picker should be attached to, yet the picker scrolls).

Hi team.

I have found an issue in the latest release (1.13.0) when my self content function of the tooltip plugin returns an empty string, the problem not appears at the same moment but appear when you try to do something in other widgets of the user interface.

As an example, I have write the proof of concept that creates a datepicker after programs the tooltip plugin, if you use the previous month button, all works fine but when you move the mouse to the next month button, the problem appear and when you try to do a click in the button, a javascript error appear.

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>TEST</title>
    <link href="jquery-ui-1.13.0/jquery-ui.css" rel="stylesheet">
</head>
<body>
    <script src="jquery-ui-1.13.0/external/jquery/jquery.js"></script>
    <script src="jquery-ui-1.13.0/jquery-ui.js"></script>

<script>

"use strict";

$(function() {

    $(document).tooltip({
        items:"[title][title!='']",
        content:function() {
            var title = $(this).attr("title");
            if (title == "Next") {
                return "";
            }
            return title;
        }
    });

    $("body").append("<div id='datepicker'></div>");
    $("#datepicker").datepicker();

});

</script>

</body>
</html>

Thanks in advance.

Josep.

We are upgrading from 1.10.4 to 1.12.1, dialog transition is not smooth as before. we found that ui-effects-wrapper class does not wrap, any particular reason ?

1.10.4

1.12.1

We're running jquery-ui version 1.10.0, and all my endeavors to update to any version greater than 1.10.4 results in $.datepicker being undefined.

Our import order is

1. jQuery (3.5.0)
2. jQuery-migrate (3.3.2)
3. jQuery-ui

The next file being imported is where we extend the default datepicker functionality in this manner:

; (function () {
        var oldMethod = $.datepicker._doKeyDown;
        var oldGenerate = $.datepicker._generateHTML;

        $.extend($.datepicker, {
		_doKeyDown: function (event) { ... },
		_generateHTML: function () { ... },
                _gotoToday : function(id) { ... }
        });
})(window.$);

This throws an error on the first line, when trying to access the _doKeyDown on the undefined $.datepicker object. We use $.datepicker extensively throughout our codebase.

I see from the changelogs to jQuery-1.11 that the way widgets are wrapped has changed, is there a relation to my problem?

Added: AMD support via UMD wrappers. (96e027e, 1216e2a)

https://jqueryui.com/sortable/#display-grid

No longer drops into place.

Hello, currently in our project we are using jquery-ui widgets as a separate modules like this:

import dialog from "jquery-ui/ui/widgets/dialog";

dialog({ ...options }, document.querySelector(".some-element");

However in 1.13.0 we cant use widgets this way, now it fails to initialize a widget with an error:
Uncaught TypeError: Cannot read properties of undefined (reading '_createWidget')

Even though you still able to use widgets "normally":

import "jquery-ui/ui/widgets/dialog";

$(".some-element").dialog({ ...options });

would be nice to fix this issue, especially since it looks unintended.

I believe problem was introduced in this commit: 70dae67
By adding "use strict" now this code: https://github.com/jquery/jquery-ui/blob/1.13.0/ui/widget.js#L80 fails, since this is undefined.

When showing multiple months and the current month is not displayed first (e.g. because of maxDate: 0), the user needs to click the previous button multiple times in order to see any effect.

In this example 3 clicks are needed https://jsfiddle.net/m3528fdb/, which makes the button seem broken initially. The number of required clicks depends on the values for stepMonths and maxDate.

I use sortable in a HTML table.
Everithing was quite great until I put some hidden cols in the table.
In this case, the table shrinks when I try to move a row.
I made a jsFiddle to reproduce the problem :
https://jsfiddle.net/bdesprez_thalassa/eoxdtjn1/10/

Having this CSS:

*
{
    box-sizing: border-box;
}

If you try to resize a dialog, then the inner content (ui-dialog-content) is resized wrongly

See this fiddle: http://jsfiddle.net/QBqff/2/

A workaround is suggested in https://bugs.jqueryui.com/ticket/9137

Using this CSS:

.ui-resizable, .ui-resizable * {
    box-sizing: content-box;
}

but that affects the size of several elements I have inside the dialog

The active state for menu items in the default theme has a blue background and all the other themes I checked makes the active item stand out visuall... but the smoothness theme only adds a light gray border. It's also different from how it looked in 1.12. I'm not sure if this is a bug or intentional. Either way, I think it could be improved.

Uncaught TypeError: $.uniqueSort is not a function
    at processClassString (jquery-ui.js?id=44a2af31b10434ff00c4:3226)

See eventum/eventum#1256,
and eventum/eventum#1240 discussion

But the 1.3.0 release post says jquery 1.8+ remain supported:

Support for jQuery 1.7 has been dropped; jQuery 1.8 & newer remain supported.

• https://blog.jqueryui.com/2021/10/jquery-ui-1-13-0-released/

Hey folks,

We're trying to update jquery-ui on cdnjs, but it looks like this repo as well as the NPM package only distribute jquery-ui in its assorted parts, rather than shipping a pre-built JS bundle like you get if you use the code.jquery.com CDN or the download option on the site.

Is there a distributed version that is pre-built available in an NPM package or tagged git repository anywhere that we can use as the update target for cdnjs? Or, should we just be hosting the content of UI & themes from the NPM package / git repo on the CDN?

Cheers, Matt.

(cc cdnjs/packages#889)

Hi all,

First-time contributor so please forgive any errors or faux pas!

I have been working on a project these last few weeks that required a div that is draggable and resizable, and after trying to build it from scratch by myself for wayyyy longer than I should have done, it was still a mess. I decided at that point, more in hope than expectation, to see if jQuery had a way to make it easier and, well, here we are!

What I have been building is an image uploader that then crops the image to the user's wishes, which has meant having a canvas drawing the part of the picture that is covered by the overlaying <div> whenever it is moved or resized. One thing I noticed however is that whilst resizable's ui object returns the position and size, draggable's only returns the position, so the addition of the element's size is what I am looking to add in here. I have the code ready to go (at least according to my local testing) but thought better than just submitting a PR out of the blue. The branch is at https://github.com/gavinsykes/jquery-ui/tree/add-size-data-to-draggable-ui

Any questions, please ask! 😄

The basic demo (https://jqueryui.com/dialog/) shows a focus outline like this on Firefox:

It seems to work fine in Chrome, haven't checked other browsers

Jquery UI Date Picker Issue.zip
Hello,

Recently, I found an issue with jQuery UI Datepicker in bootstrap model.

If I scroll down to page, and click on button to open model popup that has datepicker, position of datepicker will change and it will be not visible.

The function moveToTop hasn't functioned correctly for years - I've found bugs and assistance requests going back to 2013 and earlier. Most are hacks to get around the functionality not brining the dialog to the top, even when requesting the moveToTop function directly it is still in-behind other items.

It is possible for any DOM element to have a higher z-index than the initial .ui-front element created by jquery-ui and can mean a dialog can hide behind elements that are already presented on the page.

I suggest the following change to the _moveToTop function which maps all DOM elements and not only ones matching .ui-front.

/ui/widgets/dialog.js

_moveToTop: function (event, silent) {
	var moved = false,
		zIndices = $( "*:visible" ).map( function() {
			return +(isNaN(z = $( this ).css( "z-index" )) ? 0 : z);
		} ).get(),
		zIndexMax = Math.max.apply( null, zIndices );

	if ( zIndexMax >= +this.uiDialog.css( "z-index" ) ) {
		this.uiDialog.css( "z-index", zIndexMax + 1 );
		moved = true;
	}

	if ( moved && !silent ) {
		this._trigger( "focus", event );
	}

	return moved;
},

I have used Autocomplete Widget on our project. But when I import
<script src="https://code.jquery.com/ui/1.13.0/jquery-ui.js"></script>
to our index.cshtml page, it causes our datepicker jquery widget to be seen with a wrong css. As far as we debugged, Autocomplete Widget has some datepicker functions. How could we excract that kind of unused functions?