UI.Sortables inside UI.Tab
Arrgghh... this is driving me crazy If i have this inside the body <ul id="Columns_List"> <li>Item 1</li> <li>Item 2</li> <li>Item 3</li> <li>Item 4</li> </ul> The items are stacked on top of each other (which is what i want BUT, if i have this <ul> inside a tab from the UI.Tabs, they are horiz from each other <div id="TabContainer"> <ul> <li style="list-style-image: none;"><a href="#Columns_Tab"><span>Columns</span></a></li> <li style="list-style-image: none;"><a href="#Details_Tab"><span>Details</span></a></li>
Sortable Demo questions
Hi, I have several questions related to the sortable demo at jquery ui. In the first demo "Default, no options" there are two list. If I drag and drop all the items in list 2 to list 1 there is no way to drag and drop back some items in list 2. Any idea how can we do that, or this is something limitation of jquery. Second, in IE if the ui.sortable is inside ui.tabs then drag and drop of the list items does not work in many cases. For example each tab is loaded using ajax and the same does not work
Draggable Demos not working properly
Hi, The Draggable Demos not working properly with the "using helper option" See http://ui.jquery.com/functional_demos/ and try testing with the first blue box I've tested in Firexbox 2.0.0.14
Too many files to include
Hello, First let me say great going on the release of 1.5b4! But there's one thing that seems to be a concern for many developers that are new to jquery and it the need to include so many files. Why is this so? Could there not be a single include with all the UI components packed in? And if there's a need for special packaging that that could be done from the website? This in my opinion would make it much easier for both new and existing developers to use, and it would also speed up the load time
Accordion - in reverse
Hey Guys, I've been asked to implement a variation of the Accordion which seems to fall outside of the scope of the standard implementation. Before I write too much custom code, I thought I'd run it past you guys to see if anyone else has had any experience of it. Basically, as we know, the standard Accordion works as follows: <ul> <li> <div class="always"></div> <div class="sometimes"></div> </li> <li> <div class="always"></div> <div class="sometimes"></div> </li> </ul> Where, when hovering over
UI resizable with no child handler
Hello! I try to use the ui.resizable with an outer (south) handler, but it not works. Code: jQuery('#cntr').resizable({ handles: { s: jQuery('#southHandler') } }); where the #cntr is a div, and the #southHandler is NOT a child of #cntr. #aDiv > #mainCntr > #cntr (and some siblings) and the handler: #aDiv > #southHandler where the #mainCntr and the #southHandler are siblings In the docs: "If the handle is not a child of the resizable, you can pass in the DOM node or a valid jQuery object directly."
1.5b4
Anybody else getting $.effects has no properties in firefox when using jquery.ui-all-1.5b4.js with jquery 1.2.4b on $.effects.blind = I even used just a plain html page which linked to the 2 files (see code below) and am getting the error. <html> <head> <script src="/js/jquery-latest.js" type="text/javascript" language="JavaScript"></script> <script src="/js/jquery.ui.latest.js" type="text/javascript" language="JavaScript"></script> </head> <body> test </body> </html>
Drag and Dropping - ID of original and new table cell
Hi, I am trying to do a table, each cell with a <div> inside it. The <div> in each cell is droppable into a new cell. I need to know the ID of the original TD and the new TD which the div has moved to. So far I have: $("#theTable td div").draggable({ containment: "#theTable", cursor: 'pointer', zIndex: 130 }); $("#theTable td").droppable({ accept: "div", drop: function(e, ui) { // Cell moving from fromCell = $(e).parent("td").attr("id"); // New cell newCell
receive callback function not being called with sortable()
I have a simple table using the following javascript: $(document).ready(function(){ $("#contents tbody").sortable({ revert: true, receive: function(e,ui) { alert("in the receive"); console.log("received ", ui.item, " from ", ui.sender); } }); }); I am able to sort the <tr> tags just find, but the receive callback is never run. Am I missing something? Thanks for the help.
[NEWS] jQuery UI 1.5b4 released
Just hours after beta 3, the 4th beta of jQuery UI is now available. For all the details: <a href="http://jquery.com/blog/2008/05/05/jquery-ui-15b4-featuring-effects-and-a-new-home/" target="_blank">http://jquery.com/blog/2008/05/05/jquery-ui-15b4-featuring-effects-and-a-new-home/</a> - Richard Richard D. Worth jQuery UI Team
Using handle option with ui.draggable
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> </head> <body bgcolor="#ffffff" text="#000000"> I have a modal dialog created with jqModal, loaded via AJAX. I have a div at the top of the dialog with id="draghandle". I am trying to restrict the dragging to only be done when clicking on this handle. Here is my code in my document.ready function: <blockquote><tt>$("#editdialog").draggable({handle: "#draghandle"}); </tt> </blockquote> This doesn't seem to do anything.
build your own
"Please select one or many modules using the checkboxes and press the download button when you're done." should that be changed to one or more modules also clicking the download gets a zip wher i was expecting a single jsmin file
twitter: jQuery Enchant and jQuery UI have been merged to a single project!
http://twitter.com/jqueryui/statuses/803690324 Anyone care to expound? You'd think something like this would be mentioned in more places then just Twitter.
Tabs requires ui.base.js?
I see on the wiki that Tabs now requires ui.base.js. (http:// docs.jquery.com/UI/Tabs) This seems like a large requirement as the packed version of tabs is around 6.5k, and the packed version of ui.base.js is 3.7k. Looking at the current base file (http:// dev.jquery.com/view/trunk/ui/ui.base.js) it seems just about everything in there is related to mouse stuff. So what functionality is in there in ui.base.js that Tabs needs that warrants a 50%+ increase in filesize, as well as an additional connection
Using "Datepicker" with PHP
Hi, I'd like to use the Datepicker in my PHP/MySQL database application so the user can pick from a date rather than have to type one in. At present I'm using dropdown boxes to select Day, Month Year but would love to have a popup calendar. Anyone got an example ? I've posted a question on DevShed with details of my present code if that would make my question clearer. http://forums.devshed.com/php-development-5/using-jquery-datepicker-with-php-527545.html TVM Mike
Sortables - IE 7 revert - zIndex - Varying Size Sortable Items
I downloaded the latest UI build 1.5b2 running on JQuery 1.2.4a. Target browser is IE 7. I am creating a portal where users can drag and drop portlets from one zone (sortable) to another. I have found 3 bugs so far. 1) IE 7 Revert - When I enable revert, if I drag sortable items really fast over and over, they often overlap each other and get bugged out. 2) zIndex - When using multiple sortables with connectWith, if I drag an item from Sortable A to Sortable B, the item's zIndex is messed up when
ui Dialog Window
I want to do an ajax call which return a window content. As a result of ajax call, a dialog window opened with contents. Problem is that, dialog window must be small enough if content is little. Dialog window content should be exacly some width and height value with content. But if ajax returned content is have wider and higher than user window so dialog will be open with normal size with appearing scrollbars. is it possible to do that with jquery ui? 1.5 or 1.6? thanks.
ui.slider
Hi I just tried out the ui.slider in Firefox2 It is very jerky - surprising for such a simple control. The main culprit (according to Firebug) is curCSS weepy
Drag & Drop demo doesn't seem to work in FF2
<a href="http://docs.jquery.com/UI/Droppables">http://docs.jquery.com/UI/Droppables</a> The example demo on that page doesn't work in FF <a href="http://2.0.0.12">2.0.0.12</a> or IE 6 on Windoz XP Thanks Fred
JQuery UI + iframes
Is there any way to add drag'n'drop ability to elements on the page that has an iframe inside? I want to make div element inside iframe source droppable, but i cannot. I found jquery.frameReady library, but it doesn`t help. Please/ help.
Clicking on an image to drag it makes it flash in position 1 for a short time in firefox but not safari
In firefox, whenever I click on one of the images, that image flashes in position1 for a very short time (the two images seem superposed). This gives a jerky effect on picture 1 which is not acceptable. this does not happen in safari, the sort proceeds normally without jerkiness on picture 1. Am I doing anything wrong? I am using the lastest 1.5b2 download. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:// www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">
What happened to 'experimental'?
Hi, I was wanting to play with the tree widget referenced on you docs page (http://docs.jquery.com/Ui), but it points to an 'experimental' folder in svn which I am not seeing. Also, all links to it that I have seen seem to be m.i.a. as well. For example: http://dev.jquery.com/view/trunk/ui/experimental/tests/tree.html. I am trying to get jquery into our project, but need a good tree widget (even if it is in beta form). I ave seen the treeview plguin, which might do (have to check how well it works
Update on Safari 2 compatibility?
Any word or official position on Safari 2 and UI? There's an issue in current trunk with base.js In the beta2 release sortables/draggables are not working, and there is a patch still unapplied on trac. (As a side note, as a guest none of the 'reports' are really working for me!) I'd love to know the status - it is vital that I'm using a ui library that works on Safari. I'm willing to kick in time and patches if there is a push to get this ironed out. Thanks, Sudara
Using ui.datepicker inside an AJAX dialog?
I'm trying to use the Date Picker inside an div where I'm loading the content via AJAX. It keeps blowing up on the following line inside ui.datepicker.js: /* Initialise the date picker. */ $(document).ready(function() { $(document.body).append($.datepicker._datepickerDiv) .mousedown($.datepicker._checkExternalClick); }); I'm using the Date Picker v3.4.3 and jQuery v1.2.3. Can I not load the date picker dynamically? -Dan
Draggable jQueryUI Margins Bug and Fix
Bug: Doesn't account for margins when dragging. Fix: http://pastebin.com/pastebin.php?diff=m711babbe or see below $.ui.plugin.add("draggable", "grid", { drag: function(e, ui) { var o = ui.options; var t = $(ui.helper); var newLeft = -parseInt(t.css('marginLeft')) + ui.instance.originalPosition.left + Math.round((e.pageX - ui.instance._pageX) / o.grid[0]) * o.grid[0]; var newTop = -parseInt(t.css('marginTop')) + ui.instance.originalPosition.top + Math.round((e.pageY - ui.instance._pageY) / o.grid[1])
Datepicker Utilities
I'm a little new to jQuery so maybe its a simple answer, but how do you use datepicker utilities? I'm trying to use formatDate and without success: $(function () { $.datepicker.formatDate('yy-mm-dd'); //set format $("#dateinput").datepicker( { rangeSelect: true, onSelect: function(dateText) { $('#rangedate').val(dateText); } } ); });
Draggable ui1.5b2 in Opera 9.25
If I want to drag first div, all ok. But if I want to drag second div shifted left and bottom when dragging start. With jquery-1.2.3 draggable don't work. This bug only in opera, in ie6,7 and ff all ok. Please advice. <html> <head> <script src="../ui/jquery-1.2.4a.js"></script> <script src="../ui/ui.base.js"></script> <script src="../ui/ui.draggable.js"></script> <script> $(document).ready(function(){ $(".block").draggable(); }); </script> <style> .block { border: 2px solid #0090DF; background-color:
A File Tree?
Hi, Any plans to include in JQuery UI something very useful like a File Tree? This is required in many web applications, and it also looks very good (so it would make a nice demo). One example implementation (in a very early stage): http://abeautifulsite.net/notebook.php?article=58 Of course it can't compete with the advanced FileTree based on ExtJS: http://filetree.extjs.eu/ but at least it woud be a start since JQuery doesn't have such a "widget". Thank you, Demetrios.
Unblocking after modal dialog is closed
Problem: After closing a modal dialog other actions bound to click remain blocked. jQuery UI 1.5b2, Firefox 2.0.0.14 Example: 1. Below is the HTML page containing jquery code 2. Click "Open modal dialog" link => dialog opens 3. Close dialog from "X" in top right corner => dialog disappears 4. Click "Other link with click event bound" => Problem: should display alert box but nothing happens What am I doing wrong? <script type="text/javascript" src="./js/jquery-latest.js"></script> <script type="text/javascript"
FIrefox jQuery Effect Prblm
Recently I faced A little Problem with my jQuery at my FireFox Browser I check My codes with 2 browsers which are Standard and Suitable for testing 1-IE7 2- Firefox 2 I used some jQUery Effects such as toggle ,slideDown, slideUp and etc… There was no problem in my IE7 but in one situation there was a problem in my firefox … If we scroll the page down at thebottom of the page there is button which is Clickable and it will do some toggle and slide effects , in Firefox We will face some Flashes in the
Datepicker -> Multiple dates (not a range)
Hello friends! Is there any way to select multiple dates (not a range of them) using Datepicker? Thank you! -- Sendoa
Tabs disappear
Hi, For some reason the tabs disappear keep disappearing after they have been toggled, does anybody have a solution? An example can be found here: http://grinjo.nl/melle/dev/tabs_test.php Tested in FF2 + IE7 / Win XP SP2 Regards, Melle
Dump objects for debugging? (was: Draggable/Droppable question)
> drop: function(ev, ui) { > $(this).append(ui.draggable); > } I have a question related to my first one in this thread. The biggest frustration I am having with jQuery right now is that I can't see what is in the objects. For example, in the above code, I'd like to find a function that lets me dump out the contents of "ev" or "ui". I come from a ColdFusion background, and that language has a tag called cfdump. You can feed ANY variable to cfdump (query objects, arrays, hash/structures, etc.), and
sortable/draggable switching target how to ????
Most honorable Members of the list, that is the structure I do have: ++++++++++++++++++++ <div id="A"> <div id="AA" >....</div> <div id="AB" style="display:none" >....</div> <div id="AC" style="display:none" >....</div> <div id="AD" style="display:none" >....</div> </div> <div id="B"> .....</div> <script> $('#AA').sortable({}); $('#B').draggable({connectToSortable:'#AA'}); </script> ++++++++++++++++++++ in the first stage the elements of $('#B > *') are being dragged and sorted nicely into '#AA'->
making the dialog more dynamic
Hi everyone, I'm trying to make a dialog function that is dynamic, and it sort of works, but there's a couple of problems. Here's the function: function ShowAlert(DialogTitle, message, w, h){ if(arguments.length <= 2){ w = 300; } if(arguments.length <= 3){ h = 100; } $("#genericDialog").text(message).dialog({ modal: false, width:w, height:h, title:DialogTitle }).dialog("open"); return; } ... I then have a div in my body like
interface.eyecon.ro offline?
Hello everyone, I've noticed that the website interface.eyecon.ro is offline. Does someone knows how this comes? And if he is comming back online? Thanx!
[BUG+PATCH] ui.droppables: calc position creates undroppables on elements not yet added to DOM
Hi there, I've been trying to create DOM elements, make them droppable, and add them in one fell swoop... pretty much ala: var $li1 = $('<li class="one">foo</li>'); $li1.draggable({opacity: 0.5, helper: 'clone'}); var $li2 = $('<li>bar</li>'); $li.droppable({ accept: '.one', tolerance: 'pointer', activeClass: 'droppable-active', hoverClass: 'droppable-hover', refreshPositions: true, drop: function(ev, ui) { alert('dropped '+ui.draggable+'
jQuery Templates
I've re-worked the original proposal I sent out for jQuery Templates. From the feedback I received, people didn't want it using the ui namespace - so that's gone. I've also added the ability to apply these templates directly with the manipulation methods by altering the behavior of the core domManip() method. The source is available at: http://stanlemon.net/files/jquery.template.js I'd love some feedback on this, thanks. -- - Stan Lemon stanlemon@mac.com Latt. 40°35'15.66"N Long. 79°49'20.97"W
Draggable/Droppable question
I spent a couple of hours digging through docs and examples last night, and I couldn't find an answer to what seems a simple question. I am a jQuery newbie, so sorry if this is a FAQ. I am playing with the draggable demo code on jquery.com, and I am trying to modify it so that I can have multiple images as draggables, and then when I drop them into the droppable, it will show the dropped image. But I can't figure out how to display the correct image. Here's some code: $(document).ready(function(){
Accordion height
How do I set the height of an accordion? As far as I can see, it only get's as tall as the tallest panel's content. Maybe I am missing something here. Help would be appreciated, Timothy Farrar
Next Page