South handles not visible with resizable?
Can someone tell me if I change the handle on a resizable to be just 's', if I should actually see a handle on the south side of the div? Everything works properly when I do this -- the mouse cursor changes to an up/down arrow, I can resize the div only up/down from the bottom edge, etc. The SW handle image goes away, which makes sense. But there is no visual icon or handle added to the bottom of the div. Is this the way it works? I've downloaded jquery yesterday with all components and the "start"
Problem set dynamic dialog option
I have an empty div for the dialog with dynamic multimedia content. Based on video information, i.e. dimension, dialog will load with correct width & height. Title option can be reset correctly, but NOT the width and height. Also, even i enabled the modal option, strangely, I don't see the overlay. This is Firefox environment. Thank you for your help in advance!! Here is the code: $(function(){ $("#mydiv").dialog({ autoOpen: false, resizable:false, modal: true, open:
Dialog contents not displaying
I am creating a dialogue which is launched when search results are populated via Ajax. Initially, my div tag is just: <div id="search_results" title="Search Results"> Your search results <ul id="search_result_list"></ul> </div> The gets filled when the user performs a live search. The dialog is opening, but there are no contents being displayed, even the contents, which I added just to see if anything would display. When I've tried this with static contents everything displays just fine. Any ideas?
jQuery UI dialog: button highlighting
Hello, I created my own modal dialog from the dialog 'modal form' example. I like it very much, but it has a small drawback: As soon as I remove the last input-tag from the example dialog, one of the dialogs buttons (the first in code) is highlighted automatically when the dialog opens (with the text input field, it is not!). I don't want (one of) the buttons to be highlighted initially. I have no clue why it behaves like that; anyway, is there any possibility to control this behaviour? Thanks! regards,
How do I launch a dialog with a button?
This is my first day with jquery, and I can't figure out this simple task! I'd like to launch a dialog when a user clicks a button (or a link, not sure what to use). This is what I'm doing now: With this the dialog doesn't launch from the button and the content displays on the page. If I remove the bottom $ ("newusrprizebtn").onclick({ $("#newusrprize").dialog('open'); }); then the dialog pops up on page load. <script type="text/javascript"> {literal} $("#newusrprize").dialog({ autoOpen:
Dialog - show with effect and options
Hello, I'm trying to create a dialog slide in from the right (versus default left). I searched the group and found this discussion: http://groups.google.com/group/jquery-ui/browse_thread/thread/67850232a88c54c4/2c26a71d384600c9?hl=en&lnk=gst&q=dialog+slide+animation#2c26a71d384600c9 The solution isn't working for me. This works: $('#dialog').dialog( { show: 'slide' }); This doesn't work: $('#dialog').dialog( { show: { effect: 'slide' } } ); I haven't gotten to the point of adding options yet (the
Using the overlay for a dialog box.
Hi, I'm building a site that doesn't support IE6 and below, and I have a dialog box that pops up telling users of IE6 this. That isn't a problem, but how do I make it so an overlay goes over the whole site, drawing attention to the dialog box?
Selective and dynamic scope or accept on draggable or droppable?
I've tried about everything and can't get the results I need. Basically I have some draggables in a movable div (pane). When I'm over the pane I only want the draggable to be droppable on elements in the pane. When I move beyond the pane I only want the draggable to be droppable on elements on a div the size of the window behind the pane. Right now if I drop on a droppable in the pane and there is a droppable behind the pane they both get the drop call. I'm setting up the droppables in the "start"
UI drag and drop not working for dynamic html
Hi All, I am trying to create a div where the components are draggable and droppable. This is based on the simple photo manager example shown here http://jqueryui.com/demos/droppable/#photo-manager Here is a code snippet of the html ------------------------------------------------------------------------------ <div id="bjpdiv"><h3><a id="bjp" href='#'>Bharatiya Janata Party</a></ h3><div id="bjp_stuff"> <ul id="gallery" class="gallery ui-helper-reset ui-helper-clearfix"> <li class="ui-draggable"
Sortable Causes IE 6 and 7 to crash
*sigh* This problem is driving me absolutely crazy. When I try to drag an object in my sortable UI, IE crashes completely. In Firefox, the UI works as intended. This sortable UI uses AJAX to update a MySQL table with the new order when a user moves stuff around. Here's a demo of what I'm trying to do here: http://www.digi-adopt.com/sortdemo.php Here's the script and CSS part: <head> <script type="text/javascript" src="jquery-1.3.2.min.js"></script> <script type="text/javascript" src="jquery-ui-1.7.1.custom.min.js"></
UI - Dialog (Embedding Adobe Captivate content) closing dialog issue etc...
Hi all, I am trying to embed an html page with flash (.swf) content in a dialog. Q1) Why does my screencast continue to play when I close the dialog (X)? IE6 PC and FF on Mac (stops with FF on PC) Q2) For IE 6.x PC I must move the dialog to see the content? (initial content invisible) Q3) Will eventually embed some FLV (flash video) any other problem ahead? My example : http://ww3.cstj.qc.ca/carrefour/jq/index.html Thanks for reading! Dualflex ---
Display today's date with datepicker
Hello everyone, I'm new so maybe this question is dumb but I cant seem to find how to display in the input box today's date when the page loads with datepicker. If there is another way to do it please let me know. So far Ive been working with the demos so this is what I have so far as the function call: <script type="text/javascript"> $(function() { $('#datepicker').datepicker({ numberOfMonths: 2, showButtonPanel: true, dateFormat: 'yy-mm-dd' });
Retrieve tab names? (not index)
How can i check if any of 5 tabs has the name "foo"? (I mean the string between <span> and </span> in ui.tabs) thanks
Resizable
ok so I have a series of divs like this <div id="1"> </div>
UI - Dialog (embedding Adobe Captivate html output) - IE 6.x issue
Hi all, I am presently conceiving short screencasts with Adobe Captivate. The output is an html file with flash (.swf) content. Everything works fine with FireFox. However for MS IE 6.x I have the following questions : Q1) Why is my screencast blank until I move the dialog box? Q2) When I close the dialog box (top right X) the Captivate screencast continues to play. Why so? (stops automatically with FF) my example : http://ww3.cstj.qc.ca/carrefour/jq/index.html Q3) My next step is to embed a html
Jquery Icons
Hi, I have a jquery dialog that looks like following: <div id="jDialog"> <div id="message"/> <asp:CheckBox ID="checkBox" runat="server" Text="Do not display this message again" visible="false"></asp:CheckBox> <br /> <asp:Button ID="b1" runat="server" visible="false"/> <asp:Button ID="b2" runat="server" visible="false"/> <asp:Button ID="b3" runat="server" visible="false"/> <asp:HiddenField ID="dialogData" runat="server"></asp:HiddenField> <asp:HiddenField ID="postback" runat="server"></asp:HiddenField>
Tabs making AJAX posts instead of GET in IE
Hi! I'm using Tabs with remote links (to get ajax loading behavior) in my app. In FF/Chrome etc i'm getting Ajax GET requests to the server which is great but on IE (i'm using version 8), the same AJAX request becomes a post request. Normally this wont be a problem for most people, but i've got a RESTful Rails application and GET and POST make all the difference. Does anyone else see the same behavior? My URLs in the tab are relative URLs, so i know there is no cross-domain stuff happening. My log
Cache Sortable Position
Hello, I'm in the beginning stages of deciding what UI components I want to bring into a project at work and one of them was allowing users to drag different components around and have them stay in that position during their session and to cache them. I think this is more of a server side question with sessions and caches but does anyone have any information on how to achieve this or any references. Thanks
FadeTo the background but not the foreground
Hi, I'd like to use the FadeTo effect to put the opacity of a div to 50% only for the background. In fact, there is an image behind the div that i would like to be displayed in 50%. But if i do this with the div directly i will have the text content opacity changed also in 50% which is not interesting for the text will be less readable. So i was about to add another div which will only contain the background and another one with the foreground (the text). But i wanted to make sure there is not another
resizable with my own icon
Hello, a newbie (on jqueryUI) with a question on the resizable. I can get it to work using the built-in handles, but want to use my own icon (a div with a background image). Quoting the documentation: "If specified as an object, the following keys are supported: { n, e, s, w, ne, se, sw, nw }. The value of any specified should be a jQuery selector matching the child element of the resizable to use as that handle. If the handle is not a child of the resizable, you can pass in the DOMElement or a valid
NEWS: jQuery UI 1.7.1 released
blog post: <a href="http://blog.jqueryui.com/2009/03/jquery-ui-171/">http://blog.jqueryui.com/2009/03/jquery-ui-171/</a> changelog: <a href="http://jqueryui.com/docs/Changelog/1.7.1">http://jqueryui.com/docs/Changelog/1.7.1</a> - Richard Richard D. Worth jQuery UI Release Manager
Getting runtime error in IE 6 and 7
Following is the sequence of inclusion of files:- <script type="text/javascript" src="path/to/js/calendar.js"></script> <script type="text/javascript" src="path/to/js/date.js"></ script><script type="text/javascript" src="path/to/js/ jquery.datePicker.min-2.1.1.js"></script> and following is the content of calendar.js file:- =============================== function displayCalendar( popupRefId, dateRefId, monthRefId, yearRefId, disablaPastDates){ // initialise the "Select date" link var $options
[slider] Can't set the slider range values
Hi, i tried to set new range values as described in the docu, but that doesn't work. here is the code i tried, i just used the range-sample from jquery-ui: $(function() { $("#slider-range").slider({ range: true, min: 0, max: 500, values: [75, 300], slide: function(event, ui) { $("#amount").val('$' + ui.values[0] + ' - $' + ui.values[1]); } }); $("#amount").val('$' + $("#slider-range").slider("values",
Onclick event on Multiple button
I have a PHP page that display multiple records in an HTML table. For every row there is a Delete and Save button. When I click the Delete and Save button on the first row, the record is correctly deleted and saved. However, I click the button from 2nd row and above, it's now working. Some how it's only activating the first row buttons only. I appreciate any help on this. $("#save").click(function(){ var tag_id = $("#tag_id").val(); var tag = $("#tag").val(); var tag_url = $("#tag_url").val(); var
Sortable:: Drag only item
Hi, I have a list of items(say image) with Serial number. I am using Jqury Sortable UI to implement the sorting between the list. Is that possible to drag only the image retaining the serial number to its original position? For example: 1. A 2. B 3. C I want to sort items A,B or C..But not the Serial no. Any suggestions? Thanks in advance.
Creating a new draggable
Pardon my stupidity. I have a draggable element. I have li elements to represent the various items in the draggable. I have a button. When I click the button, I want to add a new draggable item (an li) to the list. I get the item added successfully, but it is not draggable (though the original items are). What is my brain damage? The code (or a rough facsimile): function addItem(data, name) { var entries = data.split(","); for(idx = 0; idx < entries.length; idx++) { var keyValue
nesting tabs
I have a set of about five tabs, and in one of these tabs is another set of next tabs. The child tabs exist in tab 1. I want to call, for example, the 2nd child tab from the 3rd main tab. Is this possible? The end result will be changing parent tabs, then moving to the child tab in one text link. thanks
[slider] how to get unique IDs or classes on range slider handles
I am using a range slider and dont get unique classes on the two sliders, but I see mention of '.ui-slider-range-min' and max in the css. How can I set up the slider so that I get these unique identifiers? I dont see them in any of the demos either. I was able to use simple JQ to insert them, but would like to eliminate that DOM crawl. Thanks!!
Remove easing from Accordion in UI-Themeroller
I am using UI Themeroller and was wondering how I could remove easing from the accordion. Thanks for your help!
jQuery 1.2.6, UI 1.6 and rounded corners problem
Hello, please sorry for my english. I have a problem with jQuery UI 1.6 and jQuery 1.2.6. There are NO rounded corners in all elements, even in example "index.html" (in downloaded archive contains jQuery UI library) from official site. Please, see this screenshot: http://i42.tinypic.com/j6lumx.png This problem does not depend on browser or UI theme! Please, help me, i can't use jQuery 1.3 & UI 1.7 for some reasons!
[slider] slider with single handle and 'move Xpx left' and 'move Xpx right' buttons
I am wondering if anyone has seen an implementation of the ui slider with left and right buttons that will move the slider Xpx (change value), then stop (deactivate) when it reaches the min or max respectively. Anyone seen anything like this? Thanks!! -Adam
Opening external URL in tab panel, hijax with fx
Hello there, is it possible to toggle opacity and height fx in a tab set-up when a link in one of the tabs is clicked and then hijaxed to open the content in the same tab? My tab set up looks like this: $("#tabs").tabs({// fx: {height: 'toggle', opacity: 'toggle'}, // start jQuery UI tabs load: function(event, ui) { // load callback, hijacking every loaded panel $(ui.panel).hijack(); } }); Text links and forms open up fine in the host tab but I'd like the transitions to match the
No active tab
Is it possible to set a page so that no tab is active when you first get to it?
tabs in a div that is scrolled do not display properly (problem with IE only)
Put tabs in a div. Set div overflow to auto and fill with enough contents for vertical scrollbar to appear. The following occurs with IE only (why am I not surprised...) When div contents are scrolled, all contents are scrolled as expected, including tab contents and contents above and below; however the tabs themselves stay in the same position, and the rest of the div contents scrolls under them. When the mouse cursor moves over a tab, all tabs jump to the correct position. However, they will be
tabs and togggle mouseover animation problem
I am having trouble with the tabs widget: Have a look at http://87.139.37.153/client_projects/CC_104_Web/ If I move over the tabs of the blue box very fast, the opacity when toggling between tabs is messed up. It seems the animation isnt finished, so the opacity stays below 100%, Here is the code: $('#rotate > ul').tabs( { event: 'mouseover', fx: { opacity: 'toggle', duration:'slow' } } ).tabs('rotate', 7000); Any idea how to fix this? -- View this message in context: http://www.nabble.com/tabs-and-togggle-mouseover-animation-problem-tp23317747s27240p23317747.html
selectable filter noob help
Hi, I have tried to get the filter working in the selectable , but don't really know what I'm dong. I get an error elem is undefined jquery.js line 1279 which I guess is because my filter is up the ying yang I am using jQuery UI Selectable 1.7.1 and django here's the code <script type="text/javascript"> $(function() { $("#selectable").selectable(); }); $('.select_me').selectable({ filter: 'h3' }); //getter var filter = $('.select_me').selectable('option', 'filter'); //setter $('.select_me').selectable('option',
Modular Downloads
One of the nice things about jQuery is that everything is modular. I like this approach because it's easy to trim down the library to just what you need and nothing else. One of the "new" features on the jQuery UI site is the ability to build a custom download of the library by selecting which plugins you want to include in the library. I have a few gripes with this approach, but maybe it's my naivety on it's true benefit. I have a lot of pages with varying interfaces. One page might use the date
Accordion
Hi all Is there any way to dynamically add a panel to an accordion? I looked at the methods in the docs and there doesn't seem to be that facility Thanx
draggable, feature missing?
Hello, I'm playing with various JQuery UI widgets (UI 1.7.1 with conjunction JQuery 1.3.2). I reached a problem I cannot solve by myself. Maybe Im missing something. Maybe I need a feature which is not implemented, dont know. I hope someone will have a clue how to deal with it. Problem example is placed at: http://flatforma.appspot.com (should work in Gecko and Webkit powered browsers) There are basically 3 panels: -Accordion at the left -Main panel (splitters attached on each side) -Accordion at
Multiple <div id="tabs"> on same page?
I'd like to have more than one set of tabs on my webpage. Unfortunately, only the first tab set works. I think this is because of the id attribute. Is there a way I can change the 'id' attribute to 'class' and get this functionality to work? Or is this feature possible?
Next Page