forms data 'resets' when switch tabs
hi guys i have a tabbed setup - the 0 tab contains text links (userNames) which open further tabs to edit their details. if i change away from the tab containing the form, then come back to it, all the changes are gone. i have set cache to TRUE, but it's still reloading the tab content from the cached copy in any case, so i still lose my changes even tho it's not reloading from the server. how can i change this behaviour so that my form remains in its partially edited state when i switch away and
UI designer - CSSer - what can i do to help?
Hello, Jquery rocks and UI too. I'm more of a designer/css dude. Is there anything i can help on? Thanks, scott romack romack.net
'loading' message after dialog button clicked.
Hello Guys, I've got a jQuery UI dialog window which opens up containing a form, when the button on the dialog is clicked it submits the form. The code for which looks something like this: http://pastebin.com/bKSJaLCA and on screen looks something like this: http://tinypic.com/view.php?pic=2l9ldsn&s=5 When we're under heavy load this process can sometimes take a number of seconds and I'm looking for a nice way to let the user know we're dealing with their request. It'll look something like this: http://tinypic.com/view.php?pic=293c3dk&s=5
GoogleMaps "driving directions go outside the JqueryUI tabs frame in IE
I have integrated the JQueryUI tabs widget and it contains a GoogleMaps in the main tab and the driving directions in the second tab. The problem is in Internet Explorer (IE 8 too, while in Firefox is perfect) and it's about the tab with driving directions that go out in right side of tab. If I place these driving directions OUTSIDE the Tabs frame, everything works good, also in IE. The problem seems to be the union "IE, googleMaps jqueryUI tabs", someone have idea to solve it? Here the demo of the
Space bar closes accordian
Hi Guys, Pretty new to jquery so any help here would be appreciated. I have a text input tag in my <a> that toggles the accordian. This input allows me to edit the title of the tab and is triggered by an edit/save span. When I chick edit the title of the accordian is entered in the input tag. The problem occurs when the user presses the space bar when editing the text. The accordian slides up and no space is entered in the input field. Is the space bar used as a trigger to close the tab? It is not
jqueryui dialog and ie6 not allowing typing inside form.
If anyone has IE6 and goes to http://www.ashcreek.ca and tries to login, you'll notice you can't type in any of the fields. I use the jQueryUI dialog, and include a form in the box, then validate it with jquery.validate. In all the other browsers I don't have any problems, but (surprise) in IE6, text can't even be typed into the fields. Any thoughts, has someone seen this before? I should mention, that the inability to type happens before form validation, which happens on the ok button function.
themeroller support for tables?
I'm using datatables. Right now, any theme I choose displays records in various shades of green for most, or others based on its class. Is it simply a .css thing? Would I have to create a new .css for each theme? Or is there other support for the table portion of the table of datatables?
(Datepicker) - simple highlighting of specific days, who can help? (source inside)
Hi guys, i want to use the Datepicker for highlighting specific dates. Here is my latest code: <script type="text/javascript"> var dates = [30/04/2010, 01/05/2010]; $(function(){ $('#datepicker').datepicker({ numberOfMonths: [2,3], dateFormat: 'dd/mm/yy', beforeShowDay: highlightDays }); function highlightDays(date) { for (var i = 0; i < dates.length; i++) { if (dates[i] == date) { return [true, 'highlight'];
Datepicker: Problem with array (input requires yyyy-m-d, but data comes in yyyy-mm-dd digits)
Hi, i have a datepicker in which I highlight specific dates by an array. This works: var Days = ["2010-5-5", "2010-5-20", ...]; My Datepicker only accepts dates as above mentioned (yyyy-m-d), but I want to fill my array like this (yyyy-mm-dd), it doesn't work: var Days = ["2010-05-05", "2010-05-20", ...]; Can I change this in any way? any help? Thanks! With a php array I want to add dates from a MySQL Database. But all these dates come in yyyy-mm-dd.
Why cannot I not get tab content to show pointing to jquery site? I based this code on the demo - http://jqueryui.com/demos/tabs/#ajax
You will need to; 1) pull down/or find the css file that I am using for this to 'work' properly (didn't know the url to css on website) 2) pull down content1.html and create in a subfolder ajax relative to where the html file below is created. Not sure why the content for the second tab is not showing, tab shows as blank. If I post this into the browser I can see the content - http://jqueryui.com/demos/tabs/ajax/content2.html. If I create a local copy of the file (first tab is this way) it works.
jQuery UI sortable bug IE8 ?
Hi there, I'm using the sortable plugin of jQuery UI 1.8 in IE8 and now I noticed this strange issue. As soon as I start dragging a sortable item, the "helper" element that sticks to my mouse does stick to my mouse as long as I didn't scrolled before dragging. If I scroll down the page and start dragging, the helper element I moved doesn't stick to my mouse anymore it's about 200 pixels lower than my mouse (same distance as I scrolled?). As soon as I scroll further downwards, the element moves further
datepicker selecting one of several pre-defined date ranges
I need to extend the functionality of the jQuery UI datepicker, and I wanted to ask whether what I'm planning can even be done with the current extension mechanisms in place. I have an application in mind where what users select is a date range, but it's not just a matter of picking the start and end dates. There are only a few possible ways in which you can select ranges. Imagine you're running a hotel and you have time slots for when people can rent a room. The slots aren't the same time length.
Some features don't works in custom builds
Hello! I'm using jQuery Download Builder and build my own packages. But in the downloaded package the dialogs can't be draggable, and/or resizable. But everything works fine if i add this additional js to the code: <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> I can't find any description about this issue in the documentation. I'm doing some things wrong?
Function calls in modal dialog
Hi, I have a modal dialog with the functionality inside to add new form fields to the form in the dialog by clicking on a button in the dialog. This works fine on the first opening of the dialog. If i close the dialog and reopen it again, without refreshing the page, the function to add new form fields doesn't work anymore. My function looks like the following: $('.addproductbutton').click(function(event) { var count = $('#fieldset-products > *').length $.ajax({ type:
Sequential Animation of Unknown Number of Elements
OK here's my problem-I really want my web page to look slick, so I am currently using the jQuery UI effect fade to show and hide certain divs. When a user clicks on certain links, I want certain divs to hide and other divs to show. The problem is-I want these animations to happen sequentially-not simultaneously. Because they are different elements they aren't added to the same queue and thus happen at different times. I have tried to use the fxqueues plugin, but I can't seem to get that to work
JQuery Dialog and scroll bar
Hello, I'm using the jQuery dialog plugin which does so many things very nicely. One question I have is when a modal window is open in IE 7-8, users are still able to scroll the background page. This can take the Dialog out of view and confuse my users as to why they are not able to click on anything. Is their a way to disable the scroll bar in the background window while the dialog box is open? Thanks Mike
Multiples problem 1.8
ui.Resizable -ui.size is not the element current size but the mouse current position - position of the element when the containement option used. (this is because the plugin containement only stop resizing VISUALLY) -alsoResize plugin resize other elements even if the current element don't resize anymore because of its containement for the same reason as above. (Quick fix: Move the addition of the plugin after the containment plugin) You should implement "plugins interaction".
is it possible for 2 different UI elements on the same page to use the ready() function?
Hi, I'm still quite new to jquery, but I have some practice with UI. I have some tabbed content embedded inside the horizontal scrollTo element, however they both require the ready() function. At the moment whenever I have them both active, they conflict and neither work at all, but they work perfectly on their own. Can anybody advise the best way around this problem please? Thanks in advance.
Datepicker in modal dialog : problem with populating a date field
Hi, I have a modal dialog which contains a form loaded via ajax. In the form is a date field which is populated using the jquery datepicker. All works well if I open the dialog one time. If I load the dialog a second time without refreshing the page the datepicker works but the selected date is not assigned to the date field. The value of the date field doesn't chance. Maybe someone has an idea how to solve this ? Thanks in advance
combobox problem with selected entries
I got a search formular including some fields like a select list <select id="whatever"> <option value=1>Entry 1</option> <option value=2 selected="selected">Entry 2</option> <option value=3>Entry 3</option> </select>then using it like in the example (function($) { $.widget("ui.combobox", { _create: function() { var self = this; var select = this.element.hide(); var input = $("<input>") .insertAfter(select)
how can i hide close button on dialog while dragging
As the title says: how can i hide close button on dialog while dragging I have been trying different variants of this code. It's not working. $("#file_dialog").dialog().parent('.ui-dialog').children('.ui-dialog-titlebar-close').hide(); I hope you can help me Thanks Carsten
jquery conflicts (even after using window.onload=$.noConflict())
hi, Greetings.I have listed the URL below. *CASE 1: ** http://demo.lithe.in/jcaurosel/index.html *In first URL Jcaurosel is working fine.the reason is i have not added *window.onload=$.noConflict(); * Problem : In that case slider and drag n drop functionality is not working *Case 2:* *http://demo.lithe.in/jcaurosel/index2.html* when i add * **window.onload=$.noConflict(); *Everything is slider, drag n drop is working fine but jcaurosel is not working fine.. Thanks in Advance* With Regards, *Mehul
jquery caurosel doesnt work when using $.noConflict()?
Hi Everyone, I am developing project in php.which has draggable,droppable,sliding,jcaurosel effect.. Every thing except jcaurosel seems to work fine if i mention window.onload=$.noConflict(); But jcaurosel sliding effect doesnt work.List of files i have added : 1) ui.all.css 2) jquery-1.3.2.js 3 )ui.core.js 4 )ui.draggable.js 5 )ui.droppable.js 6) jquery.jcarousel.js 7) jquery.jcarousel.min.js 8)jquery-1.4.2.min.js Thanks in Advance From Mehul(India) mehul.fatnani@lithe.in
Is it possible to set label on JQuery UI Button, that assign to checkbox without <label> tag?
$('.delete').button({label:'some text'}); ... <input type="checkbox" class="delete" id="name1" />This code only hide checkbox, without showing JQuery UI Button. All well if I using <label> tag instead of using label option, but I want doing it without adding new tag (as <label>). Is it possible?
accordion inside a accordion doesn't work to well, how come
Let the code explain it self <div id="accordion"> <h3><a href="#">First header</a></h3> <div> First content <div id="accordion1"> <h3><a href="#">1st header(accordion1) inside accordion</a></h3> <div>First content</div> <h3><a href="#">2nd header(accordion1) inside accordion</a></h3> <div>Second content</div> </div>
Dragging by class versus div id has weird results on droppable. Dropping outside the droppable seems to drop, but inside does not.
This code used on chrome illustrates the issue; Couple of things to mention, 1) if draggable22 has float: left; specified (like draggable 21) symptom seems to go away. 2) why draggable22 is considered dropped when you drag it just to the left of the droppable, I am not sure. <meta charset="UTF-8" /> <style type="text/css"> #draggable21 { float: left; } #draggable22 { } #draggable2 { width: 90px; height: 90px; padding: 0.5em; float: left; margin: 10px 10px 10px 0; } #droppable2 { width: 420px; height:
Why does the drop function return false for http://jqueryui.com/demos/droppable/#propagation example?
For this demo; http://jqueryui.com/demos/droppable/#propagation Why does the droppable drop function return false? I took the return out and it did not seem to affect the behaviour. Ideas? <script type="text/javascript"> $(function() { $("#draggable").draggable(); $("#droppable, #droppable-inner").droppable({ activeClass: 'ui-state-hover', hoverClass: 'ui-state-active', drop: function(event, ui) { $(this).addClass('ui-state-highlight').find('> p').html('Dropped!'); return false; } }); $("#droppable2,
I don't understand what ui behaviour the snap to is supposed to exhibit, what is the point of it.
I am going thru the demos and am not sure what the snap to functionality does or is supposed to do in the ui. http://jqueryui.com/demos/draggable/#snap-to I am using the above demo in chrome.
How can I pass params to the open event of jquery.ui.dialog?
Hello everyone: In my project, I want to load a partial view dynamically which will be able to create and edit data. The dialog can be triggered by create button. Also I want the dialog can be triggered by edit button in a data list. so I write my code as below: $('#editorDialog').dialog({ autoOpen: false, title: 'edit', bgiframe: true, width: 980, position: "top", modal: true, open: function(event, ui) { //How can I pass params to here. $('#editorDialog').load('/Business/Order/Edit/',
Dialog Widget
I am attempting to use the Dialog widget in VS2008 utilizing a masterpage and a child form that needs to call the dialog box to appear on a asp button click event and close after processing a call to a .dll that generates a report. Anyone know how to configure?
Dialog Box's loose the title in IE7/8, OK in Mozilla n Chrome, etc
The following code works fine until displaying it in IE. The Resource file word shows blank in IE but other browsers show the proper value from the LocalResource file. I hope someone knows the answer to this... <asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server"> <title id="PageTitle"><asp:Literal ID="Literal8" runat="server" Text="<%$ Resources:PageTitle%>" /></title> <script src="../Scripting/jquery-1.4.2.min.js" type="text/javascript"></script> <script
datepicker UI floating holidays
Hi. I have been asked to create a calendar where major holidays cannot be selected. Holidays with fixed dates are no problem, however there are always things like Memorial Day or Labor Day, which are tied to certain days, not dates. What to do with them? I suppose I need to get a day using altFormat and then create a bit of internal logic to calculate the holidays. The holidays are usually something either first or last, like last Monday of the month. What would be a good way to isolate them?
Initializing Jquery UI with a setup (localization, theme) taken from a database
Hi. I'm the lead programmer for a CMS written in PHP and, as such, I have little knowledge of JavaScript. In the last year I have gradually moved all of the JSs I do have to JQuery, in a conscious effort to get more stability and a better user interface. The last big move I have to do is with skins. Right now I have three themes of my own, more or less corresponding to different CSS files. In the preferences page, my user chooses one of those out of a select and I store her selection in my database,
autocomplete with hidden info attached to option
So I'd like to use the JQuery-UI autocomplete. But there needs to be hidden metadata attached to each option, which is NOT shown in either the list (label) or the text field once selected (value). But IS available in the select method -- I'd actually like to fill a hidden form field with it. Now, the autocomplete demos provide a demo that does this: The "remote datasource" example does not display the bird scientific name in the select list OR the text field once selected, but DOES have it available
JQuery-UI Autocomplete, source callback and 'this' keyword
I'm confused what's going on with the source callback in JQuery-UI Autocomplete, and the 'this' keyword. $('.selector).autocomplete({ source: function(request, response) { $(this) # is what? } }); I want $(this) to be the element that matched the original selector, so I can explore $(this).closest("form") to get some information about it's context, all unobtrusive style. But that doesn't seem to be what "this" is there, oddly. Anyone understand what 'this' is there? Anyone understand
create a pannable frame/window and drop widgets to it
Hi, I'm interested in creating a frame or window type object using jQuery and have it be pannable similar to the way Goolge maps are. I also wish to drop widgets to this "frame" and have then start after dropping. Any clues? Can you point me to any examples? Thanks
[tabs] When clicking on tab, load a new page instead of hide/show divs
Hi, When I click on a tab, it seems that a show/hide mechanism is used to show the content of the div associated with new selected tab (via an anchor) and hide the previous one. I would like instead to load a new page, how can I achieve this ? Thank you for any help !
Change the shortcuts of Datepicker
Hello, I would like to know if there is any way to change the shortcuts of Datepicker. Ctrl+Arrows to navigate through day is nothing intuitive. Is possible to customize it or change to just arrows instead of ctrl+arrows? Thanks
zIndex failure in multiple dialogs
I use two dialogs the first using the second unionDialog = $("#setUnion").dialog({ autoOpen: true, /* modal: true, */ zIndex: 500, position: [75, 50], width: 750, }); Calendrier = $('#calendrierGeneral').dialog({ autoOpen: true, /*modal: true,*/ width: 450, zIndex: 1000, });In fact the first (actually called for some reasons after the second) opens with z-ndex = 1002 and the second with z-index = 1001.
Design breaks
I've been trying to figure this one out for quite a while now, but haven't been successful so far. As you can see in the attached screenshot, the Accordion and Dialog layouts break. In the accordion the word "Ochtend" is below the little arrow, and in the dialog popup the X is below the title and the resize button is on the bottom left. You can try it out for yourself if you download the zip file, there's the html, css and js. The frontend of this same site has completely different HTML and CSS,
Next Page