draggable and resizable both with containtment
Hi am, I am having a problem I don't know how to fix. I have a container div. Inside this container div I have another div, which is resizable and dragable, just like next: $("#id").find("id").css("width", width).css("height", height). draggable({ containment: "#id", grid:[grid_shift, grid_shift], start: function(event, ui){ ... }, stop: function(event, ui){ ... } }). resizable({ containment: "#id", grid:grid_shift, maxWidth: (width + grid_shift*8), start : function(event, ui){ .... }, stop : function(event,
How to make Draggable execute refreshPositions not on every mousemove but with a specific callback.
There's a configuration option for draggable, refreshPositions, that causes UI to recalculate everything every time the mouse moves. Is there an option to recalculate it not every time the mouse moves, but rather at specific times. I assume this would take the form of some kind of a function call I could put in wherever I needed the positions recalculated.
jQuery UI 1.8rc1 is out
The first release candidate for jQuery UI 1.8 is out and is live on http://jqueryui.com/demos/ . You can download it here: Downloads File Downloads Development Bundle: http://jquery-ui.googlecode.com/files/jquery-ui-1.8rc1.zip Svn Tag: http://jquery-ui.googlecode.com/svn/tags/1.8rc1/ Changelog See the 1.8rc1 Changelog for full details on what’s included in this release since 1.8b1. Barring any catastrophic problems this code will become jQuery UI 1.8. NOTE: If you’re using jQuery UI 1.8rc1 and you
Datepicker not passing values along
Hi, all! I have this little problem, which I can't find an answer to. I have a form with a datepicker and a couple of other select fields. However, when I submit it, my datepicker info is not being passed along, only the other selects. I;m attaching the code in the pastebin: http://pastebin.com/m327416fa I tried to remove the noscript part, use div instead of input, but to no avail. Do you guys see anything out of the ordinary? Thanks a lot! Luka
UI Dialog Resize Issue
Hi, I've seen this asked before, but the answer didn't help in my case. I have a dialog that I initially pop up at a small size. After an AJAX call, content comes back to display in the dialog which requires that I resize the dialog to a larger size so the user can see what is going on. To resize the dialog I am using: $('#dialog').dialog('option', 'width', 500); $('#dialog').dialog('option', 'height', 500); The outer div of the dialog and all the window elements are resized, however the inner
re-enabling disabled sortables?
hello jquery friends, I have a slightly strange situation here where in jquery-ui pre-1.6, this worked but with jquery-ui 1.6 or later, I can't seem to re-enable a disabled sortable. For example, say we have the following HTML fragment <ul id="foo"> <li><div>one</div> <li><div>two</div> </ul> and this bit of javascript : jQuery(document).ready(function() { jQuery("#foo").sortable(); jQuery("#foo").sortable("disable"); jQuery("#foo").sortable(); }); The sortable will not be sortable.
.draggable stops working after realoding list with ajax (IE7)
Hello, I have built a treeview that loads its nodes via ajax. Every list-item got the classes draggable and droppable, which Im using to make the items both draggable and droppable. The code Ive written works in Firefox and Chrome, but im having troubles with Internet Explorer 7 (havnt dare to test on other versions of explorer yet). When I make the treeview items draggable and droppable for the first time, it all works fine. But when I open a new child node, and the tree is reloded, it doesnt work
uncaught exception: jQuery UI Tabs: Mismatching fragment identifier.
I'm using jQuery 1.3.2 with jQuery UI 1.7.2 and trying to get a new set of tabs to work. I'm getting the exception "uncaught exception: jQuery UI Tabs: Mismatching fragment identifier." in Firebug when trying to switch between the tabs. The tabs themselves get created and all of the classes and such are added. Events such as the tabs select event fire properly, and if I alert the hash value that it is trying to find the hash is correct and matches the hash that it is supposed to switch to. The relevant
Autocomplete for not all select fields
Hi I'm trying to set up an autocomplete field in a form that has other select fields that should not be autocomplete. How do I set that please? I need the field to be a select for accessibility issues. Any help would be great. Thanks
I have a problem with UI Tab ajaxOptions
Hi: Here's the thing: I'm using the UI Tabs like this: $('#tabs').tabs({ select: function(event, ui) { if ( ui.tab.hash == "#tabs-admin") { window.location.href="/backend.php/"; } } } ); I have three different tabs: Main, Reports and Admin. The main tab is static html, Reports gets loaded through ajax and Admin redirects to a different page. The problem is when I select Reports. I get an error saying ajaxOptions is null, but according to the documentation,
How to select first Tab
Hello, I have specifyed an function that is called in the select event. this function make an validaten and should select the first tab when validaten breaks. I want to do this with $('#mytab').tabs('select', 0); with an 0 as index it does not work, with an higher index e.g. 2 or 3 it select the correct tab. How can I select the first tab? jquery: 1.3.2 jquery-ui: 1.7.2 Best Regards Johannes Geppert
Datepicker opening when date set
I have a number of datepickers attached to text boxes. Then I have some buttons which when clicked set the dates on these datepickers to some presets. I use the setDate method like so when a button is clicked: $('#selector1').datepicker('setDate', new Date(year, month, day)); $('#selector2').datepicker('setDate', new Date(year, month, day)); This works fine. However, if you click on the text box and choose a date yourself with the datepicker, then whichever datepicker you last used pops open and
jQueryUI datepicker not working when used with blockUI plugin.
I am using the jquery blockUI plugin for a form and in that form i have a date field for which i have used the jquery UI datepicker widget. The widget works fine however my problem is that it appears at the back of the block UI and hence it is not selectable. What i want is that the datepicker appear on Top of block UI. My guess is i need to change the z-index. But i am not able to find it. Can anyone guide me with the CSS of datepicker widget. Thanks
Drag table row onto another, to combine?
I've got rows in a table, and would like to drag one row onto another, such that (if certain code checks pass) the two rows are combined. I've seen a couple of comments in my Googling that imply that such things aren't possible under jquery-ui, but wanted to make sure before I try another approach. If it matters, I don't mind limiting the drag-n-drop to a particular column, but when I try that, I can drag a <td>, but it never gets dropped. I've also tried dragging the <tr>, but that gives a js error.
Dialogs, Cloning and Live
I have a form that I am using in a dialog modal box. This form is submitted via AJAX to a backend PHP script that inserts a record into the database. Next the item that has been inserted into the database (a list of tasks) that task is added to the end of an unordered lists. I also have this unordered list setup so I can drag and drop the list items to sort them. Once dropped, again, a script updates the database. Lastly, I have an inplace editor setup so I can easily edit the contents of each task.
Resizing a dialog
Hi All, I'm having difficulty resizing a dialog box. Sample (and code) can be found here: http://jsbin.com/ocusa Clicking the "Repeat" checkbox should expand the size of the dialog box. Without adding dialog buttons the resizing seems to work fine (in Firefox for Mac at least, haven't tested all browsers yet). Yet, no matter how I attempt to add in the dialog box buttons I cannot get the resize to work; either the dialog box buttons disappear or the size is not set correctly on initial display. Any
Draggable div IE bug
This may not be a problem with jQuery, probably with IE, but here's my situation. I have a grid of divs in a container and they are all draggable. listItem.draggable({ revert: "invalid", appendTo: "body", helper: "clone", start: function(event, ui) { $(this).css("visibility", "hidden"); }, stop: function(event, ui) { $(this).css("visibility", "visible"); } });As you can see I wanted
jQuery UI 1.8b1 is out with 2 new plugins: button and autocomplete
The first beta release for jQuery UI 1.8 is out. You can download it here: Download File Downloads Development Bundle: http://jquery-ui.googlecode.com/files/jquery-ui-1.8b1.zip Svn Tag: http://jquery-ui.googlecode.com/svn/tags/1.8b1/ Changelog See the 1.8b1 Changelog for full details on what’s included in this release. Please help us test this and beat it up. The plan is to have one more beta release, and then an rc1 before final. Thanks A big thanks to all that have worked on all the bug fixes and
How do I access the new element created when dragged from another list?
I'm using this example, where I can drag an element from one list to create a new element in another list: http://jqueryui.com/demos/draggable/#sortable I'm adding a dragstop callback function on the draggable and trying to access the new element created. I'm finding ui.helper refers to the original element, and can't figure out how to select the new element created. How do I reach it? Thanks.
Using selectable in combination with sortable
hi, i got a ul/li list which should be selectable and also sortable. so in first place the selectable plugin should allow to select a portion of the listitems und afterwards i want to move this portion using drag&drop (sortable)... is this possible? any examples? thank you, markus
Drag and drop fails when toggling show() and hide()
Example on: http://docent.devine.be/jill.vandendriessche/xmedia/ When clicking on the titles to the right, some images appear. Those images are supposed to be draggable to the wishlist area to the right. The drag and drop worked until I used the show() and hide() methods to hide the images. Now it seems as if my accepting box simply doesn't accept the dragged element anymore. i'm using a combination of draggable and sortable, as I need the items in the wishlist to be sortable. For usability purposes,
UI Components on one page - but with different look and feel
I'm a newbie at this - so please correct gently if I am wrong. First, I should say that what all you jQuery folks are doing is outstanding. One of the problems I see with UI is that the code uses explicit classes and those classes are global to the page. For example - I may wish to shoehorn some search boxes with tabs in one part of the page - with one look and feel - and another set of tabs on the same page with another. I want to have the ability to have different class files for each instance
IE6 crash with Dialog and load option
Hi, I'm currently working on a site that uses jquery-ui to present popup with flexible content based on the URL on the link clicked. The JS code for this is: $(this).bind('click', function() { layer_href = $(this).attr("href"); layer_title = $(this).attr("title"); dialogOptions = { width: 875, position:["center",66], modal: true, bgiframe: true, title:
how can i fetch the time from jtimepicker????
I was using jtimepicker in which the the time is displayed. using a div. i want to fetch the time from the jtimepicker.. how can i fetch the time from jtimepicker???? Pls give me some solutions guys... Thanx in advance..
ui.Tooltip: tooltip on link with image not working
Hey guys, Following code works fine for text links, but doesn't work for the link with the image.. <script type="text/javascript"> $(function() { $("a.help_tooltip").tooltip(); }); </script> <a href="#" class="help_tooltip" title="BlaBlaBla1">Hier.</a><br/> <a href="#" class="help_tooltip" title="BlaBlaBla2">Hier.</a><br/> <a href="#" class="help_tooltip" title="Heureka..."><img src="http://static.jquery.com/files/rocker/images/logo_jquery_215x53.gif" ></a>no idea why its not working,
Nesting Tabs in an Accordion
I have a JavaScript application which allows a user to upload and arrange a series of photos so as to define the layout of a single html page. I am currently using jQuery UI tabs to do this. One tab is for drag-and-drop from the desktop. Another allows the user to discard, rotate, and re-arrange the order of photos. A third allows the user to set various attributes, and a fourth shows a 'finished' layout. This is all very good, but there are times when the user may have 30 to 100 photos to layout
Dynamic div field in UI Tabs Slider
Hi, I have on a website script build on jquery:ui tabs It's a slider with a div field. The content is inside a div so i want make it dynamic height change. I start it like this: $("#featured > ul") .tabs({fx:{opacity: "toggle"}}) .tabs("rotate", 5000, true); Then: $('#featured #fragment-1 .info').css('margin-top', function() { return ( 250 - $(this).innerHeight() ) }); $('#featured #fragment-2 .info').css('margin-top', function() { return ( 250 - $(this).innerHeight() )
datepicker and tabs
Hi, The first thing i need is how to increase number of years in datepicker dropdown the second is a problem i am using Jquery UI Tabs which starts perfectly and load eveything but there is a problem which make these tabs useless for me and the problem is the first tab is selected on page load but i am not able to switch to other tabs i am using firefox and its really tired me now i am thinking to quit and create my own tabs in javascript it will be much easier, i am using the button and datepicker
Tabs and search engines
Hi! Will Google and other search spiders index all of my jQueryTabs (without ajax) or just the first tab?
Problem with Jquery tabs Ajax mode
Hi I used Jquery tabs for my index page in ajax mode (By using <a href="profile.php"> in list section). It works and invokes html from source(profile.php). Also java scripts that i have implemented in body section of source file executes successfully. I have included a js file in that source file, too. But those js files doesn't execute. I tried following hint and java scripts included in profile.php executed successfully. But I think it is stupidly, And now I'm looking for a regular way to do this.
Can I Change This?
Alrigh guys I am wondering can I change the performatted date display? So instead of having the date display in 02/01.2010 I could have the word of the month display in the output in the text box? I.e dec/01/2010
Sortable UI - Control list from outside iframe?
Hello, I would like to sort a list UL. How can I add the jquery files outside the iframe but control the list within the iframe? My setup requires that all scripts will be placed outside the iframe. Please help. Adrian
Draggables and sortables Issue
I have encountered a problem with the demo on page http://jqueryui.com/demos/draggable/#sortable When I drag the "drag me down" item at the top of the list into the sortable list, it work only if a pause before adding another one. If you add new items too fast, an gap (empty placeholder?) appears and the whole thing hangs. See the attached screenshot. I use Firefox 3.6 on Windows 7.
Accessing Accordion from within an iframe
Hi, I use an accordion as a menu that loads the content of an iframe. I need to use the .accordion('activate',index) funtion from within the iframe. How can I do this? Regards, Roar Bjørndal-Rasmussen
datepicker: altField + 3 days (date range)
Hello, I'm currently working on a tool that allows the user to select a date range using two date fields: - date from - date until I want the 'until' date field to be populated automatically after a 'from' date has been selected with the 'from'' date, + a few days (let's say 3). I don't think the default functionality supports this behaviour but I can't imagine no one has ever run into this problem before. Does anyone know how I can realize this behaviour? Maarten
datepicker css problem
Attached are examples. I'm having a problem where the datepicker is hiding behind other z-indexed items. I have noticed that the problem happens in IE7 and Firefox 3.5.7. In IE, it was having problems doing it over the accordian, while in firefox it was having trouble with it all of the time. I think the problem fixed itself when I added this Z-Index to the datepicker css: .ui-datepicker { width: 17em; padding: .2em .2em 0; z-index:99999;} USING: jquery-1.4.1.min.js USING: jquery-ui-1.8rc1.custom.min.js
This Is Still Not working, even though I have followed the limited Instructions!!! Come On..................
Firslty let me start of by saying that even though you have a nice impressive plugin sets that becomes very useless when you instructions on how to install stuff and to get thingsa to work are unhelpful.... This is getting beyond a joke... I have now been successful in getting the datepicker script to work on this page http://digitalresellersvault.com/html/admin/datepicker.html However when I move it over to add it to a membership site.. The page that I am adding it to stops working.. I am
Droppable Accept
Hi, I am trying to implement server side validation for accept function. I need to send ajax call out. However, I realize it sends tons of requests out because it is evaluating function anywhere in the droppable area. What is the best practice for evaluating the accept option at server side? Thanks.
webtoolkit scrollable tables not working on 2nd jquery ui tab
I'm using the webtoolkit scrollable table plugin on two tabs. The first tab will displays correctly with a scroll bar for the table. The second tab just loads the whole table without adding a scroll bar. When I reverse the order of the tabs the one that would not display the scroll bar now shows it correctly and the other tab does not. Any ideas? <link type="text/css" href="theme/ui/ui.all.css" rel="stylesheet"> <script type="text/javascript" src="JS/jquery-1.3.2.min.js"></script> <script type="text/javascript"
Dialog form load/submit
Hi, there! I'm trying to show a form loading the template in a dialog like: $('#form_dialog').load(url).dialog({ bgiframe: true, autoOpen: false, height: 330, width: 800, modal: true, buttons: { "Cancel": function() { $(this).dialog("close"); } } });The problem I've found it's when I try to submit the form, it redirects me to the page I've loaded in the dialog. Is that a wrong way to show and submit forms? How I have load the form and submit it through the dialog? only with an javascript form
Next Page