jQuery UI - Making the Navigation a link
Is it possible to make an element within the navigation not the panel a link?
Daterange Icons
I would like to use icons to bring up the calendar for a date range. Using an icon for datepicker is easy enough if there is one box, but what if there are two dates and two seperate icons? Currently my code is as below. The image I want to use is called calendar-icon.png. Please help! $(function() { var dates = $( "#from, #to" ).datepicker({ defaultDate: "+1w", changeMonth: true, numberOfMonths: 1, autosize: true, buttonImage: '../images/calendar-icon.png', onSelect: function( selectedDate )
Problem with JQuery Datepick in IE9
I'm trying to discover why the JQuery datepicker doesnt work correctly here: https://www.tusculum.edu/mytusculum/bvisit.php There's also a problem with the display of the form, but Compatibility view corrects the layout problem. It does not correct the problem with the datepicker. When I click on the calendar, the date is supposed to appear in a div below the calendar. However, in IE9, the calendar never closes, the div is never added and the browser goes back to the top of the page -- almost like
separate images for each tab
Hello All, How can I make each tab unique. Right now all the tabs are using the same css classes, which does not allow us to have separate images for each tab. Does anybody have had this issue before? Any help? thanks ashyui
jquery datepick - dynamic maxDate
I'm using the datePick jquery plugin, adaptation of datePicker. I have a date range starting with tomorrow (minDate:+1). I want to limit the range of dates to 30 days, but want it to be 30 days from the selected start date. Is it actually already built in and I'm missing something, or does the maxDate need to be customized onSelect of the first date?
JQuery UI Tab and Cookies
This works. $(function(){ // Tabs $('#tabs').tabs(); }); but when I do this I get form stacking. How do I fix? $(function(){ // Tabs $('#tabs').tabs( { cookie: { // store cookie for a day, without, it would be a session cookie expires: 1 } } ); });
UI Dialog with *no* styles
I'd really like a UI dialog that doesn't have any CSS styling rules at all -- just jquery code to launch a [modal] dialog window using a div that I create with my own code and styles of my app. Keep the same events and methods so I can hook up my own close button to the close() function, etc. Does anyone else find the need for this important? It's such a huge headache to deal with overriding all the jquery-ui styles for this UI dialog box. I just want to use my own look and feel. Let me hook up
Dialog autoresize when using facebook like button (changing height iframe)?
I've put a facebook like button in a jquery ui dialog (version 1.8.9). The facebook like button essentially creates an iframe for its content on runtime. The content lays out fine, with the dialog having the right height when the page loads. However, when a user clicks the like button, facebook pops up an overlay that's about 300 pixels high asking the user to add a comment to their like. On the page, the dialog does not recognize this popup as new content, and so a scrollbar appears on the right
Need Tab Widget to drive background image changes
I'm working on a site that's using the Tab UI widget, but a request has just come up to get the document's background image to change with each different tab. I have five different tabs, so when I click on each tab I need not only the text inside the box to change (which it does), but also get a different document background image for each different tab, so that: #Tab-1 ----> Tab-text-1 / Background-image-1 #Tab-2 ----> Tab-text-2 / Background-image-2 #Tab-3 ----> Tab-text-3 / Background-image-3
Show jquery dialog once per user
I use modal dialog on page open and I'd like to show it once for each user. Should I use cookie?What code should I add?
How can I control which elements are selected for alsoResize?
I'm building a page which has several resizable elements. Each element has an overlay, which should resize with the element. I'm having trouble figuring out how to do this. The structure is basically ('x' is the id of the div, in most cases this is a number): <div id="x" class="resizable"> <div id="overlay_x" class="overlay">Overlay content</div> Div content </div> To set them up, I tried: var reposition = ''; $(function() { $( ".resizable" ).resizable({ containment: "#viewPage",
JQuery.fx.interval controlled by UI Slider help?
I am building a website using a lot of animations but I have to limit the animations to jQuery.fx.interval = 100; so the CPU isn't maxed out at 100%. Since the animation speeds are slower. My goal is to have have a slider on my page so any user can control jQuery.fx.interval either by sliding it higher or lowering it to 0? I figured out how to stop the animations, but now I have to start it back up. How do I achieve this? Thanks $(function() { jQuery.fx.interval = 100; $( "#slider-range-min"
Propblem in opening jQuery UI dialog in usercontrol
When i tested UI modal dialog in aspx page its working fine, same code i have copied to usercontrols widget and it failed to display the dialog box, i am using kalitte dashboard inside widget i am calling a button click event to open modal dialog but it failed. --- scripts included in default.aspx page where my dashboard exists <link href="../../Styles/jqueryui18/base/jquery.ui.all.css" rel="stylesheet" type="text/css" /> <script src="../../Scripts/jquery-1.5.1.js" type="text/javascript"></script>
A better autocomplete combobox
Hi all, Like a few other people that have posted in the forum, I discovered that the combobox demo for the autocomplete control does not faithfully mimic a native combobox control. I have had a go at improving the code for the demo to try and get it working like the native control. You can see the code and a demo at my blog - http://www.onemoretake.com/2011/04/17/a-better-jquery-ui-combo-box/ . I would love some ideas and feedback on it as I think having a really accurate version using the autocomplete
Problem With jQuery On PagePostBack ViewState
I use jQueryfor test Connection in AjaxRequest in my Project .But with jQuery I lost ViewState Variable on every PostBack.How I can resolve it. tk
Prevent autoselection on datepicker
Hello I use an inline datepicker. The thing I want to do is that when the user click selects a date, the page redirect to another page (Im using onSelect). I have the datepicker hidden (using .hide() in the jQuery(document).ready()) The problem is that the datepicker autoselects a date at the moment I show it and because of that redirects before the user selects a date by his own. So, is there a solution for that? Like an option "autoselect=false" or something? Thanks in advance and my apologies
SOLVED - How to set revert on a draggable based on the droppable
I needed to have a draggable only revert if it was placed on a droppable of a certain class. I found the solution in an undocumented feature: revert can be a callback function. So I used: revert: function(droppable) { // Only revert position if dropped on another tile return ($(droppable).hasClass('tile')); }, I'm not sure why it's not documented, hopefully it's not going to be removed...
jQuery UI Drag X,Y,Z coordinate on different browser or screen dimensions
Hello, Just wondering how to fix the problem of screen resolution changing or different browsers: I use jQuery UI Draggable window (and I store the X,Y,Z coordinates in the database) on one of the pages. However, when I try visiting the page on a different screen resolution, or sometimes a different browser, I find the box's position incorrect. Any thoughts on how this would best fixed the best? Thanks!
jQuery/jQTouch Navigation problem
Hi, this is my first question in this forum: I'm working with jQuery/jQTouch for app navigation. I use the class "arrow" for my menu items like this: <ul class="rounded"> <li class="arrow"><a href="#xyz"><img border="0" src="images/test.gif">dummy</a></li> </ul> It works so far. When the user reaches the last menu item I want to draw something in a div. Therefor I use javascript onclick: <ul class="rounded"> <li class="arrow"><a href="#xyz" onclick="test('123')"><img border="0" src="images/test.gif">dummy</a></li>
JQuery UI Button Widget Missing when Removing A Cloned One
When clicking the testBtn,callback function will copy the testDiv and then append the new testDiv to the old one. The original testDiv ui-button widget disappear after removing the new testDiv. <html> <head> <title></title> <script src="./script/jquery-1.5.2.min.js" type="text/javascript"></script> <script src="./script/jquery-ui-1.8.11.min.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function(){ $("button.testBtn").button().bind("click",function(event){
running 2 effects one after another causes the element position to change before the second effect
When I run 2 effects one immediatley after the other, before the second effect happens the position of the element is changed from: position: absolute; top: 245px; left: 460px; to position: relative; top: 0; left: 0; This is the jQuery code I am using: function runEffects() { jQuery(".GasTestClass").effect("shake", 250); jQuery(".ExpiredClass").effect("bounce", 1000); }The img element I am running the effects on: <img class="GasTestClass ExpiredClass" src="Images/Icons/Group.png" style="position:
alignValue.toFixed is not a function
Hi, I am using jQuery UI 1.8.11 in relation with jQuery 1.5.11. I have a div-control which is transformed into a slider using the corresponding slider() function. When sliding this control, the Firefox Javascript Console announces an error on line 427 in my (minimized) jQuery UI source file: alignValue.toFixed is not a function. Sometimes, the slider does not work after this error, sometimes the slider works although. This is not deterministic. From my point of view, it seems that this is a bug in
Problem facing to switch in the same tab
I have implemented "tabs" of jquery in my application. In my second tab there is a "form with submit" button. Form contains some field which is required so when I click on submit without filling the required data in form my page refreshes after clicking submit and I again see the first tab selected . I want when I click submit then the same tab should be selected in which my form resides. Tried hard but no luck.. Any help would be higly appreciated... Thanks - Pranav
jQueryUI dialog close button invisible
Hi guys Like the subject line says, I have a dialog where the "x" icon is not visible. If I mouseover the toolbar, I can make the button appear, but the "x" does not appear even then. NOTE - it's not "my code" - the same is happening with the demos here - no "x" icon. Firefox 4 on Vista Ultimate SP2. R
jQuery modal dialog is hidden by overlay div if dialog's parent has fixed position
One of my jQuery dialogs is defined within a div that has a fixed position (footer of page). When a modal jQuery dialog is opened jQuery creates an overlay div that hides the whole page and then puts the dialog to be opened on top having a higher z-index than the overlay div. Unfortunately any dialog that is rendered within a div with fixed position is overlayed by the overlay div although the modal dialog to be opened got a greater z-index then the overlay itself. The following HTML code that I
how to set other div on top of jquery ui dialog ?
The zIndex doesnt work, I have this Div with zIndex 10000, and set the jquery ui dialog zIndex with 1000, still, the dialog box is on top of everything, must missing some thing, please help, tks in advance
Question on Jquery UI - 1.8.11 ui-dialog box
I upgraged my dev environment from JQuery UI 1.7.2 to 1.8.11.. The UI-Dialog box that is invoked as modal just vanishes after a few seconds automatically and previously it was not. Also the dialogbox styles are screwed up. It was only after Jquery upgrade. The dialog box disappears even before any button is clicked, i.e it automatically takes the option as "ok" and performs the corresponding action. But when I hit 'cancel' in the dialog before it automatically closes, then it performs the cancel
Invoke function after slide complete when using jQuery UI hide(slide)
When using the jQuery UI hide(slide), how do I invoke a function after the slide is complete? The arguments permitted are direction, distance and mode but what about a function? $("div").click(function () { $(this).hide("slide", { direction: "down" }, 1000); });
Datepicker Doesn't Refresh Data
Alerts and Firebug shows that everything is working perfectly but datepicker calendar doesn't refresh. What I am trying to do is: Bring employees available dates whenever employe combobox selection changed. I believe it is synchronization problem but couldn't find a solution ? Any help is highly appreciated. Below is the code: $(document).ready(function(){ $("#employecombo").change( function() { $.ajax({ type: "POST", data: "id=" + $(this).val(),
dialog in tab not refreshing
OK. I have an admin interface that uses tabs. I have some modal forms in the tabs. This is all good while everything is static. I then made the tabs content load using ajax. This is also fine and works well. Everything is going swimmingly. Here's the problem. The modal forms get content from the database. So, on tab 0 my form uses information that can be edited on tab 1. When I go to tab1 and edit the info, then return to tab 0 I can see that the dialog is the original dialog. Firebug shows
a probelm in positioning accordion control
i have a header div that is fixed positioned and also i have accordion control that i am using as a side panel, the probelm is that the accordion appears at the top of the header when scrolling down. so how to make the accordion down the header. thanks
AutoComplete ComboBox Behavior
http://jqueryui.com/demos/autocomplete/#combobox It looks great, but it still can't compare to the native combobox because pressing alt + down, the selected option is hard to observe in the items. clicking the button, the selected option doesn't highlighted in the items. If the input element is shorter than the textual description, the text inside the input element will be moved (i.e. "....XYZ" instead of "ABC......") How to do these to made it better?
resizable div in resizable div
Hi, A have div in div: <div id="A" > <div id="B" ></div> </div> A and B are resizable. $( "#A" ).resizable(); $( "#B" ).resizable(); All work fine, but if A set as disable, $( "#A" ).resizable("disable"); B div is disabled too. Exist any solution, how disabled only div A?
datepicker beforeShowDate
I have an in-line datepicker. I want to apply styles to dates of events on a page which are retrieved via a json feed. I'm using beforeShowDay. The function loops through the json feed and returns [true, 'classname'] for each item where the date matches. An "alert()" prior to the returned array shows that I'm getting the correct results but I can't see the class set anywhere in the source code. jQuery('#calendar').datepicker({ beforeShowDay: function(date) { for (i = 0; i < events.length;
How to make dialog not have X to close on top right corner?
I want the X to disappear (and I'll turn off the ESC key), so that the Cancel and Apply buttons are the only way to leave the dialog. How should I make it go away?
Datepicker: fire event on keyboard date change? (NOT onSelect)
Suppose Jane Smith is using the keyboard to edit a form. She tabs into a datepicker input, and the datepicker calendar pops up. She presses CTRL + RIGHT three times to move the selected date three days forward, then presses ENTER to finalize her choice of date. How can I get the currently active date each time she presses CTRL + RIGHT? The onSelect event in the datepicker docs only fires when ENTER is pressed. I want to add ARIA alerts to the datepicker so that blind users can use the datepicker
Putting a fixed header in a jquery autoresponse dropdown
In our Ruby on Rails app, we invoke JQuery autocomplete to perform a search whose results are displayed in a dropdown. We'd like to have the first item of the dropdown function as a fixed header, and items 2-N be part of a scrollable list/div, etc. Is this possible? Any hints or examples on how to do this?
ThemeRoller Not Working
For the past 2 weeks Theme Roller has been acting odd. For a while I could get it to load old themes or from the gallery only in Chrome, now it won't work in Chrome or Firefox. The base page works, but not changing any values and updating. We are trying to generate some updated images and CSS. Any chance of getting the source for Theme rolloer itself so we could just run it on our own server? Thanks. -Chuck
How to assign arbitrary data to a dialog?
I am making a simple dialog with a multi-select input in it. The dialog will have a Cancel and Apply button (apply will cause a grid to be filtered based on the values in the multi-select). When the user pops up the dialog, they may change the values in the multi-select and Cancel. This will preserve the values and they won't accurately reflect what the grid is currently filtered by. I want to restore the values that were selected in the SELECT if they hit Cancel. I'm thinking the way to do that
override of drop down menu and accordion (display problem)
Hi all I set a drop down menu using jquery naviDropDown 1.0 and use accordion of jquery-ui-1.8.11 too. I have a problem because the drop down menu is diplayed behing the accordion block. Does anyone know what the problem could be ? I attach a screenshot of what happens and head and mennu and accordion code. Head statements : script type="text/javascript" src="js/jquery-1.5.1.min.js"><link type="text/css" href="jquery/css/custom-theme/jquery-ui-1.8.11.custom.css" rel="stylesheet" /></script> <script
Next Page