JQuery UI - which event is launched after loading of JQuery UI Tabs?
Hello, I am a beginner, just started using JQuery UI Tabs - they are located in an iframe. I have 3 tabs and after load of page with them I call javascript, which adjusts the height of the frame. However, this adjusts the height of the page according to the 1st (selected) Tab. Second Tab has more content and when I click to it, size of the page is not adjusted. My question is - which event should I call when I want to recalculate the height of the page after loading of each Tab content? Tried "onclick"
Modal Dialog Titlebar not sizing properly
So I just installed jQuery UI 1.11.4 alongside jQuery 2.1.4 (and before you ask, I tried it with 1.11.3 and got the same problem), and I made a modal dialog triggered by a button, but with the default settings of everything, the titlebar doesn't span the width of the dialog, as seen here: It's not supposed to be doing that, is it? The jQUI live demos certainly don't do that. Is there something I'm missing in generation? Here's my dialog code: weaponDialog = $('#weaponDialog').dialog({
Sortable - prevent placement at the last row
I have a list, with the last item being an "add item" button. I can prevent it from being sortable by setting `cancel: ".btn-add"`, but that doesn't prevent items from being placed *after* the add button. I could replace the add button at the end of each sorting operation, but the user will still get wrong feedback during sorting. Is there any way to prevent this, other than creating an extra container for the actual list so that it doesn't contain the add button?
Unable choosing certain dates
Hi, I'm currently using a 1.9.2 widget on my store. {{ 'http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css' | stylesheet_tag }} {{ '//ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js' | script_tag }} <div style="width:300px; clear:both;"> <p> <label for="date">Pick a delivery date at least 3 weeks ahead your arrival:</label> <input id="date" type="text" name="attributes[date]" value="{{ cart.attributes.date }}"class="required"/> </p> </div> <script> jQuery(function()
jQuery Ui Tooltip Not Working on Raphaël.js
Can you please take a look at This Demo and let me know why the tooltip is not showing on the path on mouse over using jquery Ui and Raphael.js? <div id="canvasDiv"></div> $(function () { var paper = Raphael(0, 0, 500, 500); var d = "M90,90l-80,-20L50,5L90,90"; var tri = paper.path(d).attr({ "fill": "yellow", "stroke-width": 5, "stroke-linejoin": "round", "title": "Show Me The Tooltip!" }); $(tri).tooltip(); });
JQuery Dialog Position Problem
I am using Google Maps in page. I want to set the positon right bottom of google maps. But scroll bar occurs. How can I solve this problem position: { my: "right bottom", at: "right bottom", of: "#google_map" },
Question about JQuery UI Theme Roller
The following pertains to the datepicker. I've found the theme roller to be very useful, but I have a question about implementing a theme. The downloaded theme folder contains folders named "external" and "images". "external" has a subfolder named "jquery", which contains a file, "jquery.js", which seems to contain a copy of jquery v1.10.2. I've figured out that "images" needs to be a subfolder of whatever folder that contains the CSS. But where does the "external" folder go? Not including it anywhere
Draggable "connectToSortable" option, not working in ember.js
Hello everyone. I am a Ruby on Rails developer and recently I started working with ember.js. I tried to use draggable and sortable, and everything works fine besides the "connectToSortable" feature of draggable. I have a sortable list that works as any sortable should, I have a set of draggable items that do everything they should de, except that they cannot be added to the sortable list, despite the fact that I have given the option "connectToSortable". I have no typos and the given element is
Sub Navigation in jquery ui
Hello all, I need help. I'm looking to add sub-menu bars to my navigation in jquery ui. The only problem I'm left having, is that my text in my sub-menu is gold when the "about" tab is clicked. I would like for it to be the dark brown like the rest of my body, and how it is when another tab is selected. Here is my jsfiddle. http://jsfiddle.net/gretcbkq/ This is using jquery ui Thanks for any and all help.
jQuery UI Autocomplete Combobox _renderItem returns “TypeError: Item is undefined”
When attempting to use a custom _renderItem, I keep receiving the error TypeError: item is undefined at .append(item.label) . This is using jQueryUI 1.11.4. I'm not sure why this is happening. From everything I've searched and read, this should work. Any help would be greatly appreciated. (function($) { $.widget("custom.combobox", { _create: function() { this.wrapper = $("<span>") .addClass("custom-combobox")
License/Copyright of jQuery UI images/
I created a theme with the ThemeRoller and downloaded it. In each .css or .js file are copyright informations included. But what about all the .png files in the "images/" folder? Are these icons and graphics also released under the MIT license? I cant find any informations for this case.
Having trouble with datepicker options
I don't know why, but the datepicker always trips me up. I've set up a datepicker with the following settings: $(".datepicker").datepicker({ dateFormat: 'yyyy-mm-dd', appendText: '<span class="inputNote"> (yyyy-mm-dd)</span>', buttonImageOnly: 'images/icon_datepicker.gif', changeMonth: true, changeYear: true, yearRange: '-150:+10' }); 3 questions: 1) When I pick a date, the text field gets filled in with a double
Jquery Auto Complete UI not working
Hi All, I am working on a web application project where I need to add a autocomplete functionality in one of the fields. I am new to jquery, but I found a post in this forum where they shown how to do an autocomplete using js. But when I run the code in my machine, its not working, I mean when I type anything into the field it is not showing suggestions below. I don't know where the problem is. Please throw some light on it. <!DOCTYPE html> <html lang="en"> <head> <script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
Menu not initializing
Hi. I am using a lot of jQuery UI in this project and haven't had issues like this before, so I don't know what's going on. I have a simple unordered list with list items, and I then apply the menu function. It looks just like in the jQuery UI Demo page for Menu. I can tell that it is partially working because when I inspect the UL element, I see new classes and other data applied. However, the LI elements are completely untouched. Here is what the item looks like in Firebug in Firefox: <ul id="test"
how to hide the 'x' button in Autocomplete Jquery UI in IE11
Hi, how to hide the 'x' button in Auto-complete jQuery UI using IE 11 as default browser when i put the cursor inside the input Auto-complete jQuery UI a button 'x' appear in IE 11 problem just in IE 11 http://i.stack.imgur.com/RpAlp.png i use that css code but it s not working .ui-autocomplete-loading::-ms-clear { display: none!important; }
How to avoid buttons being disappeard after resizing and dragging jQuery dialog
I have a jQuery UI dialog here in Jsfiddle with the below properties set to true. draggable: true, resizable: true The issue is that the button is getting disappeared when i resize/drag the dialog, It looks like its jQuery UI's default behaviour. I would like to see the button still show even after resizing and dragging
jquery ui draggable not working properly when changing the angle of parent element with css rotate
When I change the angle of the parent element which is specified for containment of a draggable element draggable is not working properly. The draggable element is going outside the containment element. Its working properly If I didn't rotate the element. jsFiddle is here Here is my code <div class="container"> <div class="draggable"></div> </div> $('.draggable').draggable({ containment: ".container" }); .container{ width : 250px; height : 250px; margin: 70px 0 0 70px; border : solid 1px #333; -ms-transform:
jQuery UI Position to set “right” and “bottom” instead of “left” and “top”
Is there any way to make position of element calculated using “right” and “bottom” instead of “left” and “top” css style?
accordion loading data fromn database not working
I have an accordion and a sql database, below is my html My problem is it does ALWAYS bring out data into the accordion when I click on the Link. Sometimes it can be two clicks. Any ideas how to fix my problem? <script> $("accordion").accordion({ autoHeight:false, heightStyle: "content",cache:false }); $("h2,"#accordion").click(function(e) { var contentDiv = (this).next("div"); contentDiv.load($(this).find("a").attr("href"); }); </script> <div id="accordion"> <h2 id="<%=lnkPid%>"> <a href="load.asp?pid=lnkPid"><%=strPerson%></a>
Autocomplete - search form does not submit.
Hello, I added the 'autocomplete' function to my search engine. Well working as to be seen at http://test1.sphider-plus.eu to place any suggestion into the input field of the search form. But I am unable to trigger my search engine without pressing the 'submit' button of the search form, after the suggested keyword is placed into the input field. I searched the forums for solutions and found http://forum.jquery.com/topic/autocomplete-enabled-field-not-submitting-when-pressing-enter Unfortunately
JQuery combogrid for autocomplete
JQuery combogrid for autocomplete is not working in IE11. It works fine in lower version of IE.We are using the below version of JQuery and JQueryUI. Let me know if there is any quick work around to make this working with same version of js. Also help me which version of js is best suited for IE11. jQuery UI - v1.8.20 jQuery v1.7.1
This is a good workaround for disabled button at mouseenter?
I have to show tooltip message on (enabled or disabled) button and I know about this ticket , but I didn't see the following solution nowhere: Tooltip message is not shown Tooltip is working in way I want (the difference between the codes is just in "init()" function) Does this solution have any unwanted side effects? Thx
sortable plugin's "scroll" functionality and iScroll
Hi, I absolutely love the .sortable(...) plugin. However, I can't get its "scroll" functionality to work if I'm using iScroll. Are there any known ways of getting these two technologies to work with each other?
AutoComplete writes search result to input and at bottom of page
Hi guys I'm new to jQuery UI and I'm seeing a strange result. For some reason the autocomplete works exactly as expected, except that in addition to populating the appropriate text box with search results, I also get the selected line at the bottom of the page. I end up with this appended (red rectangle bottom left): Here's my code. Any ideas? $( document ).ready(function() { console.log("loaded"); var myData = []; var requestHeaders = { "accept": "application/json;odata=verbose" } $.support.cors
jQuery UI 1.11.2 draggable and connect to sortable issue
Please see below examples - using jQuery UI 1.11.1 I am able to define draggables that connect to multiple sortables and all works fine: $('#list .item').draggable({ helper: 'clone', connectToSortable: '.table-cell' }); $('.table-cell').sortable({ connectWith: '.table-cell', items: '.item' }); http://jsfiddle.net/9syhdnzm/1/ However when using jQuery UI 1.11.2 the draggable clone loses it's style and moves away from the cursor when entering sortable areas: http://jsfiddle.net/9syhdnzm/2/ Is this
Saving .css and .js files and using them on blogger
Hey guys, i created a blog on blogger/blogspot and made an FAQ using the accordion from jquery. In the html you can see where the code comes from: ... <head> <title>jQuery UI Accordion - Collapse content</title> <link href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" rel="stylesheet"></link> <script src="//code.jquery.com/jquery-1.10.2.js"></script> <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
Base theme?
When I download the latest release of jQueryUI, it no longer includes the base theme. Was it taken out or moved? How can I get a copy?
Bug #8464 reappear in latest version of datepicker
This bug seems to reappear in latest version of jqueryUI - DatePicker http://bugs.jqueryui.com/ticket/8464 https://github.com/jquery/jquery-ui/pull/706
SelectMenu Customized and Refresh
Hi, I try to develop a selectMenu with image? I take exemple on jquery ui site and modify to add possibility to keep picture visible when you selected item with picture. Here My code My problem is on reset. Sometimes I need to put it in initial state. I try refresh, but there is an automatic add of With on Span result and my select change size. I correct it on create event widget.css({ 'width': '' }); But don't Work in select event... and when I click on reset my select become smaller. Then I try
changing the layout of the spinner buttons
Hi, I would like to change the layout of the spinner buttons, instead of having them at to rigth of the textbox I would like to have the increase at the top of the texbox and the decrease below the textbox. Does anybody know how to do that? Thank you
ui.position - avoid to resize parent window
Hi. when I am using ui.position the parent window has been resized. I moved elements as follows: $( ".flexslider" ).position({ my: "right bottom", at: "right bottom", of: ".region-main-upper" }); Now there is an empty area above the flexslider window which was moved down. How do I avoid that? test site
jQuery UI 1.11.4 compatible with jquery 2.1.4
Hello! Is somebody able to tell me if I can use jQuery UI 1.11.4 with jQuery 2 (exactly 2.1.4). Thanks a lot in advance Wolfgang
.position only runs on Firefox
Hi. I am working with Drupal 7.36 and Jquery 1.10. The script: (function ($) { Drupal.behaviors.moveFlexsliderAtTheRightPlace= { attach: function (context, settings) { $( ".flexslider" ).position({ my: "right bottom", at: "right bottom", of: ".region-main-upper" }); $( "#block-superfish-1" ).position({ my: "left bottom", at: "left bottom", of: ".region-main-upper" }); $( ".view-logo" ).position({
Accordion with global function.
Im using the global function and trying to use that in accordion how should i declare newPanel http://jsfiddle.net/ng117reu/17/
UI Dialog and JW Player
I have a problem with the Dialog UI and JW Player. I set up a link that when clicked opens a dialog showing the video using JW Player. The problem is that when you first click the link to open the dialog, the dialog window is blank until you actually click and drag the window, then the video shows and plays fine. Does anyone know what could be causing this? Thank you! I can't provide a link, but here is a screenshot of the empty dialog. And here is my code: <div id="video-player-container">
Get JQ UI Select Box Option on Each Option Hover
Is it Possible? Here's my fiddle: http://jsfiddle.net/BeastEBikes/46rpp2zh
Dialog does not close correctly
I need to open several dialogs, one after another when focus occurs on a textfield, the first dialog opens correctly, the following one opens when focus occurs, but this does not close correctly. I am using jquery1.11.4, with jquery 2.1.4 is the same thing. Demo : Demo
Give every day (<td>) of datepicker a ID
Hello. Is there a possibility to give every day in a datepicker a id? For example: <td data-year="2015" data-month="4" data-event="click" data-handler="selectDay" id="datepicker20150412" class=" "><a href="#" class="ui-state-default">12</a></td> The problem is that i do not want to use beforeShowDay to highlight the days. I have to show different date-ranges (01.01.2015 - 03.01.2015,...) in the datepicker, and i need a easy way to add and remove classes. regards Daniel
cloned elements lose initial 'display' state for show() / hide()
I cloned an element and children, I then ran .hide() on a bunch of the sub elements. Then I adjusted all their ids to "[originalid]+'_'+[incrementing number]" Then later I ran .show() on the sub elements, and they do not get restored to their initial display: inline state (as per the clone). If I adjust the ids *first* and then do the .hide() it seems to behave as expected. So I guess I am wondering if this is a known behaviour, that jQuery 'loses track' of initial states of elements if you change
Add a textbox in the default dialog box (pop up).
Hi, I want to add a text box at the end of the dialog box, so I have achieved this like this $(".LASERAction").dialog({ autoOpen: false, height: 450, width: 600, modal: true, buttons: { Ok: function () { //My Submit code } } }); var textBoxHTML = '<div style="position:relative"><input type="text" class="form-control InteractionText" id="InteractionFinalText" /></div>' $(".ui-dialog-buttonpane").prepend(textBoxHTML); When I have implemented this the text box is adding at all the places wherever I
Next Page