Datepicker hightlight days through css
Hi guys! I'm trying to highlight some specific days in my datepicker. I use the "beforeShowDay" option, and the selection works fine. beforeShowDay: function(date) { for(var i=0; i<daysToHighlight.length; i++) { if(date.getFullYear() == daysToHighlight[i].year) { if(date.getMonth() == daysToHighlight[i].month) { if(date.getDate() == daysToHighlight[i].day) {
using Google Image Search API inside Jquery tabs
Hi All, I am having 3 jquery tabs in my code. the first 2 tabs are ok. In the last tab, i have to display the related images from google. for that i am integrating google image api. my code is <li><a href="#tab1">title1</a></li> <li><a href="myfile.php?tab=2&dis=<?php echo $param;?>">title2</a></li> <li><a href="google_img.html">Images</a></li> If i run the google_img.htlm with a static parameter it works good. But If i click my 3rd tab, it leads to open a new
Autocomplete Extensions
I've just put up a couple of extensions for the jquery 1.8 autocomplete plugin here: http://github.com/crussell52/jquery-ui-extensions/tree/master/autocomplete/ jquery.ui.autocomplete.cache.js: When using a remote data source, this plugin will store responses so that subsequent searches for the same term will not need to go to the server. To use, include it after the autocomplete plugin and set the 'cache' option to true as you would any other option for the autocomplete plugin. jquery.ui.autocomplete.customItem.js:
Accordion CRUD with ajax
I would like to request added functionality to accordion, where it has an option to add buttons like "show, edit and remove" and other optional buttons for CRUD porposes. Wherein show would slide down the original information, while edit will ajax to the edit form page and remove would just remove that item, but has a method like remoteAjax so to update the database on delete.
Tabs get funny 'active/selected' border when clicked in Firefox
Hi I downloaded your JQueryUI pack and am viewing the demo page that is bundled with it. I noticed that on the tabs part, when you click a tab, it gets this funny dahsed border around it, similar to the way links do when you click them. I have attached a screenshot to illustrate what I mean. It does not do this on your demo page (http://jqueryui.com/demos/tabs/) and is only doing it in Firefox (3.6.8) on my PC, not I.E. So to reiterate: http://jqueryui.com/demos/tabs/ No funny border when a tab
Strange behavior of Draggable under IE8
Hi, I'v made a toolbox (ie: a div containing several objects). I want to have the toolbox being draggable, and each individual object being draggable as well. See enclosed page. The page works fine with FF and Chrome: when I move an individual, the toolbox does not move (as expected). However, strangely enough, under IE (8), the toolbox follows the individual. I spent several days on this.... and would appreciate if someone can help! Thanks.
jQueryUI Resizable Dialog containing iFrame Fix for Firefox / IE
Hello. I am trying to make iFrames appear in a jQueryUI dialog and make them resizable using jQueryUI's resizable functionality. But there is an issue with Firefox and and IE. Discussed in the comments of Elijah Manor's blog post on the subject here : http://elijahmanor.com/post/jQuery-UI-Dialog-w-Resizable-iFrame.aspx I have found a fix here (last comment) : http://dev.jqueryui.com/ticket/3176 that I have successfully applied with my own resizable div, but I'm not having similar success with a jQueryUI
nested tabs with css scope
Hello, I've a problem in differentiating the handling of events for two nested tabs, using jquery 1.4.2 and UI 1.8.4. If I use a "#div > ul" selector my tabs are not built, but if I use a normal "#div" selector I always get events from both tabs even if operating on the nested one. I have some tabs instanciated with this syntax (>ul) with older versions of jquery.ui, shouldn't this work also with 1.8.4? My code: I could build my nested tabs, also using two different css classes (declaring scope
Making vertical tabs "clickable"
Hey, on a page I'm working on there are horizontal and vertical tabs. The horizontal ones work fine, i can click anywhere in the tab and it activates it. But the vertical tabs only work when i click on the actual text inside the tab, not anywhere else. How can I make the whole tab clickable? here is the .css for the vertically aligned tabs. <style type="text/css"> /* Vertical Tabs----------------------------------*/ .ui-tabs-vertical { width: 69em; }
Problem with the datepicker ( two time sthe year take )
Hi to all i have a problem with the datepicker, it takes me two times the year, like this: 16/09/20102010 Anyone can help me? Is there an error in this code? $.datepicker.setDefaults({ changeMonth: false, stepMonths:1, changeYear: true, // showOn: 'both', buttonImageOnly: true, buttonImage: '<%=request.getContextPath()%>/css/images/cal.gif', //buttonImage: '/unes/css/images/cal.gif', speed:'fast', showStatus: true });
dueling draggables
I have a draggable black rook on a droppable square, and a draggable white rook on an adjacent droppable square. When I drag and drop the first one over the second one it simply disappears. When I drag and drop the second one over the first one it drops on top of the first. How do I make either one "capture" the other?
Remove Item from Sortable
Hi all together! I have sth like a shopping card where I can drag & drop items from a draggable on a sortable by cloning the items. $(function() { $(".sortable").sortable({ revert: true, connectWith: 'ul', remove: function() {alert($(this).position)} }); $("#draggable > li").draggable({ connectToSortable: '.sortable', helper: 'clone', revert: 'invalid', }); }); <div class="demo"> <ul id="draggable">
Jqerry: get picture,department name using userprofile
Hi, SP2010 - on a custom list I have username text box (datatype: people & group); what I am looking is: I want to get user picture, department from user profile. any advice!
jqueryui.com site seems to be down
Just a heads up.. For the past hour or so I can't access jqueryui.com. Hope someone fixes it soon!
[JQuery Slider] Set slider handle position after slide event
Hi, I am working on a problem whereby I have a slider and when the user moves the slider, it will snap to the nearest integer in an array of discrete integers, for example [18,35,40,83]. I have the following slide event code: slide: function(event, ui) { $("#slider_a").val(getNearestValue(ui.value)); $("#slider_s").slider('option', 'value', getNearestValue(ui.value)); }The algorithm getNearestValue() is working fine and returns the correct value, and the value displayed onscreen is being
[JQuery Slider] How to give it specific values?
Hi. I would like to use a JQuery Slider whereby I can give it a specific set of values that the user would have to choose from. For example.. Please choose a size: 330ml / 500ml / 1000ml / 2000ml So I would like to pass the slider a set [330,500,1000,2000] in which will be the only options available to choose from the slider. Many thanks.
Manually Close UI Panes?
Hi, i want to make an extra button to close all panes in my layout. my setup looks like this. $(document).ready(function () { outerLayout = $('body').layout({ center__paneSelector: ".outer-center" , west__paneSelector: ".outer-west" , east__paneSelector: ".outer-east" , north_paneSelector: ".outer-north" , west__size: 125 , east__size: 400
How to use chindes words search in Jqueyui autocomplete?
I'm in trouble by using jqueryui autocomplete.and search it by chinese terms.
How to control the size of the datepicker widget?
When I use a datepicker with a SPAN, the style attribute of the SPAN controls the size of the datepicker nicely: <span id='datepicker-container' style='font-size:62.5%'></span> When I try to define the size of the datepicker based on an INPUT element, the INPUT element style doesn't control the datepicker size, I have to use a global style, which is bad if I need 2 datepickers with different styles. <style> .ui-datepicker { font-size:62.5%; } <input type='text' id='datepicker'> What's the right
Themes more granular, for further usage.
The UI themes work great for all the controls they use but if you want to style a table or some custom html it gets tricky, sometimes you want the border of one class but background of another. I would like to see themes with granular classes example classes below. This would allow the developer to style none jquery ui elements for more cohesive look. ui-border: (whatever the default border color is for the theme, usually the one declared in .ui-widget-content) ui-default-background ui-hover-background
How to use two dialog box in the same page?
Hello! I'm testing the jQuery's dialog box in a plain html page just for get involved and I was trying to create two link to open two diferent dialog box but I don't know how to modify the script in order to call differents ID. This is what I have: <html> <head> <link type="text/css" href="style/jquery-ui-1.8.4.custom.css" rel="stylesheet" /> <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script> <script type="text/javascript" src="js/jquery-ui-1.8.4.custom.min.js"></script> <script
datepicker: unable to set spanish region
I need datepicker to work in spanish region (day/month/year). But I always get the month first. I also downloaded a filed called jquery.ui.datepicker-es.js and put it in the same directory where this file is jquery-ui-1.8.4.custom.min.js but still it dos not work. I know it worked in the example. What am I doing wrong?? <!DOCTYPE html> <html> <head> <link href="css/ui-lightness/jquery-ui-1.8.4.custom.css" rel="stylesheet" type="text/css"/> <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
datepicker: onSelect not called when clicking on "today"?
My datepicker works, the onSelect callback is called when I click on a date, but onSelect is not called when I click on the 'today' button. Today's date is selected, but onSelect is not called. Feature? How do I get that to work? Thanks
datepicker: how to get 'hide' and 'show' to work
Using 1.8.4, I cannot find any way of showing/hiding the datepicker on command. The datepicker is built on a SPAN element. I tried: timelinedatepicker.datepicker(options); // build the picker timelinedatepicker.datepicker('hide'); The picker is shown, even if it should be hidden. Tried the other around: timelinedatepicker.datepicker('hide'); timelinedatepicker.datepicker('option', options); And the picker never shows, even when I call timelinedatepicker.datepicker('show"); Thanks Fred
Draggable makes slideToggle misbehave
I have <script type="text/javascript"> $(function() { $("div#sortable").sortable(); $("div#sortable").disableSelection(); }); </script> and Within one of the sortable divs, I have <script type="text/javascript"> $(function() { $('div#sortable_itemt').click(function(){$('div#title_elements').slideToggle('slow');}); }); </script> so each time the drag
how to prevent draggables to move through each other?
Hi guys, I have made a div and within this div I've put some draggables. These draggables can only move horizontally or vertically within the box. All is fine and all works. The only problem is that these draggables can overlap each other. How to prevent this? I want it so that when a draggable is blocked in its path by another draggable, it can't move further. At the moment the draggable can move through to other draggable, I want to prevent this. A demo: http://mauricederegt.nl/test/blocks.htm
Height Dialog problem
Hi, I'm using Internet Explorer 7 with jquery.ui version 1.8.4. I have a modal form dialog that I want to set with an specific height. I set the height option but nothing happend, the height is still 'auto' and in fact the dialog is heightless! With FireFox is not a problem because I see the dialog well but the height is set to 'auto' as well. In my HTML page there are a lot of form modal dialogs. Maybe the issue it's related with that. With version 1.8 of jquery.ui everything went well so
datepicker: button options work only with input element? How to display an icon with a datepicker, no input field?
I am trying to display a button (icon) to click on to display and hide a datepicker. No input field. Using 1.8.4, this example code works with an INPUT element, but not with a SPAN or DIV (displays the datepicker right away with no button) $(document).ready(function() { $("#datepicker").datepicker( { onSelect: function() { alert('onSelect'); }, showOn: 'button', buttonImage: 'images/calendar.gif', buttonImageOnly:
Autocomplete Bug when using clone w/cloneDataAndEvents
Hi, I run into this bug when trying to create an accordion-like table with autocomplete input for editing. Seems like cloning the original input field with the parameter "cloneDataAndEvents" set to true, will still take the input value from the original, instead of the clone's value. You can work it around by cloning it without copying the events, but, suppose you don't want to clone the input, but rather a container that owns the input and other event-bound children. In that case, you would have
[draggable] Stop dragging when condition happened. How?
Hello. I'm using draggable to slide bar vertically (axis-y). When sliding object, I calculate some coordinates and when there will be some coordinates (it's dinamic value), I must prevent dragging in this direction (for example, up). but still allow to move down (and when I will slide object down, I need to allow slide it up again, until it reaches those coordinates). "Containment" dont solve this problem, because "draggable" object is much bigger than "parent" object (in height). And $(this).css('top',
dialog beforeClose event SOLVED
Hi I feel first obligated to thank the entire community for an incredible open source product. Secondly, I'm still getting my head wrapped around how the event model works for triggered events. I am binding a global dialog close handler and I need to take some action on the dialog's contents before the dialog "goes away". I have the handler in place, but am grasping at the event object passed. I need the ID of the original div that was used to create the dialog.... I'm trying something like this:
How to have Accordion with position:fixed?
Im trying to fix in a window postion... any suggestion?
Drag n drop with imaginary guidelines
I need something like this. But when an element is dragged guidelines are created by the borders of other elements in the page. It's like the igoogle UI but the elements don't need to be on top. Anyone has seen something like this working ?
jQuery UI Tab
Hi, Is it possible the tab panel to have a fixed height? I need this because I need to have the tab panel content to have overflow: auto, otherwise the height will be dynamic depending on the content, which is not I want. A reason for this is because I need to put the tabs inside a dialog. Thanks.
"contenteditable" problem while using sortable
Hi All, I am trying to use the HTML5 attribute "contenteditable" inside a sortable div. This works nicely in IE and Opera, but not in FF and Chrome. In FF, I can edit the element only after a right click on mouse. "contenteditable" works fine if I remove the sortable code. Here's my code snippet: <div id="sortable"> <div><h2><a href="javascript:void(0);" contenteditable="true">Edit me</a></h2></div> <div><h2>Two pears</h2></div> <div><h2>Three oranges</h2></div> </div> <script> $(function() { $('#sortable').sortable();
copy/paste broken when datepicker attached to input field
Hi guys, I've come across a small problem using the datepicker from jquery-ui. When attaching a datepicker to an input elements as below, the key bindings for copy and paste seem to be lost. $(document).ready(function() { $('.datepicker').datepicker({ changeMonth: true, changeYear: true, dateFormat: 'dd/mm/yy' }); }) <input class="datepicker" type="text" name="mydate" value="01/01/1981"> I suspect that this is because the use of keyboard shortcuts that are attached to the datepicker. Is there
Datepicker 1.8.4 automatically selects day on all months ? Bug ?
Hello. I have found that datepicker from version 1.8.4 automatically selectes day on all months (when I select 5th of may then 5th day of month will be selected on all other months - visible on going to other months) - by selected I mean that ui-state-active class is added to element. You can check this on demo (especially easilly visible on multiple month). Version 1.8.1 was not doing this. Is this a feature or bug ? Is there any way of turning it off, I mean to select just one day ?
ui datepicker extract the day and show it in a hidden text field
Hello everyone, I have downloaded and installed the jquery ui datepicker succesfully. Now i want to extract the day after the user have selected a date and show it in a hidden textfield. But i am new to jquery and dont have any idea on how to do this... Can you guys help me out?? grts frederic
Autocomplete - options not redisplaying
I just recently moved up to jquery UI 1.8.4 from 1.8.0, and this was introduced somewhere along the way. The problem is visible in the "remote datasource" demo for autocomplete. Reproduction: 1. Type in 'sp', wait for results 2. Press backspace, results go away as intended. 3. Type 'p' (field now reads 'sp') 4. Note, results do not come back. Granted, you can press the down arrow to get the list, but that is not immediately obvious to the average user. I went into the code see if i could easily
Accordion. Change left margin for content.
How can I change the left margin for accordian content? I want my content to be written wih no left margin.
Next Page