UI / Mobile mix and match
Hi, I am currently using jquery mobile predominantly for a site, but find the jquery-ui autocomplete to be far more useful. Of course, I can just include both libraries...but that is a bit of a waste. Is there any way at all to "mix and match" - so for instance to include just the jquery-ui autocomplete functionality, thus saving bandwidth, or is it all very interconnected...?
calling a jQuery ui dialog box from a link
I C&P some code from this site to show a dialog box. It worked, but I want to call the dialog box from a link if possible. <!doctype html> <html lang="en"> <head> <meta charset="utf-8" /> <title>jQuery UI Dialog - Default functionality</title> <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" /> <script src="http://code.jquery.com/jquery-1.9.1.js"></script> <script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script> <link rel="stylesheet" href="/resources/demos/style.css"
SORTABLE - FIRST TIME LOADING ISSUE
I have written following function on page which will get displayed in dialog box. When dialog box has opened first time the sortable list doesn't operate or i cant move any element but if i close dialog box and reopen it again then sortable works perfectly. $(function() { if($( "#sortablelist" )!=null){ $( "#sortablelist" ).sortable({ placeholder: "ui-state-highlight", opacity: 0.5,cursor: "move", forcePlaceholderSize: true, update : function
Autosuggest pass more than one value to php page
Hey guys, very new to jquery. I found this autocomplete box (http://jqueryui.com/autocomplete/) and I have a question. For example's sake, let's say I have this database table of NFL teams with 2 fields: Conference and Team Name Conference | Team Name AFC | Steelers AFC | Patriots NFC | Packers NFC | Seahawks AFC | Dolphins etc... Then, let's say I have on my main page a text box called "team" that is used to search the database for a team name, then above it, a drop down box called "conference"
How can i call a method from a html which is loaded by ajax ( tab)
I am using jquery ui tab to load a html, in that html i have a method called alertMe. $("#tabs").tabs({
beforeLoad : function(event, ui){
ui.jqXHR.error(function(){
});
ui.jqXHR.success(function(){
alertMe()
});
}
}); <div id="tabs" style="height: 100%"> <ul> <li><a href="Map.html">Tab 1</a></li> </ul> </div> Inside the map.html i have the alertMe method. here it show alertMe is undifined.
Ui dialog position problem
i have an problem with positioning of jquery dialog. i used collision:"flip flip" but verticle flipping is not working. i.e. when i open my dialog at bottom of screen and screen has verticle scrollbar then my dialog doesnot flip in verticale direction
jQuery UI Draggable Clone Focus
Hi all. I posted this on StackOverflow, but I haven't had much success yet, so I figured I'd post here for more eyes. I'm trying to build a draggable/droppable folder-file view with jQuery UI, but I'm running into a problem with, what I believe is attributed to the helper. Here is my code: The HTML <body> <div id="topContainer"> <span>Parent Directory 1</span> </div> <span id="topFolder" class="folder"> <div class="drop"> </div> </span>
when i move one of four draggables, and right click on it -to make another DIV appear- ALL the rest elements move down
part of code here: //********************************************************************************** $('#mymenu').hide(); $('#mymenu, #mytop, #myleft, #myright, #mybottom').resizable(); $('#mymenu, #mytop, #myleft, #myright, #mybottom').draggable(); //********************************************************************************** $('#mytop').mousedown(function(event) { whichElement = "#mytop"; if(event.which == 3) { $('#mymenu').animate({'left': + event.pageX + 'px'}, 1); $('#mymenu').animate({'top':
Problem in AutoSuggest placeholder text change
When page first time loads in mozilla or firefox it working fine for change placeholder text but when we refresh the page with F5 keyboard our placeholder text is not working its behaves like text in placeholder.however i am changing placeholder with onchange of select box id based.but the same thing working fine in chrome. html i have used for autosuggest box is below: <FORM NAME="searchForm" ONSUBMIT="return CheckDataSearch(document.searchForm);" METHOD="post" STYLE="margin:0px;" action=""> <div
Filedownload using jquery
hi all, i have below code in my c# layer to start the download. I want to re-enable my UI once the download starts. but since i have already changed the header, i am not able to fire any javascript code. Response.Clear() 'Add Response header Response.AddHeader("content-disposition", String.Format("attachment;filename={0}.csv", "RawDetailReport")) Response.Charset = "" Response.ContentType = "application/vnd.xls" 'Append Data dtrReader.NextResult() etc.. is there a solution for this in jquery.
JQuery UI tabs: how to start showing effect while hidding
I have a fade effect on hide and show tab in jQueryUI tabs. It works good but when the one tab is hidden then next tab is showing. I would like to start showing effect while hidding effect. How to do it? The image on slider2 should start showing when the slider1 is hidding. They should do it in one time. http://jsfiddle.net/Qw892/
Autocomplete not firing on first character
Hi! I have implemented the jQuery UI autocomplete script, but the autocomplete is not firing on first character. I have an input field with a static value on page load. When I change this value, the autocomplete is not firing. When I delete the character I typed and type it again, the autocomplete is working. Am I doing something wrong? I can't find any information about this problem. var quantities = ['10','20','25','30','35']; $('#quantity').autocomplete({ minChars:1, noCache: true,
Positioning the datepicker
Hi All, I'm hoping someone on here will be able to help. I've got a date picker setup, and this is activated from a button click as per normal. I've been asked to make three months appear, which I've done and all is fine in that respect. The only issue is the placement of the date picker once it has opened. Now with the three months being output, the middle monthappears under the button that was clicked, with the next month appearing outside of the layout we are trying to keep within. I've seen
Work around for dialog in IE 9 quirks mode?
I am working on a very old site that uses quirks mode rendering. The jQuery ui dialog from version 1.8.6 displayed fine, but after upgrading to the latest (1.10.2) the display is broken in IE 9. So I have read a few posts that jquery ui is does not support quirks mode, but I was just wondering if there were any work arounds to the problem that someone has discovered, or maybe a more advanced javascripter can point out how i can fix display. here is the example. use browser IE 9. (I am using 9.0.8112.16421
Resetting CSS in nested Tabs
Hi, I want to have one vertical tab widget in which another tab widget is nested in. So I tried to create the outer tabs, than reset all CSS in the inside of it and call the tabs function on the inner. I reset the css by calling the attr() function for style with following content: /*just a extract, because the whole css would be too much for this post*/ .cssReset td, .cssReset tfoot, .cssReset th, .cssReset thead, .cssReset time, .cssReset tr, .cssReset tt, .cssReset u, .cssReset ul, .cssReset
Autosuggestion box retains its suggestion values
when we type some suggestion values in autocomplete box it's gives suggestion then if we F5 the mozilla browser it retains value in box but same case not happen in chrome when F5 in chrome placeholder values comes again. Can anybody help the solution of this problem.
Disabling keyboard input for Spinner
Hello all, Am new to jquery and was wondering if someone could help or point me in the right direction. I'm working on creating a tool using a series of spinner inputs. I only want these to be editable by clicking or touch and want to disable keyboard input use. I've read that previously the editable property could be set to false on intialisation of a spinner and this would do the trick. On the latest UI i believe this is no longer an option or method and i can't find one that will achieve this.
Datepicker date range format
Hi Guys, I'm struggling with changing the date-range format from: mm-dd-yyyy to yyyy-mm-dd in the following variable script. The code works fine as it is below but the moment I try and change the format of the date to what I need (yyy-mm-dd) it breaks and doesn't work. Has anyone got any idea where I'm going wrong? Many thanks // Enable a range of dates var disabledDaysRange = [["4-4-2013 to 4-6-2013", "4-14-2013 to 4-18-2013", "5-2-2013 to 5-22-2013"], '5-29-2013']; function disableRangeOfDays(d)
jQuery UI Accordion "jumping" on load ?
Hopefully someone here could help me with this, though it may not be a jQuery problem but instead a CSS problem. I just finished a portfolio website for one of my college graphic design courses, and I'm using the accordion from jQuery UI for part of my navigation. Click here to see the website. When you click on "work," you can see the accordion functioning, but as soon as is it loads it "jumps" into place instead of unfolding smoothly as it should. Does anyone know what might be the cause? The jQuery
Drag and Drop Events(when dropped, and when dragged out)
Hi, I am using jquery UI for drag and drop. My requirement is: I have 6 to 7 droppable areas in a page. When I dropped an element in a droppable area I need to change the css of that particular droppable area. When I drag out the element I put back the old css. Please suggest. Regards, Thanks.
Datepicker not showing current value when edit cakephp form
Hi, I am using datepicker with cakephp 2.3. Datepicker popup is ok. When I submit a form then if any form validation error found it back to current form. All other fields value are persistent but does not show only date field value. Even when I want to edit a any record, it does not show date field value. I checked many ways and I am sure that it is not cakephp problem. Any one can help me? Thank you Hanif
jQueryUI API
Is it just me or does jQueryUI's API seem generally strange to anyone else? For example, in order to close a dialog I can't call a .close() method; instead I have to call .dialog("close") instead? Also, I can't hide the close button from the API, I have to hide it with a CSS style? But enough picking on Dialog, the Selectable widget/interaction also seems missing basic features like the ability to only allow one selected item at a time. There is a forum post about this issue but it appears like
Jquery ui accordion sortable cookie persistance
Hey guys is there any way I can get jquery to remember how my users change the order of the accordion when it is sortable? I mean it is easy to make the accordion sortable but what is it good for unless you can get it to remember how the user sorted it. I really need help with this one. Do I use cookies or database? please respond with code snippets to help me out. I am not to good with jquery so please go easy on me If this is an easy question. Thanks in advance, Mooror
sort-ception. dynamic sortables (within sortables) - cant get it to work right
Hi Im working on a fairly basic text editor webapp with the idea that you can break the text into organizable bits. www.laserpanda.com/laserowl2/editor.html there are two basic bricks in this system: flerps (contains text) and flerp-flerps (a container that can contain flerps or other flerp-flerps). im using sortable to rearrange the pieces as i wish, but it is causing me some headache: 1. load page 2. create a second flerp-flerp 3. see how you can drag and drop the second flerp-flerp into the first
autocomplete times out in 5 minutes
the website is using a jquery autocomplete and when you type in after 5 minutes in the customer's network you get a login screen. then it triggers and error in the fetch javascript. If most people call the website, it does not time out for 30 minutes. In the web.config I have the time out for 30 minutes. I have a customer using a computer inside their company, if they dont do anything on the website for 5 minutes and then try to key in in the autocomplete, I get a system login screen and then
Having problem with positioning jQuery UI modal dialog
I am trying to make the modal dialog appear at top of the page. Previously it was easy with position but with the redesigned position api, I cant make it work. Leafing through the docs i am trying this one - position: {my: "top", at: "top", of: window}, in fact i tried every possible combination. What should I do?
jquery UI with jquerymobile
Hi All, I try to use autocomplete widget from jquery UI in jquerymobile page. but it shows an error Uncaught TypeError: Object [object Object] has no method 'autocomplete' I think it is caused by some clashes in my header.But, how to use jquery UI features with jquerymobile? the autocomplete feature is works fine when i remove the headers <link rel="stylesheet" href="css/jquery.mobile-1.3.0-rc.1.min.css" /> <script src="js/jquery-1.8.3.min.js"></script> <script src="js/jquery.mobile-1.3.0-rc.1.min.js"></script>
using jQuery UI with jQuery 2.0
Does jQuery UI (in particular the current latest release 1.10.2) work with the recently released jQuery 2.0.0? I have tried to look for info about this on jquery.com and jqueryui.com and cannot find any. http://jqueryui.com states that jQuery UI 1.10.2 requires jQuery 1.6+ indicating that jQuery 2.0 qualifies. However, that page has existed since before the release of jQuery 2.0.
using jquery autocomplete widget with json
hi i am not able to understand how to get my json picked in autocomplete UI widget. for(var i=0, l = data.itemisedBill.length; i<l;i+=1){ var itemLength=data.itemisedBill[i].item; $(itemLength).autocomplete({ source: $[data.itemisedBill] }); } It is giving exception in the source part? how should i give my json here. I json file is separate. Thanks
Dialog data different depending on jQuery version
Using various versions of jQuery UI (1.9.2 - 1.10.2) and various versions of jQuery (1.8.2 - 2.0.0), I am attempting to resize any open dialogs if user resizes iframe. (based on code found here: http://stackoverflow.com/questions/3060146/how-to-auto-center-jquery-ui-dialog-when-resizing-browser) My code looks like this: $(".ui-dialog-content:visible").each(function () { var dialog = $(this).data('xxxx'), I am finding that sometimes (jQuery UI 1.9.2 - jQuery 1.8.2) I need to use the following
Edit text and addClass at Dialog Button
Hi guys, I've another question for you ... I've create a function for open a dialog like this function dialogOpen(div, width, height, text){ $(div).dialog({ autoOpen: false, width: width, height: height, modal: false, buttons: {text:function(){ }}, close: function() {$(div).remove();} }); $(div).dialog( "open" ); } $(document).on('click', '.openDialog', function()dialogOpen('divClient', 'auto', 'auto', 'New');}); I would like to Know : Why the text
Downloading themes programmatically
I have a site with 30+ custom themes. Every time I update my version of jQuery UI, I need to re-pull each theme by: 1) Grabbing the URL provided in the jquery-ui CSS file 2) Pasting it in my browser's address bar 3) Clicking the "Download theme" button 4) Clicking the "Download" button This becomes a very tedious process when you have many themes and when there are many minor/major updates to jQuery UI. Is there a way I can automate this? Is there an API I can call to pull the themes down programmatically?
I have a problem with the demo position/#cycler
I have a problem with the demo on page http://jqueryui.com/position/#cycler When I click the link "previous" quickly and continuously, I can not see the image of left side. Please see the attached screenshot. Please tell me the cause or the workaround.
Where is theming CSS documentation ?
Hi, I can't find the documentation for theming jQuery UI widgets. On the old website, there was this page : http://docs.jquery.com/UI/API/1.7.2/Datepicker Is there an equivalent on the new website ? I search the list of all class names used on datepicker, for exemple. Thanks
Tooltip using data- attribute
Hi: I am trying to use the new tooltip widget on elements that do NOT have a title attribute, but have a data-tooltip attribute. I though this would be the correct initialization, but it does not work. $(document).tooltip("option", "items", "[data-tooltip]" ); What is wrong here? Thanx
how to create custom date and time picker ?
Hi all, Please any one give idea to create date pickert ui with close and clear buttons and also i want to get time also. How to do this using jquery 1.9 Thanks and regards, Nazeer.
Looking for minimal examples/demos
I've been trying to get my mind around jquery and jquery-ui and so have been looking through examples and demos all over the place for the last few days. I'm finding it very difficult to identify which are the CSS elements which are actually making the widgets function in a certain way and which are the elements that are just to make things pretty. Are there any demos where the CSS is inline and limited to just what is necessary to show how to make something work? I appreciate that presentation
Autocomplete, Google Chrome, and onBeforeUnload
I have several jquery ui autocompletes in a form that are being populated using ajax. When I load the page in Google Chrome, the onBeforeUnload event fires and cause the autocomplete attribute (which jquery ui sets to prevent the browser's autocomplete from interfering with the jquery ui autocomplete) to be removed (the fix for http://bugs.jqueryui.com/ticket/7790). The relevant line is 6053 in jquery-ui.js (v 1.10.1). This only happens in Chrome- FireFox and IE don't exhibit this behavior. I have
menu invoked by button
I am trying to code a menu invoked by a button with a gearbox and a triangle icon. Much like the gearbox/triangle button used in gmail to access settings except for a bit of text between. I can get the button nicely formatted using jquery-ui.button. I can get the menu working using jquery-ui.menu. But how do I make the menu start invisible and then appear when I press the button or hover (with the rest of the interaction with ESCAPE, move the mouse away from the hover, etc.)? It appears that a
Accordion move after open
Hello, I need to be able to move the top of the accordion after it's been opened as some of the content is quite big. We'd want top to move at the same value for all accordion elements. How can I achieve this? I've tried wrapping them in a div, changing the div's position to absolute and changing its top but it didn't work. Thank you!
Next Page