Questions tagged [jquery-ui]

17620 questions
1

votes
2

answer
27

Views

How to remove the text of sortable area when item is dropped on it?

I have the following code to perform sorting and drag and drop of the element. Here I am unable to remove 'Drag and drop link here.' from following div when item is dropped. Drag and drop link here. When I run stop: function(event, ui) { var item = $(ui.item); if ($sender !== '') { if ($(this).te...
Kiran Shahi
1

votes
3

answer
219

Views

DataTables+Datepicker filter table by date range

Trying to implement DataTables filter by date range using two bounded datepickers. I've seen few similar questions at SO, but none of those having answers worked for me. So far, I managed to implement interface elements, but have no idea as of how to put them together to proceed further. Any help i...
user10894089
1

votes
2

answer
12

Views

JQuery autocomplete displays all items, won't filter while typing

I am using JQuery UI autocomplete plugin on my web app. I was able to make it work, but the problem is, whenever I type in the textbox, all the items from my array are displayed. What I want to do is whatever I input in the textbox, I want to get all the matching items while typing. this is my code...
Kim Carlo
1

votes
2

answer
2.3k

Views

jQuery UI slider with scaled ruler as height selector

I'm trying to work out the math on this sort of tricky input for a height selector. Basically - I have a jQuery UI slider to select a height. It increments in inches and has a min of 0 and a max of 120 (10' tall). As the user moves the slider, a corresponding ruler graphic moves. I've set up a jsfi...
pstinnett
1

votes
2

answer
2.1k

Views

Changes in jQuery UI not reflected on Angular models

I have a form which is in a directive. It contains 2 select dropdowns (jQuery styled) and one jQuery UI slider, so it's all consistently themed. Dropdown 1 is populated at spawn, as simple as they come. Dropdown 2 gets populated when the value of Dropdown 1 changes. This happens because dropdown 1 h...
Swader
1

votes
2

answer
1.4k

Views

jQuery UI Selectable: get the text of the selected item

This code if from the jQuery selectable UI (https://jqueryui.com/selectable/#serialize). How do I modify this to append the text value in the selected instead of the index. I tried many ways unsuccessfully: var index = $('#selectable li').text(); # appends everything var index = $('#selectable li')....
fabbb
1

votes
1

answer
958

Views

jQuery Datepicker Overlaps With Previously Submitted Input Field

I am using jQuery Datepicker on a form that is being submitted and it is implemented on an input field. When I click on the input field to choose another date, previously submitted dates appear on the field and it partially blocks the UI of the date picker. Is there any clean solution for this? Than...
malzki
1

votes
2

answer
1.7k

Views

jQuery UI ui-autocomplete-loading spinner not stopping/disappear when found results

I am using JQuery UI autocomplete-loading spinner in my project by adding .ui-autocomplete-loading class. When I start typing in the editor box, the spinner shows up as expect. If there is no match results, the loading spinner disappear which indicates the search complete. But if there is a match fo...
Apple Juice
1

votes
1

answer
27

Views

How to always drop element at first position?

I am using Jquery UI to connect lists so I can sort elements from one to another list. Only problem I have is that I don't know how to always drop element at the first position, no matter where I drag. If I drag from one list to another, I want that element to be at first position in that list. I ha...
Denis Omerovic
1

votes
2

answer
20

Views

Get text values based on rules

I have this text : var dimensions = '12 H x 45.3 W x 16 G' Now I want to get the value for H & W. If not exists H or W put NULL value. I tried like var result = str.split('x'); var h = result[0].replace('H',''); var w = result[1].replace('W',''); Expected result : h = 12, w = 45.3 The problem is th...
HareaCostea
1

votes
2

answer
4.4k

Views

Remove default buttons from Button Panel in datepicker

I want to keep the button panel but I do not want the 'Today' or 'Done' buttons jquery: $(document).ready(function () { $('.datepicker').datepicker({ showOn: 'button', buttonText: 'Date', showButtonPanel: true }); }); html: Start End
dan_vitch
1

votes
1

answer
258

Views

jQuery UI Autocomplete in MVC modal window

I'm trying to implement the autocomplete jQuery UI function in a Bootstrap modal window, but it does not work. screenshot module console debug Take the steps of not returning a partial view, also already implement jQuery CSS styles, the truth works for me in full views, but why when calling a modal...
Fytito Ambiado
1

votes
0

answer
238

Views

compare date strings to json date strings

A User selects a pair of dates from two jquery-ui datepickers, when the user selects the second date both values are compared to strings stored in an external JSON file. If the dates are within the dates below external data is returned to the html page. The dates look like this: 'startDate':'01/01/2...
ernesto fernandez
1

votes
2

answer
42

Views

Modify jquery UI classes

This works: $('.myClass .ui-widget-content, .myClass').css( {'background-color': gBkgColor, 'color': gFontColor}); I am able to manipulate the properties of the widget header easily with the Firefox inspector like so: I do not know how to do it with the proper syntax. For example, the following piec...
Brice Coustillas
1

votes
0

answer
397

Views

jQuery-ui-sortable not working with webpack

I'm aware this is already documented but I can't find a solution working in my case. The following code needs .sortable() to work : import 'jquery-ui/ui/widgets/sortable'; //also tried with import 'jquery-ui' [...] this.$wrap.find('#data, #options-choices').sortable({ axis: 'y', containment: 'pa...
Kleioz
1

votes
0

answer
179

Views

Range Slider with no maximum value

I'm making a range slider with ng2-ion-range-slider Angular 5 But I want make a slider with no maximum value which is infinite slider Any recommendations?
Rania Elgenedy
1

votes
0

answer
47

Views

If any disabled dates between start date and end date, alert user about booking not possible

I have a booking page. eg, The booking start on 2018-01-10 and end on 2018-01-20. If some date 2018-01-15 and 2018-01-16 are disabled so how can we inform user 'there is some disabled dates in between 2018-01-10 and 2018-01-20 so bookings not possible'. or Not clickable end date. $('#dateFrom')....
sam sam
1

votes
2

answer
184

Views

Selectmenu goes off the screen if near the edge

div.ui-selectmenu-menu goes off the screen if Selectmenu is near the right edge of the window. This is the default Selectmenu behaviour, I guess. (Similar thing happens if Selectmenu is near the bottom edge of the window.) What I want to do is to move the div.ui-selectmenu-menu a bit to the left, ie...
nkostic997
1

votes
1

answer
34

Views

jquery-ui-rails breaks rails test

I've added jquery-ui-rails to my project and it's working perfectly in the browser. But when running tests they fail with an template error. ActionView::Template::Error: File to import not found or unreadable: jquery-ui/datepicker. Gemfile gem 'jquery-rails', '~> 4.3' gem 'jquery-ui-rails', '~> 6.0'...
PascalTurbo
1

votes
2

answer
141

Views

jQuery UI Autocomplete mouse click selection not passing value

I am using jQuery UI Autocomplete in a PHP page for location services. This one in particular is using the Remote JSONP datasource type. The issue I have is odd, and only happening with one way. Here is what is happening: The user types out the entire selection. The value is assigned and passed as e...
W3bGuy
1

votes
0

answer
298

Views

How to add arrow in jquery connections

I used jquery connector - https://github.com/musclesoft/jquery-connections to connect two draggable DIV element. Problem: It should represent the direction of flow in the connector. Need to add an arrow to jquery connector.
Dhananjayan
1

votes
1

answer
80

Views

Another text field to be auto filled, based on the auto-completed data

I have a form with fields in array where each row indicated a record. After I get autocomplete data for item_name, I need corresponding company_name field gets filled automatically pulling data from database. here is my code below: $(document).ready(function() { $('.inputitem').autocomplete({ sou...
sanjeev singh
1

votes
0

answer
2.2k

Views

Date Picker not working on bootstrap 4 webpage

Datepicker and timepicker are not working along with jquery-3.2.1.slim.min.js popper.min.js and while removing it modal and bootstrap carousel are not working How to resolve this issue? Header files .ui-timepicker-container.ui-timepicker-standard { z-index: 100000 !important; } .input-group-addon...
1

votes
0

answer
41

Views

jQuery datepicker issue with IE8 in Client Citrix Environment

I am currently developing a web application using standard asp.net (no MVC) for a client where a text box is required to have a calendar-datepicker and should not be having user input enabled. I have used the following references by downloading the corresponding files: the text field where I am addi...
Arkaprava Basak
1

votes
1

answer
34

Views

jQuery Color else condition takes 17 second to respinse

I have tested it on every browser I have on my computer. I even tried it with error handling and found no issue. The script is quite simple and it work but not quite like it supposed to When you scroll down the bar will change the color to red, but when you scroll up it supposed to change it to gree...
Miles Miller
1

votes
1

answer
311

Views

How to make Time Jquery Slider based on total Hours

I need time slider from 04:30 hours to 45:30. I try below code Time Range: 04:30 - 45:30 $('#slider-range').slider({ range: true, min: 258, /* 04:30 */ max: 2718, /*45:30*/ step: 15, values: [258, 2718], slide: function (e, ui) { var hours1 = Math.floor(ui.values[0] / 60); var minutes1 = ui.values[0...
Note
1

votes
1

answer
566

Views

JQuery autocomplete doesn't work on the first keypress event (the source is an array)

I'm creating a search results autocomplete like Google has. The results (or source) of the autocomplete is gonna be a dynamic array (the array was created using object accessed from the URL property in the $.ajax call) and the elements change very quickly on each keypress event. What I mean is prett...
Lukas Naujokaitis
1

votes
1

answer
53

Views

How can highlight a date in jQuery?

I cannot dynamically highlight the date in calendar, only static dates highlight if I do: eventDates[new Date('01/09/2018')] = new Date('01/09/2018') Here is my code: $(function() { // An array of dates var eventDates = []; $.ajax({ type: 'GET', url: '@Url.Action(' GetEvents ', ' Home ')', dataType:...
Arslan
1

votes
1

answer
287

Views

Jquery UI - autocomplete is not a function

I really don't know what I am doing wrong, I checked multiple answers but no success: My scripts loading order: @Scripts.Render('~/Scripts/jquery-1.10.2.js') @Scripts.Render('~/Scripts/jquery-ui.js') @Scripts.Render('~/Scripts/custom/cityGuessGameHome.js'); in custom js: $(document).ready(function (...
Mefhisto1
1

votes
0

answer
89

Views

jquery-week-calendar: ERROR TypeError: Cannot read property 'classes' of undefined

I'm using jquery-week-calendar with this jQuery bundle: jquery: 3.1.1 jquery-mousewheel: 3.1.13 jquery-typeahead: 2.7.6 jquery-mask-plugin: 1.14.9 jquery-countTo: 1.2.0 jquery-steps: 1.1.0 chart.js: 2.5.0 dropify: '0.2.1 jquery-ui: 1.12.1 jquery-week-calendar-ui: latest I get this error: jQuery.Defe...
DarioTecchia
1

votes
1

answer
2.3k

Views

jquery ui autocomplete doesn't work with jquery version 3.2.1

Hi I am using jquery version 3.2.1 in our projects and now i need to use jquery ui autocomplete which contains version 1.12.4. Due to this our position of autocomplete change(top and left position). For this I just found a temporary solution.I calculate position dynamically through jquery and set po...
Rupal
1

votes
0

answer
31

Views

Not able to position Jquery dialog windows dynamically

I have following code $(function(){ $('.dialog').dialog({ autoOpen: false, modal: false, width: 'auto', height: 'auto' }); $('button').each(function(i) { var el = $(this); el.click(function () { $('.dialog').eq(i).dialog('open'); }); }); }); Enlarge Enlarge 1 Enlarge Enlarge 2 Enlar...
aniltc
1

votes
0

answer
165

Views

Getting a resize event to happen every time a jQuery UI tab click occurs

I'm using jQUery UI tabs, and within each tab, it's got a slick.js-based slider. Since the second slider is initially set to display:none; on page load (since it's in a non-active tab), its size isn't calculated correctly. If once the second tab is active, the window is resized, it calculates the s...
Keefer
1

votes
0

answer
55

Views

How can we add multiple color for multiple jquery ui datepicker?

I have a project in laravel. On one page I have several jQuery ui datepicker see the image below. When page loads I need to get some date from database and mark some color on calendar, based on data. At-present I can mark color only on one datepicker. How can I mark color on multiple datepicker? Cal...
sam sam
1

votes
1

answer
351

Views

how to make jquery autocomplete ui using ajax in jsp

My problem is that jQuery UI AutoComplete is not working using AJAX in my JSP. I find many guides, but I cannot find the solution to my problem. What I can do in this condition? JSP Page $(function() { $('#auto').autocomplete( { source:function(request,response) { //Fetch data $.ajax({ url:'Fetch.j...
Saim Khan
1

votes
0

answer
115

Views

Dynamically change Min and Max date

I'm using jquery multiple date picker in Angular 4 Ag-Grid. I've scenario where the min and max date will change dynamically. Issue is the updated min and max value is updated only after i refresh the page. Is there any way to update the calendar without page refresh. I've created a sample plunker...
arunkumar
1

votes
1

answer
70

Views

Jquery sortable on table - dragged row y position is above mouse pointer

My problem is a little bit unusual - it works when I paste example on code pen, but inside my local project it doesn't work. Problem is that when dragging row it is high above mouse pointer: This same thing doesn't happen in example - but HTML is the same. What I would like to do is align y position...
FrenkyB
1

votes
1

answer
48

Views

How to find nested image on phoenix?

I use jQuery Mobile UI. It include css and some image file. The following error was caused. ** (Phoenix.Router.NoRouteError) no route found for GET /css/images/ajax-loader.gif Then I make a directory inside of assets css directory and put target image file. /assets/css/images/ajax-loader.gif However...
tajihiro
1

votes
2

answer
252

Views

JQuery UI Dialog not properly shown on top of Leaflet [duplicate]

This question already has an answer here: jQuery UI 1.10: dialog and zIndex option 8 answers I want to show a JQuery UI dialog on top of a Leaflet map on page load. When the page was loaded, the dialog was initialized but very shortly hidden behind the leaflet map if the map is 100% of the html pag...
alextc
1

votes
1

answer
59

Views

Sortable divs from/to draggable divs

I have .rc divs inside a .rcs div. The .rcs divs are sortable. The .rcs divs are inside a .ra div. The .ra div are draggable. When I move a .rc from the first .ra to the second one, during the transition, the .rc is hidden. I don't get this behaviour when I make the .ras div sortable (.ras is the pa...
user2479920

View additional questions