alsoResize - disabling height resize
Hey, guys, I have a resizable div, which contains a text input element. I want the input element to resize as the user makes the containing div larger, but I only want this to happen width-wise: $("#console").resizable( { minWidth: 600, minHeight: 350, alsoResize: '#output,#command' } ); console is the div and command is the text input element. Is there a way to make the #command element only change its width, but not height?
direct url links within tabs
We're using the ui tabs to create a 3-tiered nested tab navigational system. There are 9 tabs on the first level. Most of the tabs, when clicked, will display the container below. However, a few of the tabs when clicked should invoke a hyperlink to another site. See code sample below. Thanks for the help! <!--1st level tabs--> <ul> <li><a href="#container-1"><span>Link 1</span></a></ li> <li><a href="#container-2"><span>Link 2</span></a></ li> <li><a href="#container-3"><span>Link 3</span></a></
Don't want first item in Accordian jquery to auto-open
Not sure if I'm asking this correctly, so let me explain. I've got the Accordian script working fine, but I don't want my first item to be opened (showing hidden info) when my page loads. I want all my links hidden info to be closed from the get go, and then only open when they're clicked. Does that make sense? I just need to know what part of the jquery script I need to change in order to make this happen. Thanks, TripleAre
Losing CSS when populating accordian via ajax
I have a situation where I'm pulling back HTML for an accordian vai AJAX but the CSS isn't rendering. My jquery hook like this: $("div.accordion").accordion(); // handle ajax content update for financial tab $("#spp_link").click(function () { $("#financial_content").load("/calculate/loadFinancial/id/1/type/ spp"); }); I've experimented with having the HTML placed in the "finaicial_content" div when the page loads and it works fine, but if I make it dynamically display upon clicking a link the CSS
sorry for cross post
that wasnt supposed to happen. sorry<br clear="all"> -- Christopher Thatcher
reinitialize after ajax call?
i think i'm running into an issue, implementing a simple "accordian" widget from the jquery-ui library, because i'm loading content after the page has loaded, with ajax. i've posted 2 example, one of which works (test1), the other doesn't (test2)... the only difference (see the source) is that test2 loads the accordian content with the jquery load function. http://caseyis.com/jquery/test1.html http://caseyis.com/jquery/test2.html you'll notice that the content loads fine, but it's not styled as a
UI Tabs - howto get back button working in IE6
I'm using jquery 1.3.2 and jquery UI 1.7.1 with the tabs plugin. I'm using tabs with no ajax, as well as the cookie plugin and the back button functionality works perfectly in FF and IE7 (haven't tested IE8, safari, etc.) But on IE6 the cookie's doesn't work, so the back button functionality doesn't work either. Can I use the history plugin for this if I don't use tabs ajax funtionality? Ettiene
Star rating widget and jQuery 1.3.2
I have been using the excellent star rating plugin with jQuery 1.2.6, but now I am trying to upgrade jQuery and jQuery UI and this plugin no longer works. I would be grateful if someone could take a look at the plugin and tell me what might be creating the incompatibility: http://orkans-tmp.22web.net/star_rating/index.html http://orkans-tmp.22web.net/star_rating/release/ui.stars.js Thanks!
Star Rating with AJAX Submissions
<div class="gmail_quote">I'm trying to have the results of a star rating form be submitted automatically, but I can't seem to integrate .ajax with the Star Rating callback. Support for this plugin (<a href="http://jquery-star-rating-" target="_blank">http://jquery-star-rating-</a> <a href="http://plugin.googlecode.com" target="_blank">plugin.googlecode.com</a>) redirects to this mailing-list, so... here it is! This is what I have between the script tags (each input field is in the star class, each
Draggable problem in IE: appendTo body loses inherited CSS properties
I had to switch some draggable elements to appendTo: 'body' in order to get around the way IE handles DOM order vs zIndex. (my draggables were disappearing behind other elements no matter what I set the zIndex to). This solution caused another problem: The class I was dragging was set to inherit font-size from the parent element. In firefox / safari this worked as expected and the font size remained the same. In IE on appending to the body, it lost the inherited properties and the font size defaulted
Trouble with multiple drags in IE(6,7,8)
Hello, I've discovered what may be an issue with drag and drop when using IE. I'm working on an application where there are nested containers that can be rearranged using drag and drop. Often these containers are nested. This works perfectly on Firefox 3 and Safari 3. The problem comes when I try to use the application in IE 6, 7, or 8. The behavior I'm seeing is that all of the nested elements are being dragged at once. Not only that, they're being dragged relative to each other, so it causes a
grid-based page editor
Hello, I’m looking for a javascript grid-based page editor, for lack of a better term. Some javascript code that takes a set of vanilla html div blocks and allows you to order them, move them, expand contract and maintains the grid system in a fixed width interface, like 12 column 960. The javascript generates the right grid code and you can save it or do an XMLHTTPRequest post to save it. Any ideas or have you seen something like this? This grid idea is kind of a nicety, really any javascript that
Datepicker as dialog error
I'm getting a strange result when I setting a div as a datepicker. I have it set to be a dialog so that it can be displayed when the user clicks a link. When the calendar displays, there appears to be a input box in the upper left hand corner of the dialog. If you click in it the dialog disappears. It doesn't appear to do anything, it just looks really odd. Here's the div statement: <div id="datepickerReRun" ></div> Here's the javascript: $("#datepickerReRun").datepicker('dialog',"",function() {
Sortable with connectedWith Serialize problems
Hello fellow Jquery users, Im a rookie, and got stuck with my scripting. I simply dont know how to post 2 Array's with Jquery to PHP (1 with the PAGES and 1 with the "OTHER PAGES"). My script (which only produces 1 array from the active <ul>: <script type="text/javascript"> $(document).ready(function(){ $(function() { $("#sortable1, #sortable2").sortable({ opacity: 0.6, connectWith: '.connectedSortable', cursor: 'move', update: function() { var order = $(this).sortable("serialize") + '&action=updateRecordsListings';
How to apply CSS theme to only a specific jQuery-UI element?
I have a web site already build with my own CSS theme. I'm using jQuery UI "tabs" widget but no CSS from jQuery-UI. Now, I'm trying to add the "Date Picker" widget in one of my page. It would be great if I could reuse jQuery-UI default theme which is just fine. The problem is that the date picker theme is also applied to my tabs CSS. For example the "ui-widget" css properties is applied to both date picker and tabs elements. I can't seem to find a way to apply the css properties to only the date
datepicker('dialog') option not working when onSelect is defined
Problem: when a date is selected (via mouse) the page is redirected to '#'. Code is: $(ele).datepicker( "dialog", '', getEvents, {dateFormat: 'yymmdd'}, [200, 200]); 'ele' is an <a> element I have on the page. my 'getEvents' method is coded to return void(0), thus I would have expected the href= action of the datepicker dialog to be suppressed, but it is not. Looks like the onSelect function is never called because the page is redirected to '#'. If I call the
Accordion effect not working within floated div and IE
Hi Everyone, I am pretty sure that I have posted this previously - but couldn't find it in the archive. I have been working on 'just' this issue for the past two weeks full- time and have been unable to come up with an answer. It is really getting to the point of being too annoying for words! The layout works completely fine and dandy in FF and Safari (MAC) But on windows IE it doesn't. If you could provide any pointers at all - I would be most grateful. http://ww2.thespidernet.com/trimascar/index.cfm
jQuery UI Tab Issue
Hello, we are currently using the jquery UI tabs to display some Google Visualizations. The entire tab system is working correctly in IE6, but when viewing the same site in FireFox or IE7, none of the graphs are displayed, there is a clear space for them, but they don't show. If I move the code for the google visualization out of the tabs it shows on the page just fine. Here is some of the code: <div id="tabs-4"> Incident Ticket Counts by Day <div class="processMetric_chart_div" id="processMetric_chart_div"
Accordion and disappearing checkboxes in IE 6
I'm using the UI accordion and it's quite nice. The only issue is that I have form elements inside each pane and they disappear when using the accordion. Here's a link: https://www.onlineadvocate.org/aaron/dev/tests/otherServ.htm In firefox all is well, in Explorer 6 the checkboxes disappear once you start using the accordion. Any ideas? you can click the words and the checkboxes become checked, but they are still hidden.
Accordion
Hi everybody: I'm using the accordion widget, UI/API/1.7.1/Accordion and I have it with two levels. Is it possible haveit with a different CSS? Since the plugin uses the jQuery UI CSS Framework i do not know have 2 accordion plugins with a different theme each one. Thank you
jQuery UI Tabs trouble
After initializing the tab set (all disabled by default). I click on a few buttons to advance the menu system. All works fine so far. Then I want to go back to a previous tab and disable the tabs after it. All the tabs get disabled EXCEPT for the the one I WAS on. I am having trouble disabling All Tabs beyond the one I select. I basically want to do this so users won't be able to "jump around" the menu if they go back to an earlier tab. I've tried various iterations of the "for" loop. I've also tried
disable flash underneath dialog?
When i open a dialog on top of a flash object, the flash object still receives "mouse hover" (independent of modal option). Is there any way I can disable interaction with the underlying flash object while the dialog is showing?
modifying the tab css
Hi there I have been using tabs and they are great. how ever, how do i get rid of the extra padding on top inside a tab. Each tab content has an extra padding of about 15px on top; i tried looking through the css but i could not really figure out where the padding/margin is added. Any suggestions? Thanks Vru
UI Tabs stop functioning properly after AJAX request with error
Hello, I have some UI Tabs set up using AJAX calls to populate the container, set it up as suggested on the jQuery UI site. In my AJAX options I have a handler for error event. I purposely broke the remote page to test the error handling. When I click the tab that calls the remote page my error callback runs as expected but now when I try to select the other tabs they freak out! I either have to click on them twice or they may load each others content inside them at the same time. Very strange! My
Another newbie is at dead end with jQuery UI dialog
Hi, Iam trying to make list of records from db with PHP. Each record have got its own delete icon (image with link to jQuery confirm dialog). I think that I solved the problem how to send id of record to dialog but: How can i run a delete script (PHP) after click on button in dialog ? I want to change the url with adding some GET variable so i can delete record from DB. Or any other solution would be very usefull. Please Help code: <script type="text/javascript"> $(function() { $("#dialog-delete").dialog({
Themeroller download don't work
I've tried so hard to get my theme from Themeroller, but the only thing I got is a currupted .zip archive or the download page showing "No Theme" on theme section. I've tested on my 7 browsers: Google Chrome, Mozilla Firefox, Apple Safari, Opera, Netscape Navigator, Flock and Internet Explorer. No one of these can't get the theme. I've searching on the group and noticied that was fixed. Any ideas? I've got a suggestion to Themeroller. Why did you put the Themeroller to download only the files related
UI Tabs Back button history
Hello there, Was wondering if anyone can help, stressing out here on this project. Im currently using UI Tabs from v 1.5.3 (can use 1.7 as well) I need to make it so the tabs are remembered so when the user hits the back button they go back to the tabs that were previously hit. I found the history plug and thats exactly what i want to do, but cant seem to make it work with ui tabs, anyone has any example i can see? I'd need something like this: http://nix.lv/history/demo.html I read in 1.7: Back
download error
When trying to use the download button I get an error saying that the archive file is corrupt. I can download using the quick download link on top.
Dialog Cancel Out, then Open and Resubmit form
I utilize a form inside a dialog to insert and update data about objects. Below is the code i use to open the dialog. If I open the dialog and submit the form, all data fields entered are read successfully and submitted without a problem. If i open the dialog, then cancel or x out of the dialog, then open it a second time and submit my form, the new inputs i entered aren't being read, instead it reads whatever the value of the inputs were on the first load. Any help is appreciated. $(document).ready(function(){
download error
Just found this site today and I'm trying to download and if I select all or just 1 it tells me that the zip archive is corrupt. I can download using the quick download at the top but it doesn't contain the effect I was looking for. thanks
JQuery Tab now showing Google Visualization
Hello, we are currently creating a tabbed system to display a number of Google Visualizations. Within the tabs there are 3 or 4 different Annotated Timelines, each within a different tab. When we try to display the graph within a tab it spaces out the size of the div but does not display the google graph. When I take the same code out of the tab and view the page the graph displays just fine. The tabs work without any issues, we just can't get the graph to show up. Also this is only an issues in
Different javascript on tabs
I'm trying to set up a page wherein each tab runs different javascript. However, it seems like only the javascript of the base page gets loaded, and none of the tabs work as they should. I'm new to using jquery tabs and ruby, so please forgive any basic mistakes. Here is how everything is set up: application.html.erb (base layout) ---------------------------- <!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">
Problem with JQuery UI Modal Consistency
I've worked on an application that's made extensive use of UI. I'm having some issues. I have tried everything to make the modal window open the same size each time. I use the modal window in numerous places throughout the page. Here's the behavior: The first time the modal window opens it opens exactly the same size it should be. Let's say 600x800 is my default setting. The first time it opens up as 800x600, the second time it's a different size. The third time it opens, it's 600x800, the fourth
want use secound time a dialog box
Hi i use today our Jquery UI but i have a first deficiencies with use this great thinkg :) i want use dialog box secound time but he doesn't work :( i must refresh the page and the he is work... i have a options in some a show profile logout mail etc :) and user click to close and try to open options panel uff? nothing do... why i can use dialog box another time? sorry for my english :)
removing jQuery UI draggable revertDuration
I am using jQuery UI's Draggable plugin to allow the user to drag an image from a box onto a google map to set a marker... the image they were dragging then snaps back to the box it was originally inside of via revert: true. I've set the revertDuration to 0, 1, and other small numbers, but there seems to be a minimum duration for its animation. Is there a way to remove the animation entirely?
Datepicker extension
I need to fire an event (invoke a function) after he datepicker has completed being displayed. I have another div that needs to have its height set to a value equal to the rendered height of the datepicker div. Can someone point me to an example or provide sample code? Thanks.
datepicker - Calendar appearing at one place, not on other modules
I am able to display datePicker calendar in one of my modules but not able to do the same in other places. Details:- Source of the page where it is not working properly:- ========================================================== <link rel="stylesheet" type="text/css" href="/path/to/datePicker.css" /
resize problem
Hi, I have div element which is draggable and resizable, inside another div: $("#area div:first"). draggable({ containment: "#area", grid:[x, 0] }). resizable({ containment: "#area", grid:x }); I can drag it and resize it inside its container div (#area). But once I have resized it, if I add content to the web page, so all of the web contents scroll down, the resized element doesn't scroll down at all, it stays in the same position. This only happens if I've resized it. If I've only drag
Datepicker Icon Style or Class application
Hi, I was just wondering if it's possible to dynamically change the css- classes on both the input box of the datepicker and also if you include an icon the icon class. This would be useful if you have two datepickers on a screen and want to style them differently. Thanks, RodgerWilko!
Getting the ui-dialog-titlebar height...
I'm a bit stumped on this one. I'm trying to calculate the height of my dialog title bar. The titlebar height has not been set explicitly and shows as auto. Without setting an explicit height I'm trying to measure the actual titlebar height including padding and borders. I've tried innerHeight(), outerHeight(), height() and css("height") but no matter which method I use the height always shows as 0. Why can't I get the 'actual' height? Note: For all intents and purposes when the titlebar height is
Next Page