Use of the js files
what is the use of jquery-ui-1.7.2.custom.min.js file, in jquery library i have few XXXX.js files but i don't know use of them, where to find the info of these files the files are as follows spinner.gif dock-tabs.gif jquery-ui-1.7.2.custom.css ui.jqgrid.css jquery.js jquery-ui-1.7.2.custom.min.js jquery.layout.js jquery.jqGrid.js jquery.autocomplete.css jquery.autocomplete.js grid.locale-en.js grid.base.js grid.common.js grid.formedit.js grid.inlinedit.js grid.celledit.js grid.subgrid.js grid.treegrid.js
tabs .click()
I'm trying to execute a method when any tab inside of #tabs is clicked, could someone tell me what I am doing wrong? $('#tabs li').click(function() { alert('clicked'); }); Given the following html <div id="tabs"> <ul> <li><a href="#tabs-1">Tab 1</a></li> <li><a href="#tabs-2">Tab 2</a></li> </ul> <div id="tabs-1"><p>Tab1 Stuff</p></div> <div id="tabs-2"><p>Tab2 Stuff</p></div> </div> Thanks
Height of JQuery UI Tab Content Panel
How can one get the height of the content area in a JQuery UI tabbed panel? $('.ui-tabs-panel').height() clearly returns the height of the content area + the height of the tabs. I am assuming there must be an easy way to get this dimension? So far my searching online is not turning that answer up. Any suggestions would be most appreciated! Chris
Themeroller not working
Hey there i really need a fresh download of my ui Theme. But the Themeroller ist not working, i allways get the same file. Here is my theme config url: http://jqueryui.com/themeroller/#ffDefault=&fwDefault=normal&fsDefault=1em&cornerRadius=4px&bgColorHeader=e6e6e6&bgTextureHeader=03_highlight_soft.png&bgImgOpacityHeader=75&borderColorHeader=b3b3b3&fcHeader=191919&iconColorHeader=191919&bgColorContent=ffffff&bgTextureContent=01_flat.png&bgImgOpacityContent=75&borderColorContent=b3b3b3&fcContent=191919&iconColorContent=191919&bgColorDefault=f2f2f2&bgTextureDefault=04_highlight_hard.png&bgImgOpacityDefault=50&borderColorDefault=b3b3b3&fcDefault=808080&iconColorDefault=808080&bgColorHover=e6e6e6&bgTextureHover=04_highlight_hard.png&bgImgOpacityHover=50&borderColorHover=808080&fcHover=191919&iconColorHover=191919&bgColorActive=b3b3b3&bgTextureActive=04_highlight_hard.png&bgImgOpacityActive=50&borderColorActive=808080&fcActive=191919&iconColorActive=191919&bgColorHighlight=fbf9ee&bgTextureHighlight=02_glass.png&bgImgOpacityHighlight=55&borderColorHighlight=fcefa1&fcHighlight=363636&iconColorHighlight=2e83ff&bgColorError=fef1ec&bgTextureError=05_inset_soft.png&bgImgOpacityError=95&borderColorError=cd0a0a&fcError=cd0a0a&iconColorError=cd0a0a&bgColorOverlay=000000&bgTextureOverlay=01_flat.png&bgImgOpacityOverlay=0&opacityOverlay=60&bgColorShadow=000000&bgTextureShadow=01_flat.png&bgImgOpacityShadow=0&opacityShadow=30&thicknessShadow=8px&offsetTopShadow=-8px&offsetLeftShadow=-8px&cornerRadiusShadow=8px
dialog speed issue 1.7.2 -> 1.8.0
I recently tried to omptimize the javascript on one of my web pages. When I benchmarked all my dialogs they took 300ms. So i descided to change my jqueryUI version from 1.7.2 to 1.8.0 in order to see if it would lover the delay. However the time it took to load the dialogs became 700ms instead. Do anyone know of any reason which would make the load time more than twice as big? I tried searching for people with similar problems but couldn't find any.
UI resizable set option
Hi all, After I initializes an image with the resizable({...}) I want to click on a form checkbox to enable ratio. So in the onclick of the check I do .resizeable("option", "aspectRatio", true); but the option isn't updating the resizable. The workaround for me was to re-init the resizable, but thats not the best practice I think... Could some tell me more out using the option setter? Another plugin of jQuery to crop images uses a same way of updating the settings, but that one need an .update()
.slider
Hi I got a lil problem using the slider function. I'd like to use an individual slider and handle; I saw that it was possible to add them using handle: '..........' in earlier times. I allready was able to add them, but sadly the handle can be dragged too far to the right and isn't positioned very well. All in all the whole thing doesn't work smoothly yet. Could you please check my code and tell me what I did wrong. http://toptech-dentallabor.de/test/test21.php Thanks in advance
Jquery picture viewer example needed
H, i'm interesting in apple store product picture viewer (It zoom the picture with enlarge DIV). I am not sure what script it using but can jquery do the same thing? http://store.apple.com/us/product/MC360ZM/A?fnode=MTc0MjU4NjE&mco=MTc0MjU1OTY#overview
jquery UI button appears too big
Hi, can anyone tell me why is this happening with jquery UI elements? they all appear bigger compared to the normal text. as a example I uploaded a picture with button.
Accordion next/prev buttons
I am using accordion with a form(sections) on a site that I am working on and was wondering how I can add next / prev buttons in each section of the form. I know that accordion uses headers and that works fine but I have been asked to add next / prev buttons at the bottom of each section because it is apparently not obvious what to do. Here is my accordion call <script type="text/javascript"> $(function() { $("#accordion").accordion({ autoHeight: false, collapsible:true, }); }); </script> I read
jQuery-UI tabs - load every tab just once
I'd like the load content of my tabs thru AJAX, but only on the first tab click. Now the tabs gets loaded every time I click on any tab. <div id="tabContainer"> <ul> <li><a href="/Home/Tab1">Tab1</a></li> <li><a href="/Home/Tab2">Tab2</a></li> <li><a href="/Home/Tab3">Tab3</a></li> </ul> </div> I cannot use the Cache option,because the content in the tabs may change.. I was thinking something like change the href atribute after the tab gets first loaded.
Star Rating plugin fails with jQuery UI rc1
Hi, I'm using this plugin: http://orkans-tmp.22web.net/star_rating/ And it stopped working when I updated to jquery ui 1.8. Here's the plugin code: http://pastebin.ca/1787134 Anyone knows what may have caused this? I've tried to look for some documentation to see what have change, but without luck. If anyone could get a look I would appreciate... Thanks!
Missing Icon
Hi all I can add jquery .button() to my button, but couldn't apply an icon to it. I also notes my jquery dialog box is displaying its icon (close icon) correctly. This is my button script: <script type="text/javascript"> $(document).ready(function () { $('#dialogCompanyName').dialog({ autoOpen: true }); $(".button,input[type=button]").button({ icons: {primary: 'ui-icon-zoomin'}, text: false}); $('#btnAssignCompanyId').click( ); }); </script>
Problem with Sortable
I have a problem with Sortable. I'v copied from demo to my site the strings below, but the item, what I move, doesn't move. But all items under move down or empty place under last item increases height. In IE8 nothing moves at all... Thanks <link type="text/css" href="/js/jquery-ui/development-bundle/themes/base/jquery.ui.all.css" rel="stylesheet" /> <script type="text/javascript" src="/js/jquery.js"></script> <script type="text/javascript" src="/js/jquery-ui/development-bundle/ui/jquery.ui.core.js"></script>
jquery ui progress bar problem in Firefox
Hi folks, I'm having the strangest problem. I'm using the jquery ui progressbar and it is working perfectly in IE, yet, style is all messed up in Firefox. In Firefox, it's like the left and right borders are both butting against each other in the middle of the screen, and the two bottom borders that comprise the 'progress' of the progress bar are also butting against each other. Therefore, I have no fill color which results in a two pixel progress bar. I tried setting height to 24px, no luck. Here
UI 1.8 Tabs - Tab header showing span and href information
Hello all, I have a strange situation. I am using jQuery UI 8.1 and 1.4.2. When I use the Tabs option the tab itself has the information from the 'span' tag as well as the href information from the 'a' tag. Example: <a href="#welcome-wgo"><span>Welcome/What's Going On</span></a> Shows this: Welcome/What's Going On (#welcome-wgo) I haven't found any information as to why it is showing up like that and I need it to not do that. Any suggestions would be greatly appreciated. Thank you, Tim Savage
Certain Accordian enabled due to form validation.
Im new to using jquery ui elements, and I was wondering if its possible to have, say a radio button and when it's clicked the 2nd accordian becomes active. ie: "Is there more than one page [x] yes [o] no" Since the yes is selected the 2nd accordian becomes active on the page. I don't know if this has been asked before? I searched around, I don't know what it might be called. Thanks for the help.
Start with a tab based on url
How can I make the UI tabs start with a tab definded by php so if a go to a page with a uri of http://example.com/page.php?tab-17 i want the tab-17 to be displayed i managed to get the uri but i don't really know what to do next the $url[1] is the tab-17 <?php $page = $_SERVER['REQUEST_URI']; $url = explode("?", $page); ?> <script type="text/javascript"> $(document).ready(function() { $("#tabs").tabs(); <?php if ($url[1] == "") { echo "$('div.ui-tabs:first-child').removeClass('ui-tabs-hide');";
Download jQuery UI
OK there seems to be a problem every time I use the custom download it's missing the css folder with all the files. So the widgets end up not working right. I downloaded the basic UI from another place on the site and it had the css folder. Is there something wrong or am I just not doing something right? I would like a custom UI theme.
rollover bubble with ajax
I am trying to find an example of code which allows the user to hover or roll over a link, resulting in an Ajax call being made to retrieve data related to the link, and showing it in a popup bubble. Similar to how Netflix allows the user to hover over a movie and get information about it. Any examples out there that do this? Thanks in advance!
[UI-Tabs] How-To: Persist selected tab on page refresh / postback.
<script type="text/javascript"> $(function() { $('#tabs').tabs({ selected: (location.hash != "") ? location.hash.replace("#", "") : 0, show: function(event, ui) { location.hash = $(this).tabs("option", "selected"); } }); }); </script>
Dialog creating space at the bottom of the page
Well I posted this once but it disappeared. Is there a known reason why when Dialog is used (modal form) it creates a space at the bottom of the page, the same height at the Dialog? In IE the page also scrolls to the bottom. If this is a new one I'll whack the code up, Thanks, Tom
UI slider, little issue
Hi I have a question: how to remove a border from ui slider button when it's active? In other cases I use trick <a href="#" onfocus="this.blur()">Okay, it works, but not in jquery.slider.ui if ($(".ui-slider-handle", this.element).length == 0) $('<a href="#" onfocus="this.blur()"></a>') .appendTo(this.element) .addClass("ui-slider-handle"); if (o.values && o.values.length) { while ($(".ui-slider-handle", this.element).length
Why are my elements so large?
Just starting with jQuery UI tonight and have a page set up here with some very basic items set up (accordion): http://psg-admin.platinumsynergy.com/ I had a date picker as well but I'm having the same problem with all of my elements - why are they so massive? I was kind of hoping they'd be the size of the elements on the ThemeRoller: http://jqueryui.com/themeroller/#themeGallery
Autocomplete Positioning
Hi all, Since I upgraded from ui 1.8 rc3 to 1.8 I have noticed a little inconsistency in the way the autocomplete is placed on the page. It sometimes causes the <ul> which contains the list of suggested items to be one pixel too high and to the left. The weird thing is that it only occurs every second time the autocomplete is shown. The first time I show the autocomplete it is correctly positioned, the second time it is one pixel to the left, the third time it is correctly positioned again, etc...
Autocomplete and change event
I'm having an issue where the change event only seems to fire when the length of my input is greater than 0 and less than minLength. Here's my code: <script type="text/javascript" src="http://jqueryui.com/latest/jquery-1.4.2.js"></script> <script type="text/javascript" src="http://jquery-ui.googlecode.com/svn/tags/1.8rc1/jquery-1.4.1.js"></script> <script type="text/javascript" src="http://jquery-ui.googlecode.com/svn/tags/1.8rc1/ui/jquery-ui.js"></script> <script language="JavaScript"
help detecting options if they have been entered...
I was wondering if this does not exist already then it would be very handy. $('#selector').myUI();//does not have options. $('#selector').myUI({option:'foo',{op:'bar'}});//ui has options. $('#selector').myUI('value');//ui has options. while on myUI we have: this.options this.element etc.. It would be useful if we had this.hasOptions which would bool (true,false) so if the ui is called with options then do something else do something else. for instance: we could use it in the following way. <div class="list">
Autocomplete with tags?
Hello, I have an input text where user can enter one or tag (tags are separated by space). I would like to use Auto complete widget but it works only for the first tag. Is there a way to tweak the widget to make it working?
Dynamically add tabs using jQuery-ui tabs
I have a menu system that calls a function that contains $('#tabs > ul').tabs("add",page,page_name); where page holds the path/name of the php page and page_name is a unique name for the page. I suspect I then need to load and show the page but am currently confused as to how to do it. A short example of adding, loading, showing and selecting the page would be appreciated. ie. add a tab with the new page content in it and have it as the active tab on the screen. The other thing is to have a close
jQuery UI download
I've been trying to download the jQuery UI package since last night, but when it downloads I'm not getting the css folder. The zip file contains development-bundle folder, js folder and index.html. I have tried all kinds of ways, but no luck. Even coming in and leaving everything at default settings and clicking download still doesn't give me the CSS folder. Just an update. I tried doing the same exact thing with IE 6 and the zip contained the CSS folder. Downloading with Chrome 4.1.249 100% does
jQuery Dialog breaking in IE 8 Compatibility Mode
I'm using a modal dialog on my page and I get this error in IE 8 Compatibility Mode: Error KB927917 in IE8: Unable to modify the parent container element before the child element is closed. The container for this dialog is defined like so: <div id="dialog" title="Enter amount"> <p id="validateTips"></p> <form> <input type="text"name="amount" id="amount"/> </form> </div> Then in $(document).ready() I call: $('#dialog').dialog('open'); The $("#dialog").dialog({...}) has some basic functionality in
Modal dialog and google maps (loosing mouse events)
UI Modal dialog 1.8.0 on jquery 1.4.2 with à Google map v2 on it, does not stop dragging the google map when the mousebutton is released. This does NOT work in Chrome and FireFox but works ok in IE 8.0 As soon as I make the dialog non-modal the map works as expected. So it looks like a ui-modal-dialog does not return the mouse-up event. How could I fast solve this? I was so dumb to not check enough when coming from 1.7.... Regards, Henk
UI Tabs and Validation plugin
Does anyone know if there's working example of the tabs with the validation plugin? I've been reading the documentation for both but can't wrap my head around how to use them together.
New to jQuery UI
Hi I was wondering how do I add the jQuery UI to my site. I have downloaded everything I need. All i need to do no is edit it a tad more and add it to my site. How would I go about doing this?
using the cookie plugin
I'm looking for a tutorial that would help me to utilize the cookie plugin to persist which tab was selected on the users last visit to the site or page from within the site. There will be more than one sets of tabbed information.
UI.Tabs() usage
Newbie Question: Can I use jQuery Tabs() with definition list (DL/DT/DD), like I do when building an accordian?? Or is the tabs strickly run by a UL/LI list within a div??? respectfully, Anthony It is not the job you get handed, but what you have done with it in the end that people remember.
YouTube page feature tour in jQuery?
If you head over to youtube.com today you'll see a new page design on the video page. They have a panel in the top right where you can initiate a tour of the page. Looks pretty slick to me. Has anyone seen something similar in jQuery? Thanks.
jquery tabs
hi folks.. i have a requirement such that if i click the first tab of the 6 tabs then all the tabs should be made invisible or hidden and show userconrol which is outside the tabs ..?is it can be down using jquery?
blockout page using uilock
A client wants a blockout page where the user can see through a transparency but cant access the page. There will be a message on top of the transparency with a message telling the user to "create an account" I have it close to complete but my white text area is showing transparency and i don't want it to. Please view to see what i am talking about here http://www.artinvesta.com/uiLock/demo.html i am sure its only a slight modification but being a front end dev i have no clue any help would be appreciated.
Smoother scrolling in slider
Hi all! I have got a question regarding the slider in jquery ui. You can see the usage here: http://smk.johanneshiemer.de/# Can anyone tell me how to get the scrolling smoother? Thanks a lot!
Next Page