create text on drop
I need to display some text when dropping a div. I have two sortable bucket divs with other divs inside. I have the drag and drop working, but now I'd like to display text stating where the dropped div came from. Any ideas? Thanks,
Range sliders not quite working
Hi everybody! I have a bunch of sliders of various varieties all over this site I'm working on, and I have a minor issue. When I'm using jQuery 1.2.6 and UI 1.5.3, the $.slider("value") and $.slider("values") methods do not have the expected effect. In the online documentation it's unclear which version is being described, but "values" should be able to set the values of a ranged slider, but it has no effect. When I'm using jQuery 1.3.1 and UI 1.6rc6, "values" and "value" work as expected but there
datepicker
Hi there's a couple of things that id like to ask. Here is my code: $(function() { $('#deliverydate').datepicker({ minDate: +1, maxDate: '+1Y', changeMonth: true, changeYear: true, showOn: 'both', buttonImage: '../../images/general_images/ calendar.jpg', buttonImageOnly: true, altField: '#actualDate', altFormat: 'yy-mm-dd', }); }); basically I want the user to see the date in the 'dd-mm-yy format' (this already happens) but i want the post information to be in the 'yy-mm-dd format'. The document
Suggestion: a comment for ui.theme.css
This is a suggestion: It's probably appropriate to annotate the lines in ui.theme.css to the effect that "filter:" clauses are, for now, IE- only hacks. In other words, annotate the lines containing the following filter:Alpha(Opacity=NN) Rationale: I think it's generally recognized and accepted best practice to annotate CSS hacks or, to be more charitable, annotate anything we do in CSS that isn't standard. This will save some goose- chasing by folks seeking to override jQuery-UI's very pale (too
Datepicker covered
I have a date field near a flash object. When I activate the calendar, this is covered by the flash object and I just can see the first two weeks on the calendar. What can I do for the flash object don´t cover the calendar ??? Thanks for your help.
Resizable modal dialog, iframe and scrollbar issue
Hi folks I've built a modal dialog loading content from another URL via an iframe. See screenshot: http://www.sac.ac.uk/static/scrollable_modal.jpg The right-hand drag handle generated by the parent resizable div (it's classed "ui-dialog flora ui-draggable ui-resizable") sits directly above the iframe's scrollbar when the loaded content is taller than the height of the iframe. Using Firebug I can fix this by tweaking the width of the "ui-dialog flora ui-draggable ui-resizable" div so it's 6px wider,
Tabs can't be recreated
I have tabs that I need to regenerate sometimes with local javascript values. Before, I was recreating the html tree with $(...).html(...) and calling .tabs(). But now it doesn't work anymore. It looks like tabs() works only the first time. For example, var mybox = $('#mybox'); // get a $ link on a div box ready to be tabbed (with ul and everything inside) mybox.tabs(); // works well mybox.tabs('destroy'); // works well too mybox.tabs(); // doesn't do anything Maybe it's the new way to do to not
Infinite loop in IE8 release candidate 1 with modal jQuery UI dialog if DOCTYPE is specified as XHTML 1.1
Hello, First, thanks to everyone who has worked on this project. It is an incredible resource and I'm extremely appreciative of all of the hard work. That said... <grin> I have been working with modal dialogs just fine using jQuery 1.3.1 and rc6 of jQuery UI. I'm pretty early stage in a UI redesign for our application so I'm testing the heck out of things on multiple browsers (IE6, IE7, IE8 beta2, FF 2, FF 3, Chrome, Opera 9.6, Safari) on multiple platforms (Windows, Mac, Linux) and everything was
Creating Tabs in an ajax driven Dialog window
I am trying to make the transition from the older versions of jquery (1.2.6) and jquery UI (1.5.3) to the newer versions (1.3.2 and 1.6.rc6) and have run into an IE issue I can't solve. In my code I have a dialog window populated dynamically by the url of the trigger class. The html that is being loaded has a Tabs element in it. With the old I was able to load the html and call the tabs() to create the tabs. However, now when I try to create the tabs it loads content from the calling page and kills
Discussion About Widgets, etc.
Just wanted to give a heads-up - we've been having a discussion related to complex jQuery apps over here: http://groups.google.com/group/jquery-dev/browse_frm/thread/1ec4dca6e02616d6/8ae7f021172ade98?tvc=1#8ae7f021172ade98 Talking about the widget code and the "scalable jQuery" write-up. --John
in array in javascript
hi everybody i have a variable and i want to if exist in_array of values is there any solution for this in jequery and thiank you very much
Multiple instances of modal dialog box
Hi, I have 3 links to difference modal boxes on a page. Quite messily I've just duplicated the code in the head[1] 3 times, mainly due to being a jQuery/javascript novice. Is there a way to neaten this up a bit? [1] <script> $(document).ready(function() { $('#helpInfo1').load("includes/file1.html").dialog({ autoOpen: false, width: 600, modal: true }); $('#helpInfo2').load("includes/file2.html").dialog({ autoOpen: false, width: 600, modal: true }); $('#helpInfo3').load("includes/file3.html").dialog({
Slider with embedded text?
I'm creating an internet survey, and in an effort to minimize screen clutter, I've come up with an idea for rating items. Please bear with me. The idea is to place the text to be rated inside the slider control, and the end user would slide that text to rate the item. It's basically a mixture of the Draggable and Slider jQuery UI controls. Since I'm still relatively new to jQuery, I thought I'd ask if anyone has already done something similar to this so I can get a jump-start on the learning curve.
JQuery UI datepicker - breaks when including jQuery UI rc6
When using jQuery UI for any of the datepicker samples the datepicker breaks! <script type="text/javascript" src="script/ui/jquery.ui.all.js"></ script> For the example with the calendar icon, the icon is not even displayed!
Working with a selected tab
My apologies if this has been covered elsewhere but I've not been able to locate an answer.. I have a set of tabs that are working well. The first tab represents a header record and the remaining tabs represent details associated with the header. The tab contents are filled via jquery ajax and all it good. Elsewhere on the page I would like to click a link and have the response vary based on the selected tab. Specifically, I'd like the dom_id of the selected tab. How can I pick that out from the
JQuery UI datepicker - breaks when using UI Themes
I have been trying to use the datepicker in a project using the official jQuery UI plugin. I had it working just fine using the example code, but when injecting it into my main code it stopped working. I tracked it down to the following: When I include the following script (generated by the jQuery UI Theme Roller), the datepicker stops working! <script type="text/javascript" src="script/jquery-ui- personalized-1.6rc6.js"></script> I have no clue why! Anyone have any ideas how to resolve this? How
Can't seem to get the Datepicker working inside a Dialog
I can't seem to get the Datepicker working inside a Dialog. When the user clicks on the relevant text field, the Datepicker spawns underneath the dialog box so I can't see it. When the dialog box closes, the Datepicker is still visible :-( Am I setting this up wrong?
Indeterminate progress bar
Regarding the comments here: http://docs.jquery.com/UI/Progressbar When can we expect to see an indeterminate progress bar in jQuery UI? I need to make a decision on whether to expect jquery UI to have one or go with an "aftermarket" plugin soon. Thanks!
New version of Tabs not handling 2nd line
I have installed the latest version of UI on our site. Tabs that require 2 lines have a problem - the tab/s on the second line float left and right depending on which tab on the first line is selected. You can see this happening here http://www.innovativebusinessdesign.com/business_strategy This was happening some time ago with a previous version, so maybe something has reverted? Or, have I set the links to the style sheet incorrectly? I looked everywhere in the documentation and examples for the
tabs in the modal dont show up
what i am missing? I have an accordian with links which show a modal dialog, the modal dialog should have a tab menu. The dialog is full html page with head having requierd tab data (initialization). When i see the same page, separetly, tabs show up. but when the same page show up in the modal dialog, only <ul>--</ul> shows.... Kindly some one explain or tell some solution.
ThemeRoller site appears s l o w rendering
Is it just me or is the ThemeRoller site really slow today? It seems to take forever for the widget formatting and the themeing to kick-in. Has something very recently changed? http://jqueryui.com/themeroller/ **--** Steve
Seperate Files for each UI Feature?
Hi Is there away to just download the core as a separate .js file and then each other feature as a separate file. It seems when I use that UI maker thing it roles it all into one big file. I rather have them separate since I don't know exactly what ones I need and I rather just have each one as a separate file that I can just add as I got along. Thanks
Newbie question regarding passing a variable to a dialog
Hi, I'm hoping this is an easy question. I have a dialog box that I want to pass a variable to but am not sure the right way to do it. This is the dialog creation // Dialog $('#dialog').dialog({ autoOpen: false, width: 700, height: 500, buttons: { "Ok": function() { $(this).dialog("close"); }, "Cancel": function() { $(this).dialog("close"); } } }); This is the contents of the dialog... <!-- ui-dialog --> <div id="dialog"
How to allow bookmarking of a tab without moving within the page
Assuming the following tabs exist: <div id="tabs"><ul> <li><a href="#home"><span>Home</span></a></li> <li><a href="#first"><span>First Page</span></a></li> <li><a href="#fsecond"><span>Second Page</span></a></li> </ul></div> I would like to make it so when a user selects a tab it changes the hash to the selected tab (example: clicking on first makes the location bar read test.html#first ). I've tried: $("#tabs > ul").tabs(); $("#tabs > ul").bind("tabsshow", function(event, ui) { window.location =
Tabs loading text
Hallo all. Is it possible not to show the "Loading" text when load a tab? Kind regards Massimo Ugues
Tabs and IE6: how to modify space between tabs.
Hallo all. I got this need: i have to modify the space between the tabs. In firefox I defined in the css these classes: .ui-tabs-nav li { float: left; width: 120px; _width: 120px; } and .ui-tabs-nav a, .ui-tabs-nav a span { margin: 0 10px; padding: 8px; width: 100px; _width: 120px; height: 35px; _height: 50px; line-height: 12px } The css classes are correct for firefox, but i cannot make them work with ie6. I can make the li larger, but I cannot make it same dimension
Themeroller and <h1>...<h6> colors
When changing themes using Themeroller, the utility is very smart and it swaps the text colors too. Nice! However, if the widget contains a header tag, <h1>...<h6>, the text color of the header tags is not changed. Questions: 1. Is it specified that widgets will not contain heading tags? This would mean widgets styled with Themeroller are not SEO-friendly, so I would be surprised. 2. If not, then Bug! Themeroller themes should control <h1>...<h6> colors. **--** Steve
Accordion - body selector
Hi. First thing first; I LOVE your stuff - it's like magic! Then the problem... The way the accordion work (correct me if I'm wrong) is that a header toggles an element. The header option specifies the element that sould open the proceding div. What I can't seem to find is how to specify a selector for the element to toggle. An example is allways nice js stuff: jQuery(document).ready(function(){ jQuery('div.accordion').accordion({ header: "div.toggle, a.toggle", autoHeight: false, alwaysOpen:
Selectable and the IE
<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:w="urn:schemas-microsoft-com:office:word" xmlns:m="http://schemas.microsoft.com/office/2004/12/omml" xmlns="http://www.w3.org/TR/REC-html40"> <head> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=us-ascii"> <meta name=Generator content="Microsoft Word 12 (filtered medium)"> <style> <!-- /* Font Definitions */ @font-face {font-family:"Cambria Math"; panose-1:2 4 5 3 5 4 6 3 2 4;} @font-face
Tabs that link to another page with Tabs
Hey there everyone! I posted this late last night to no avail. I'm having some trouble implementing ui tabs on a particular site we're doing for a client. We wanted to have 6 or so pages of content and on each of those pages have ui tabs. The problem I'm having is with linking to other tabs on other pages from a current page. For instance: I'm on page 1 - tab subnav 3, but i want to go to page 2 - tab subnav z. HOW DO I GET THAT TO WORK??? Here's some condensed sample code: <html> <head> <script
Accordion trouble in safari.
The fillSpace-option doesnt seem to work i Safari, instead of filling the div in which it is contained, it fills the entire page i height. is this a known problem? is there a fix for it?
ui-accordion with list issue
I have just downloaded the 1.6rc6 of ui-themes. One problem I am seeing is that before my unordered list would show up as normal HTML list. After upgrading to 1.6rc6. I am seeing my list getting displayed in- line. .ui-accordion li { /* ui.accordion.css */ display:inline; } I don't think this should happen. This would mean I'd have put extra line of css to stop the ui theme breaking my page. Why would ui change my content? Framework are good but pushing me to write extra line of code that I don't
Setting fillSpace in the Accordion to different values depending on window size
Ok, i'm frankly new to jQuery, and in no ways an expert at Javascript, also english is not my native language, so please feel free to ask for clarifications if there is something you dont understand. My problem is a want to set the value of fillSpace depending on the window size, so that it will be "true" and thus locked to a fairly small size when the window is smaller than 500px in height, and set to "false" when the opposite is true. on the page there is already a function to change the layout
Dialog Issues on Rc6 and IE
Hi, I have a dialog opened with the following code: function openDialog(title,node,x,y) { $('#'+node).dialog({ width : x, modal : true, autoOpen:false, resizable: false, closeOnEscape: true, height : y, title : title }); $('#'+node).dialog('open'); } This works great in Firefox, but in IE i'm having a strange issue. If I call the dialog box with nothing inside it works as it should do, when I start putting div's inside the dialog box.. it begins to shrink in height. If I have over about 10 divs in
Sortable - Allow only 1 item to exist in the connected list. Returning previous item to other list.
Is there a way to constrain sortable so that if I have 2 lists and the user drags one item to the connected list, that the sole item in the connected list is returned to the first list and only allowing the new item to reside in the new list? Example: User wants to drag "Item 1 to the connected list. Item 4 should be returned to the list bucket. Connected List: +--------------------------------+ | Item 4 | +--------------------------------+ List bucket: +--------------------------------+ | Item 1
explode and implode effect
Good day. I want to add a simple explode effect to a div box when the mouse is over it. So far I have been able to explode it but I want it to implode back to the original state when the mouse is out or moved away from it. this what my main html file looks like: <html> <head> <link rel="stylesheet" href="style.css" type="text/css" media="screen" title="no title" charset="utf-8" /> <script type="text/javascript" src="me/jquery-1.2.6.js"></script> <script type="text/javascript" src="me/effects.core.js"></script>
product slider from 1.6rc2 (vs 1.6rc6)
I wonder if there is the possibility of modifying/update the product slider from ui-1.6rc2 to work with jquery-1.3.2 and newest UI? I know that in ui-1.6rc6 there is new demo of this kind scrollbar but is slow and doesn't work in IE...
dialog (show:slow) and position:center problem
Hi, When i use dialog control with "show:slow" option parameter it works correctly in ie but it doesn't contain anything except buttons in firefox 3.0.*. Another problem is that when i use dialog with position:center parameter it positioned near the bottom and sometimes you can see only half of the dialog. it is not steable, probably it depends main content height. So I have had to change position as a pixel coordinate. Is there a way to correct those things ? I'm using jquery 1.3.1 and rc6 ui. $('#details').dialog({
NEWS: jQuery UI 1.7 is the new 1.6
See <a href="http://blog.jquery.com/2009/02/12/jquery-ui-17-is-the-new-16/">http://blog.jquery.com/2009/02/12/jquery-ui-17-is-the-new-16/</a> - Richard
[UI Tabs] with cookie option - strange behavior when URL contains an named anchor...
Hello, I'm new to jquery and jquery UI but this one has me tearing my hair out. I've successfully set up some tabs using Klaus Hartl's UI Tabs and his cookie plug-in. Things proceed smoothly until I do one of two things: - return to the page implementing the tabs from a link having a named anchor (i.e. page.php#theanchor) - post a form on the page where the action=page.php#theanchor In both cases the UI Tabs cookies have the tab index reset to 0. Here's the jquery code: $('#mrsActivePatternTabSet
Next Page