very simple new user question on how to get the value from a slider
I read the documentation but was unable to find a fully functional example where the value of a slider was made used by javascript. I'm sure I'm missing something really basic and probably totally obvious to everyone else. It may be a javascript error not a jquery error. Here's what I tried: <script> $( function() { $( "#slider" ).slider({ min:0, max:100, step:5, orientation: "horizontal", value:30 , change:
Can an input with class hasDatepicker be close through javascript?
Hi everyone, I am tasked with developing an automation framework for our company which uses jquery (ver. 2.2.1) and I was wondering if there is a way to close a datepicker element through javascript, I have tried dispatching events to the element but I think they are being ignored. Thank you. Regards.
Jquery DIalog close button displaying with long border extending to side of the containing element
Firefox 89.0.2, OS Ubuntu 20.04, Jquery-ui v1.12.1 jquery v3.5.1 Steps to reproduce visit https://jqueryui.com/dialog/ on firefox. The dialog is displayed with an orange border extending to the left of the containing element. The same effect happen on Windows Firefox VM (though with a blue line) and has been experienced by other friends on different machines. Tabbing control will remove the line, but if you return focus to the close button it appears. I have not been able to find the issue in the
Reload datepicker calendar with new disabled days
Hi All, I have a calendar on my website with disabled day which are grayed out. So far OK. Now I added a checkbox on my website. When I check it a javascript function is called which is calculating a new set of disabled days. My issue now is: The new set of disbale days is not implemented in my calendar. When I paste the js-code of the calender into the function which recalculate the disable days the calendar doesn't show up at all. Any suggestions? This is the calendar code: //Availability calendar
Selectable not scrolling Touch Screen
Hi Selectable does't scroll on Mobile Devices/ Touch Screens. Someone faced such an Bug and if there is a solution? Thank You.
Conflict Between Older Versions and More Recent Versions of jQuery
I have older versions of jquery installed on my page that uses the draggable/droppable elements but I want to use recent versions of bootstrap and jquery to implement modals on the same page. When I add a link to the recent versions to my page all of the draggable/droppable elements stop working. How can I use newer versions of jquery along with older versions?
Localize datepicker dynamically, can it be done?
Hi everyone, I am building an Angular app and I would like to know if it is possible to localize the datepicker dynamically. The web page shows a URL to change the language of the page from English to French and vice-versa and the datepicker needs to localize accordingly. I was able to add datepicker-fr to angular.json and it is now appearing in French but how can I switch it depending on the user's selection? Thank you, Pierre
Datepicker shows up behind text input dropdown
I googled this problem and implemented some of the jQuery code provided but nothing worked. How do I get my datepicker to show up in front of the dropdown? This is my HTML: <table> <tr><th>Start Date:</th><td> <div class="input text"> <label for="MealplanEventDate"></label> <input type="text" name="event_date" size="44" id="MealplanEventDate" maxlength="255"/> </div> </td></tr> <tr><th>End Date:</th><td> <div class="input text"> <label for="MealplanEndDate"></label> <input type="text" name="end_date"
Jquery menu issue
When you are leaving the parent item of a submenu in jquery menu,there is a slight delay closing the submenu. any way to disable this and make it close instantly ? thanks !
jQuery UI - Is this library EOL?
I have had an exhausting time searching for answers as to the state of the jQuery UI library. The github shows activity, but there does not appear to have been a release since 2012 with the release of the 1.12 version. So I have a few questions that perhaps the community could help answer for me. Why have none of the github changes been released as updates? Has this library been discontinued? If it has been discontinued, was there a specific reason no notice was given?
How to trigger Form submit using the Dialog Save button? Not working
The form in contained inside an iframe There is my example code in plunker http://plnkr.co/plunk/L1mblbkDvBgk8yHM
Black bullet besides Jquery datetimepicker
Hi there, I am using datetimepicker in my application, and there are two black bullet besides it. How can I remove them? The image is attached. Here is how I use it: $('#dtDuedate').datetimepicker({ format: 'DTformat', useCurrent: false, defaultDate: moment(), minDate: moment().millisecond(0).second(0).minute(0).hour(0), widgetPositioning: { horizontal: 'auto', vertical: 'bottom'
drag and resize-problem with embedded dialog
hi i intend to establish a window-like layout using jquey dialog. A dialog can by appended to a another dialog, with the option appenTo. here my code: $(function(){ $('<div id=desktop >desktop<br>desktop<br>desktop<br>desktop<br>desktop<br>desktop<br>desktop<br>desktop<br>desktop<br></div>').dialog() $('<div id=child>child<br>child<br>child<br>child<br></div>').dialog({appendTo:"#desktop"}) }); Example It works almoust as expected, but i encouter a problem: the childdialog is not draggable nor
How to get end date from start date and leave days based on condition using jQuery datapicker
I am using JQuery-ui datepicker in Leave Management Project. This is what I have: Controller public function findNationalHoliday(Request $request) { $nationalholidays = HrNationalHoliday::select('holiday_date')->whereYear('created_at', '=', date('Y'))->get(); return response()->json([ 'nationalholidays' => $nationalholidays, ]); } holiday_days comes like this in the console: 0:
holiday_date: "2020-08-25 00:00:00"
__proto__:
The jQuery UI site crashed.
The jQuery UI site crashed. When I open the download page, I click the Download button at the bottom. I don't know how to tell the site developers. https://download.jqueryui.com/download
Upgrade jQuery UI from 1.8.8 to 1.12.1
Hi, I'm currently working on a project with a huge amount of legacy code and I need to upgrade the jQuery UI library to the latest version due to some security issues. I've already read some of the upgrade guides ( https://jqueryui.com/upgrade-guide/ ) but it's still not clear to me the strategy to follow. Should I update versions sequentially and fix any possible issues that I might find for each individual upgrade? If so, how can I be sure about what should be changed? Each upgrade guide contains
UI slider isn't visible after page loads into container
- The body of index.php consists of a navigation bar with links and a separate container with the id="pageContent". - In my JavaScript, when the page loads it loads another page (HomePage.php) into #pageContent ($(#pageContent).load('HomePage.php');). - As for the navigation bar; it takes the name of the clicked link as a variable, adds .php to the end of it and loads that into #pageContent: $('#navContent a').on('click', function() { var page = $(this).attr('href'); // Get link name $('#pageContent').load(page
How to save the sequence in the database after dragging dropping
i have this code which is interchanging images location as soon as they are clicked and dragged and place on the other image below is the javascript code and i am using jquery ui for this <script > (function () { var droppableParent; $('ul .element').draggable({ revert: 'invalid', revertDuration: 200, start: function () { droppableParent = $(this).parent(); $(this).addClass('being-dragged');
Can't always drag draggable element into empty sortable list that has its height set on start of dragging
I have a draggable element and two sortable elements which are empty (meaning their height is 0). I am using connectWithSortable to drag the draggable element into one of the sortable elements. This only works if the draggable element will fit into the sortable element (i.e it's height allows for it). By giving the sortable elements a height of 100px, it works: https://jsfiddle.net/cekwuyq1/ However, I don't want the sortable elements to have this empty space of 100px. Instead, I want their height
How to prevent a jQuery widget appended to a selectable from growing bigger onmouseover?
Hello dear jQuery UI developers and users! In an HTML game I have created a custom jQuery widget called table representing a rectangle green table with up to 4 players sitting at it: In the above screenshot 4 such tables are appended to a #tables3 selectable by the following code: var tablesList = $('#selectable').selectable(); var table1 = $('<li/>').appendTo(tables3).table({ gid: 3 }); var table2 = $('<li/>').appendTo(tables3).table({ gid: 104, player0: { rep: Math.random(),
can't download jQ UI -- get 502 error....
can't download jQuery UI..... get this error... 502 Bad Gateway (land on this url, http://download.jqueryui.com/download, and get this 502 error... funny... same thing happened in my own website a few days ago... it took my webhosting about two hours to fix it.....) have tried several times, in two browsers....
Jquery DatePicker Color Day
I have using Jquery Date Picker. I wanted to change the background color for the list of dates. like 21/07/2020, 22/07/2020, 2/08/2020. Kindly let me know if anybody already implemented this scenario.
Ceck, if a tab already exists.
In a callback, I open tabs like this: $('#packageTable tbody').on( 'click', 'button', function () { var data = table.row($(this).parents('tr')).data(); var tabId = "tab-" + data.id; $("<li id=" + tabId + "><a href='" + tabId + "'>" + data.package + "</a</li>") .appendTo("#tabs .ui-tabs-nav"); $("#tabs").tabs("refresh"); }); In other words: The tabs have an associated id. (The tabId.) Now, I'd like to change the callback
Errors 502 and 504 JQUERY UI WEBSITE
Hello What Happens with JQUERY UI WebSite ??? At least 1 week it does not work : Error 502 or 504 !! I cannot access to the documentation about Widget Factory !! Will come back it soon ??? Who can I contact ?? Greetings
Which version of jQueryUI compatbile with jQuery 3.5.1
Which version of jQueryUI compatbile with jQuery 3.5.1? I am current using jQueryUI v1.11.4
Download problem
Hi, I have a problem downloading jQuery slider.I use windows 10 Despite many attempts at different times I get message 502 https://download.jqueryui.com/download Restarting computer, changed server still get the same page. Help please.
jquery datepicker vertical scroll bar for month and year dropdown
Hi All, I am using Jquery Datepicker which i have to show also in responsive design. When i verified the date calendar in mobile layout and expand the month dropdown. It does not have the scroll bar and showing a long month name dropdown like in below screen shot. As you can see in above image month name is going in down and there is no scroll. Same issue is present for Year dropdown also.. Below is the piece of code used to initialize above calendar $(document).ready(function () {
Disable or enabled dialog button when a checkbox is selected
Hi, I'm having problem trying to disable or enable dialog button when checkbox is selected. this is my fiddle: http://jsfiddle.net/tegatti/jnxoydfg/8/ Thanks in advance. Tegatti
cannot call methods on dialog prior to initialization
I'm receiving this error in the console log. jquery-1.12.1.min.js:2 Uncaught Error: cannot call methods on dialog prior to initialization; attempted to call method 'destroy' at Function.error (jquery-1.12.1.min.js:2) at HTMLDivElement.<anonymous> (jquery-ui-1.12.1.min.js:6) at Function.each (jquery-1.12.1.min.js:2) at n.fn.init.each (jquery-1.12.1.min.js:2) at n.fn.init.t.fn.<computed> [as dialog] (jquery-ui-1.12.1.min.js:6) at HTMLDivElement.OK (new_appointment.php:901)
How do I get the latest built min.js version with npm or a link?
I'm writing our build script and I want to be able to get the latest stable version. Npm package does not seem to have a dist/ directory with the min.js, is there a direct link perhaps?
Create, and activate a tab.
Beginners question, so bear with me. According to the documentation, I can create a new tab with the following snippet: var tabId = "tab-" + data.id; // Data is an item, which has been clicked. $("<li><a href='" + tabId + "'>Some text</a></li>").appendTo("#tabs .ui-tabs-nav"); $("#tabs").tabs("refresh"); Works fine. However, there's one detail missing: How could I activate the created tab? Thanks, Jochen
The jQuery UI datepicker previous/next buttons are not working after updating to 1.12.1 version
Hi all! Please, advice what things could lead to the broken buttons. Code wasn't change from it was written. function onDateChanged(y, m) { $('#calYear').val(y) $('#calMonth').val(m) $('#dataChanged').trigger('click'); } function onDayChanged(date) { $('#calYear').val("0") $('#calMonth').val("0") $('#change').val(date) $('#dayChanged').trigger('click'); } $( "#datepicker" ).datepicker({ inline: true, beforeShowDay: nationalDays, dateFormat : 'dd/mm/yy',
Advise a jquery UI widget to create a dropdown
Hi All! Please advise a jquery UI widget to create a dropdown like this one:
Offline JQuery UI Download Builder
The jQuery UI Download Builder tool at https://jqueryui.com/download/ no longer works, you get a "bad gateway" error #502 when you click the button. Is there a way to do the same action on your own computer, e.g. with Node? The complete UI archive is huge, and I only need a few parts...
Autocomplete behavior with array of object as source
I've noticed when you set your source as an array of objects, when you select an entry it set the value of the control to the value and not the label of the selected entry. See example: https://jsfiddle.net/7tjp0d2c/ I suppose that would make sense if the control your making into an autocomplete is a select, but mine is an input. This is because my source is actually a function that's retrieving remote data and return an array of objects. Is there anyway to alter the behavior to put the label in
multiple datapickers
I have a questionnaire that collects birth dates of several people. How can I make these datefields working with one function to instantiate them all? I tried to use a class selector, but then only the first date field is accepting input
textarea using jQuery.UI Resizable parent Div cutting off lower half of the textarea
I'm adding text to a textarea that has been modified using the jQuery.UI resizable plug-in, after which I resize the textarea's hight by setting it to the textarea's scrollHeight, but since the parent div, added by the resizable plug-in has a fixed size, the textarea gets cut-off when the textarea height is now taller than the parent div's height. I tried to fix this by assigning 'auto' to the div's height, but something is preventing my assignment. I also tried 'auto !imporant', but this didn't
How to block weekend from selection on altField
I have 2 fields: DeliveryDate and PickUpDate DeliveryOffDate can be any date except Sundays or Public holidays: Sorted PickUpDate is configured to default to DeliveryDate + 7 days Problem: Delivery can be a Saturday BUT Pickup Cannot. So, If a DeliveryDate is "Saturday", I want PickUpDate = DeliveryDate + 9 days (Monday) function nationalDays(date) { for (i = 0; i < natDays.length; i++) { if (date.getMonth() == natDays[i][0] - 1 && date.getDate() == natDays[i][1]) { return [false, natDays[i][2] +
How to Detect When Draggable Hits Top or Bottom of Containment in jQuery UI
Can you please take a look at this demo and let me know how to detect when .draggable hits top and bottom of it's containment? $(function(){ var draggableRight; var draggableWidth = $('.draggable').height(); var parentWidth = $('#parent').height(); $('.draggable').draggable({ containment: 'parent', axis: "y", drag: function(e, ui){ // ==> if .draggable hits top of parent change it's background red // $(document).trigger("mouseup"); // $('.draggable').css({ background: 'red' }); // ==> if .draggable
date picker calendar not working with jquery-latest.js. Need a solution for this.
Hi, Basically am trying to make the date picker calendar to work with jquery-latest.js and jquery-ui-latest.js. It is not working. However, calendar date picker works fine with jquery-1.12.4.js and jquery-ui.js. Any thoughts/ideas to make the date picker calendar work with jquery-latest.js, Please let me know, Thanks so much for all your help.
Next Page