sortable list of images with absolute position
Hi all, I want to sort a list of images which are positioned absolutely fix. the follwoeing code shows what I meant :-P <div id="sortable"> <div id="purple" style="position: relative;top:0px;left:0px;cursor: pointer;"> <img id="ppBk" src="images/CM016_purplebook.png" style="position: relative;top:95px;left:405px;"/> </div> <div id="teal" style="position: relative;top:0px;left:0px;cursor: pointer;"> <img id="tlBk" src="images/CM016_tealbook.png" style="position: relative;top:90px;left:325px;"/>
clicks on stacked ui-dialog canvas pass below
Quick question on a minor irritation: I am writing a little web app which splits its functionality over many free floating windows, all stackable ui-dialogs. Most of these windows have scroll bars. I notice that when two ui-dialogs overlap, then my mouse actions on the canvas of the top dialog impact on the scrollbars of the dialog beneath (depending on mouse placement, of course). I can put a stop to this by attaching .bind("mousedown",function() {return false;}); to each canvas, but feel a
ui-corner-all
I have hit upon this a few times and usually worked around with padding: the widget content is liable to "poke out" beyond the rounded edges drawn up with "ui-corner-all". This time around, padding is not an option: I would like to display an image with rounded corners (and not necessarily a border at all). Does anyone here know a way to make the corners positively cut off the overspill? Thanks.
JQuery Model Dialog is showing scroll bar even though the dialog size is small.
I opened your example in IE 8. The example i opened is from the below URL http://jqueryui.com/demos/dialog/modal.html It was showing me scroll bars, please check the attachment associated. The same kind of problem i am facing in my example. This is happened after using JQuery 1.8.2 version. Please Let me know, if you have any solution for this issue.
Total newbie question... sortable.ui
I need a tutorial on actually using jQuery (and jQuery ui) for something more useful than a pretty demo that does nothing other than display stuff.... (I'm getting frustrated....) Anyway, I'm trying to use ui.sortable and somehow pass the new order to an object that can postback to the server (either through an ajax call or using the DOM to pass the data back). However, I can't seem to be able to get my brain around how to do that. What I have so far: <script type="text/javascript"> $(function()
Autocomplete positioned upward?
When using the autocomplete, the list of options appeared to positioning above the input box continuing to be placed outside of the field of view. However, this only happens when several options come up. When there are fewer than 5, then it is positioned below. Is this an intended behavior?
Resizing dialog "smooth"
Hi, I'm looking for the possibility of resizing the height of an dialog with a smooth animation (like .toggle() does it). I'm using some ajax-tabs inside of an dialog, whith each tab having different height values. I need to set the height of the dialog manually. At the moment i'm resizing the dialog with $(dialog).dialog( "option", "height", ...);which looks weird. Is there a solution for this? Thanks, Screeze
custom callback to disable specific dates in datepicker
Hi, thanks in advance and sorry if this is redundant to other posts. This calendar is dynamically set when an individual logs in. I pass their jsMinDate, jsMaxDate, and an array of blackout dates called jsForbiddenDatesArray. I am trying to disable those forbidden dates whenever the calendar refreshes. Here's what I think I want to do, but somehow it does not work. Will anyone please advise? I do not understand how to implement renderCallback. $('#datepicker').datepicker({ beforeShowDay:
What is $(selector).autocomplete("disable") supposed to do?
I just tried using it in my code and the only difference I can see is that the result box becomes slightly transparent with the theme I'm using. It still does the search and clicking on the result still has the same effect. I was expecting autocomplete("disable") to essentially turn off the autocomplete functionality until I called autocomplete("enable") again. Is that how it's supposed to work? Kindly, Marcus
DatePicker and IE
Hello, Sorry for my bad english ! I am a newbie in jQuery. I have a big problem with IE and DatePicker. This code : $("#datepicker").datepicker({ dateFormat: 'yymmdd', minDate: '0', maxDate: '+1Y', onSelect: function(dateText, inst) { document.getElementById('post_date_agenda').value = dateText; } }); Work great with Firefox and Chrome, but with IE, when i select a date, the DatePicker dissapear. The date selected is good, because when i click on 'Find (submit)' button, the result is send and good.
How do you stop color animations?
Ok I'm cycling an animation on a link so it appears to glow on and off, however when I mouse over it I would like the glow to stop and show the hover decoration. Currently I have the following code which seems to ignore the stop() and as far as I can tell, the style attr is removing, but as the animation is not stopping, it's simply adding it again almost instantly. jQuery('#animateSpan').addClass('animateThis'); runAnimation(); function runAnimation(){ jQuery('.animateThis').animate({
JQuery Dialog issue with IE 7, 8
I'm currently using JQuery 1.3.2 , JQueryUI 1.7.2 and IE 7 I am having a problem with adding lots (list of 2000 items) of options into a <select> tag inside a jquery dialog in production environment. I can't post any screenshot regarding this issue due to copyright materials. I have a button "New Contact" that is a JqueryUI dialog pop-up (modal and bgiframe is enabled ). As the user click on "New Contact", a list of companies are created. There are some processing required, in FF, the time it
datepicker
I've two problems first, these are the js and css that are available to my page: smoothness/jquery-ui-1.8rc3.custom.css js/jquery-1.4.2.min.js js/jquery-ui-1.8rc3.custom.min.js datepicker is defined thusly: $("#datepicker").datepicker({ minDate: new Date(), onClose: function(dateText, inst) {}, closeText: "Close", showButtonPanel: true }); 1. how do I get the help button to show? 2. I would like the datepicker to popup and float just
datepicker - populating inputs for month/day/year
What I'm looking to do is something similar to this, except with inputs instead of selects: http://www.kelvinluck.com/assets/jquery/datePicker/v2/demo/datePickerIntoSelects.html I'm hoping this is relatively easy but I didn't see a similar example in the datepicker demo's....help?? Based on the above example, I've gotten the below to work.... Any suggestions on how to do this w/ jqueryui datepicker? $('#date-pick') .datePicker( { createButton:false,
open datepicker from my image
Hi, I've this html code: <input type="Text" name="datepickerOne" id="datepickerOne" readonly="readonly"> <img src="gfx/calendar.png" id="datepickerImage" /> I don't want to use the jquery icon trigger: $("#datepickerOne").datepicker({ showOn: 'button', buttonImage: 'gfx/calendar.png', buttonImageOnly: true, dateFormat: 'dd/mm/yy', firstDay: 1 }); I'd like to click on my image and open the calendar. Thank, ale
Datepicker beforeShowDay not working
Hello to all, I am having problems with beforeShowDay event in Datepicker. In IE the error is: '0' is null or not an object IN FF the error is: F is undefined Below is a very simple example that reproduces the problem. Let me know if you need me to post it somewhere on the web, but its just a simple and straight-forward HTML file. Thanks is advance for any help provided. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta
Datepicker, show changeYear before changeMonth.
Hello, I'm using datepicker, all works great but I need to show the changeYear Menu before the changeMonth. Any help would be most welcome Thank you !
Autocomplete - automatically highlight first item?
Hi! Is there an undocumented option for the jQuery UI Autocomplete widget that would automatically highlight the first item in the list, with the assumption being that if it's the item you want, you can press the tab key to both select it and jump to the next field? The old jQuery Autocomplete plugin had the 'selectFirst' option which was turned on by default, so I'm curious if there's an easy way to do something similar with the UI version. Thanks!
How do I capture a Modal close button event
Total NB here. I have a function that opens a modal window, when one of many lightbox buttons is clicked. Ajax will pull the info for each individual lightbox. However, since I have several other buttons on the same page, it opens the "myLightbox-dialog" window. Is there a way I can capture a different button click just before calling the dialgo('open')? thank you in advance. MIke $("#lightbox-manage-dialog").dialog({ bgiframe: true, autoOpen: false,
UI Dialog Problem, instance issues
I have a html table, when the user click one of the cells it opens a dialog, and perform some actions using a form inside this dialog, but when I click again on another cell it seems that it creates a new dialog and a new form so now i have two dialogs with the same id and 2 forms and such.., so my questojs is: if im calling the same dialog $(myDiv").dialog('open') on every cell click, why it creates a new one and the form doesn't work anymore?. Here's the code: //-------------------------------------------------------------------
accordion
Just started using JQuery UI and ran into a cross browser issue it appears. I'm using the accordion which works great in IE..I decided to open it in Firefox and it seems like all the panels are open. Firefox doesn't seem to be finding my .js files perhaps. Here is how I have it setup <link href="~/Styles/2col-fixedwidth-shadow.css" rel="stylesheet" type="text/css" /> <link type="text/css" href="~/Styles/custom-theme/jquery-ui-1.8.2.custom.css" rel="stylesheet" /> <script type="text/jscript"
Effects on mouseenter hover looping in Firefox
I've uploaded a test page to show the problem I'm having: http://www.merzikain.com/jquery-test/test.html What I have is a navigation using an unordered list with nested lists for navigation items that have sub pages. <ul id="nav"> <li id="page1"> page 1 <ul id="page1sub"> <li>sub page</li> </ul> </li> </ul> I was using $("#page1").hover to set $("#page1sub").show and .hide then changed it to use .mouseenter and .mouseleave but both have the same issue. When navigating the menu
jQuery Tabs not working in IE7 when Ajax option async: false
Works on all the others: FF, Safari, Chrome and IE8 but not in IE7 (didn't test IE6 and don't care either), When trying to change tab it get's stuck. Found something on StackOverflow about synchronous ajax call in IE7: http://stackoverflow.com/questions/782532/ie-not-triggering-jquery-ajax-success First answer: I stuck my "success" functionality in the success block for FF and in the error block wrapped in an "if (xhr.status == 200)" conditional. Is there any way I can do that without having to patch
Help rendering loading message (in document.ready)
I have a page that consists of a form with some custom user inputs. There is some heavy duty JavaScript involved in initializing the inputs the displaying messages about the state of the inputs. All of that JavaScript happens on form load - currently in document.ready(). I want to display a loading message (and eventually a progress bar) as these fields are initialized. My first attempt was to use blockUI, however it appears that blockUI cannot be called from within document.ready(). If I make
Simple questions regarding themes
Hello all, I have a couple of questions regarding theming with jQueryUI. I used the Themeroller and dowloaded an already existing theme, Blitzer. I dropped it into my project and linked to the jquery.ui.all.css file and it works fine. My problem is making some tweaks to the look of it. I read that you can make changes to the various widgets by editing their css files but I am not sure what to do for the two problems I have. The issue is with an accordion. I am using it for a menu, the layout uses
How to use jquery ui dialog modal form edit information?
Hi All, I just download jquery ui dialog modal form. With it I can easily add information row. But how can I edit the info I just input with the the help of modal form? Is the modal form available for this? I want to add an edit link, and while I click the link then the modal form popup and give me a dialog to edit the row. Anyone can give me some hints about how to do this use jquery. Thanks.
jquery tab and jquery dialog in "safari 3.1.2"
HI.. i checked my app. in "safari 3.1.2" Im using jquery tab and jquery dialog.. once the dialog come up, after i confirm it. the tab rounded corner images are going disappear HTML clipboard. but when refresh the page its gone appear.. can any one tel me a solution for this plz.....?
Multiple Sortables without Classes?
Is there a way to do more than two sortables that can be dropped on each other without using a common class between them? For example: <div id="Col1"> <div id="Num1">One</div> <div id="Num2>Two</div> </div> <div id="Col2"> <div id="Num3">Three</div> <div id="Num4>Four</div> </div> <div id="Col3"> <div id="Num5">Five</div> <div id="Num6">Six</div> </div> How do I make all three columns into sortables that I can drag between without connecting the same class to each of "Col1", "Col2"
Is aria interfering with my effects master scheme?
Hi, I'm making a tasklist. I want it to be sortable, but ui.sortable interferes with my goals (I want tasks to be droppable to one another as well, to create subtasks). So I've programmed something quite nice and similar with draggable and droppable. To make it like ui.sortable, I'm adding in droppable spacers that will expand on dragover and that will (in future) handle when user drops a task on them. I'm having trouble with the out event (of ui.droppable on these spaces). I added an animate to
Validating search criteria.
Hi All, I have a asp.net page where I need to validate a search criteria. My issue is when ever user doesnt enter any search criteria, i need to summarise the missing fields and display as a validation summary in a div using jQuery. Could anyone help me fix this issue. Regards SA
Jquery UI Dialog in Firefox - Whole screen becomes non-clickable including dialog
I have two links that show up two modal dialogs. These dialogs are static divs in the html of the page with their own ids. When I click the first link, the first dialog shows up and behaves correctly. But when I click the second link, the whole screen grays out and everything becomes unclickable, including the second dialog. It happens also the other way around, clicking the second link, and then the first link. This problems occurs only in Firefox but not in IE. Any ideas why this is happening in
not able to retrieve the value of textbox present inside a jquery ui dialog
I am creating a div dynamically using the code $tabs.tabs('add','#tabID','title'); and loading its content via AJAX [using jquery load method eg. $('#tabID').load( "test.jsp" );]. In the test.jsp im using jquery ui dialog which contains a textbox and submit button. When i open the tab for the first time everythis is working fine; But once I close that tab and reopen the tab to load with test.jsp, i have an error. i.e When i click on the submit button of jquery ui dialog, I am not able to retrieve
Smoothly moves the slider
Hello. My Slider - link I have only a few values of the slider, instead of scrolling smoothly, it jumps. Is there a way to smoothly moves the slider? Thx
Handle on the slider
Hello all! Thanks for your useful slider! I would like to know if it's possible to disable the handle and automatically enable it when the user click on the line? Thanks for your help! Mathieu.
jQuery UI - Autocomplete - Search algorithm
Is there any way, to have the Autocomplete widget use a custom search algorithm -- it seems that it uses 'contains' logic to filter the list. I was looking to maybe do something simple like have it use a 'starts with' logic instead. Thank you, Kien
jQuery UI datepicker - using multiple date formats
Okay, here's what I have so far... // calendar $("#datepicker").datepicker({ onSelect: function(date,instance){ $(".eventdateheader").html(date); $.ajax ({ type: "GET", url: "example.php", data: "date="+date success: function(result) { //do something } }); },
DatePicker: how to change fixed width when inline?
I'm trying to use the date picker as an inline element. Works fine, except it always has set a fixed width, probably dynamically set during creation as an element style. Looks like that: <div class="ui-datepicker-inline ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all ui-datepicker-multi-3 ui-datepicker-multi" style="width: 51em;"> ..... </div> Is there any way to manually change that (e.g. 100%), so it scales with it it's parent container? Thanks, Drakanor
using setDate in DatePicker changes the page layout and adds white space at the bottom
Hi All, I'm encountering a problem with the setDate function in DatePicker UI. I looked for a solution for 2 days without success. didn't see anyone else encountering this problem, except one unanswered post. When I'm using the function, an addition of a block of white section comes to the bottom of the screen. it happens only when I'm using the setDate function before the user actually chose a date in the datepicker. if I'm using it after the user already chose, no white space appears. this is the
jQuery UI - Autocomplete
Hello, I've dug around in the documentation and haven't seen anything directly relating to my question, so I thought I'd post it here. With the Autocomplete widget, can the size of the dropdown listing of the widget be controlled, specifically is it possible to constraint the height of the list? I have a fairly large local dataset (~500 items), and I am setting the minLength property so that it doesn't start searching until there are at least 5 characters entered, but the list can still come back
original value of slider
I did a search (both on these forums and Google) and couldn't find an answer. I am wondering if there is a way to obtain the original value of the slider so I can see if the value has changed? I don't want the "stop" event to do my ajax call if the value hasn't changed, and the way the slider works, the stop and change events are triggered even if the value has not changed so my ajax call gets called if the user slides and sets it back to the same value it was.
Next Page