UI Tabs... weird behaviour after upgrade from 1.7.3 to 1.8.10
Hi everyone I've just upgraded a project from jQuery UI 1.7.3 to 1.8.10 Everything seemed to work perfectly apart from a slight change in behaviour when using UI tabs with content loaded through AJAX. When selecting a different tab for the first time since page load, the user viewport gets scrolled up to just underneath the tab bar. When selecting a different tab that has already been loaded once, the viewport stays where it is. Here's a test site which should demonstrate what I mean... http://thenetzone.co.uk/fail/tabs_fail.php
draggable: lock/snap object to circle
I'd like to have users drag and drop objects around circular paths, almost like hands on a clock or a radial dial. Is there any way to rig this up with draggable constraints or snapping? Thanks! Drew
User control inside JQuery UI sortable
Hello I have a sortable portlets on my page. I have inserted an asp.net user control that contains a delete button, inside JQuery UI sortable portlets. On every portlets move I save the new sort of all portlets into the database via ajax. The problem is when I click the first time delete button nothing happens, the button even don't fire, Only the second time of button press is fire. What could be the problem? I suspect the JQuery ajax, but not sure... Thanks
JQuery range slider to show hide blocks of content
Hi all I'm trying to use the Jquery range slider shown here: http://jqueryui.com/demos/slider/#range I have four blocks of content. I would like the movement of the range to show/hide the blocks of content, based on their ID. So, I guess there would be four increments on the slider panel. If both sliders were on a single increment, it would only show that block of content. If they were all the way out to both ends of the slider panel, it would show all four blocks of content, etc. I'm struggling
Updating html content dynamically: I can't get jquerymobile styles applied on dynamically generated content, such as buttons
document.getElementById("REQLIST").innerHTML =" <input type=\"text\" size=\"30\" onclick=\"stop_chat_update()\" onchange=\"stop_chat_update(); \" name=\"ChatInput\" id=\"CHATIN\" style=\"font-size: 22pt;\" />"; document.getElementById("REQLIST").innerHTML +="<input type=\"button\" onClick=\"update_chat_with_user()\" value=\"Update\">";
UI Sortable - moving items between columns
I'm attempting to assign students from "unassigned" column to "Class 1" column, "Class 2" column, etc. by dragging, and I'd like to update the underlying MySQL database with the changes. Can I do this with Sortable?
which item I'm over?
Hi everyone, when i'm dragging the draggable 'tag' Is there any way to know over which item of the droppable tags I’m hovering? Here is my code: <script> $(function() { $ ( "#draggable" ).draggable(); $( ". UI-Drop" ).droppable({ drop: function( event, ui ) { } });
UI Tabs unbind?
Currently I have an application have I have tabs for 1 section, then I remove the HTML ( and the div that was affected with the $.tabs() ), load up new tabs ( each tab loads via ajax ), then re-bind $.tabs() to the same div id. Basicly redoing the tabs. So far the effect of doing this is that UI is making "New" tabs for each reload. ( I inspected the elements using Chrome, and it was going upwards of #ui-tabs-16 at the time. So is there a way, I can "Un-bind" the $.tabs() function so it'll stop incrementing?
jQuery UI Sortable overlapping with css-overflow flickering
Sortable overlapping with css-overflow flickering. Firefox 3.6 The problem I've countered is represented in jsfiddle - http://jsfiddle.net/peterthegreat/B6Fae/ Take one of the top "Youtube"-links and drag them around and you will notice some flickering because the element is struggling between the overflowed hidden elements and the parent-div.
jquery-ui sortable “overlapping” flickering issue
Hi, everybody! I'm a frequent jQuery user and has used it for a year or so, but there's one problem which I can't figure out how to deal with except by overriding some sortable-jquertui functions which I would not like to do. Anywho I originally posted on StackOverflow but feel like I need to ask for help from "the source" itself. I'm sorry for using a link to my actual question but it's a pretty heavy post which makes it seem stupid not to just refer to it. The link: http://stackoverflow.com/questions/5204047/jquery-ui-sortable-overlapping-issue
jquery-ui 1.9m4 and menu
hello, many thanks for jquery ;-) and ui i am new on it and i would like to test and use the new widget Menu. i found a wiki page on it [url]http://wiki.jqueryui.com/w/page/12137997/Menu[/url] but i can't find any example of MenuBar (menubar [E2] number for visual design). Could you provide me some code example for it regards
UI Autocomplete combobox
I have a form that uses the autocomplete combobox for 3 different selects. Two of the selects look good but for one the input and button do not exactly line up - the input is 1or 2 pixels taller than the button. This happens in both FireFox 3.6x and IE 8. You can see the behavior on the combobox demo page, http://jqueryui.com/demos/autocomplete/#combobox. Any ideas why this happens and if there is a way to at least have them display consistently.
Hyperlink and button on accordion header panel?
Hi All, Greetings. I have an application where i am using accordion panel. I want to put hyperlink and buttons on header parts of accordion panel.But the issue is when i click on links by default accordion panel gets expanded.But i want to navigate to another page when respective buttons and links are clicked which are placed in headers of accordion panel rathere than accordion panel to expand.I am using accordion UI available in jquery library. Now, is this possible to put hyperlink and button
Trouble with hide('slide');
So I suspect I'm doing something really stupid, but... I have the following line of code: $('.' + class).hide('slide'); Which works as expected, sliding the object to the top left. After that, I tried $('.' + class).hide('slide', { direction: 'left' }); And it failed. I tried copying the exact code from the jQuery documentation and that failed. I tried including a 500 at the end for a time and that didn't work either. Am I missing a detail here? Hopefully someone can help me figure out where I'm
JQuery Tabs Ajax not working on IE7 when loading same page with different parameters
Hi, I am trying to implement jquery ui tabs in ajax mode as shown in http://jqueryui.com/demos/tabs/#ajax. Only difference is , all my tabs urls load the same page with different parameters. This works perfectly fine on Firefox but it is not working on IE7. Please see the output on firefox and IE7 in the attached screen shots . Can somebody help fix this issue? Thanks in advance. Here is my code. <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <link href="../Styles/JqueryUI/redmond/jquery-ui-1.8.10.custom.css"
Modal Box
Hi, I want to close modal box after 15 seconds,,, can anyone help ???
Jquery Accordion not working in IE7, Syntax Issue?
I built a site that uses using jquery accordion, with some simple functions that control accordion from external navigation links. Ive tested it in all browsers with no problem, but in IE7 the accordion loads completely open and I have no idea why as I am not experienced with JavaScript. using jQuery v1.4.4 below is my code. <script> jQuery().ready(function(){ $('#slide-menu').accordion({ autoHeight: false, navigation: true, active: false, collapsible: true ,
Overlapping sortables, wrong drop target
I have a somewhat complex drag and drop scenario, that's revealing a bug in the jQuery UI Sortable code. This happens in 1.8.9, but I have reason to believe it may have existed in earlier builds as well. Say you have two sortable targets, one above the other. --------- Area 1 --------- Area 2 --------- As you drag your element around, usually the placeholder appears in the correct area. The exception is when you drag the element to the final position in either list. In that cass, there is a scenario
Shadowbox + Jcrop OR imgAreaSelect + jQuery UI + IE9
Hi, I have noticed a wierd bug when I am using these plugins. Here is my scenario. A user clicks on a link to crop an image. The image is being displayed in a Shadowbox popup, which loads another page that has either Jcrop or imgAreaSelect loaded with jQuery UI. The problem seems to happen only in this specific case and it only seems to happen on IE9 with jQuery UI when I load the CSS stylesheet. You can see the example here: http://simplecommerce.com/test-shadowbox.html I am using latest
autocomplete is firing when ctrl or alt key is pressed
hi there, I have a strange problem , i am using jquery ui autocomplete. After the selection from the result returned. if user press ctrl key or alt key(and some other keys) its sending call to server. what is this?? here is my code. secondly how to handle if no data is returned from the server. here is how i am using. $(function() { var selecationMade = false; var local = {}; $("#txt").autocomplete({ minLength: 3, delay: 100, search:
UI Tabs : perform action before changing tab
Hi all, I've got a small issue maybe you can help me. I'am using tabs with ajax loaded content. In these content I've got forms, and form values are being saved in session every 30 seconds. I've got a js function autosave() being triggered every 30 seconds, but I also want that function to be triggered when I change tab. I added the autosave into the select: of my ui Tabs, but I only want the new tab to be loaded only after my autosave is complete. Could you help me do this? here is what I've got
Use draggable & droppable in a table
Hi all, I'm trying to use draggable and droppable methods in a personnal website but having some problems... My objective is to move content of a cell to an other cell as many times i want... For now I can move this content, drop it to an other cell, move the new content but i can't drop it again anywhere... Each cell look like this : <td> <div class="cell ui-droppable ui-sortable"> <div class="postit ui-draggable"> THIS TEXT CAN BE MOVED </div> </div> </td> My
How to use a datepicker?
The datepicker I want on my page needs to be regionalized and when the user selects a date, the selected date should be displayed in an alert. Seems quiet simple. I tried with the following code. The selected date is shown, but the regional settings are not applied to the datepicker: $("#myDatepicker").datepicker({ onSelect: function(dateText, inst) { alert(dateText); } }); $("#myDatepicker").datepicker($.datepicker.regional['nl']); When I switch the statements, the behavior
Editing Jquery dialog
Hi All, I have web page on which i have add button on click of add button it opens dialog box where i have some date to be entered after antering the data all the data will be saved as table format for every column and row of the table we have a hyperlink and when we click on it should open the dialog with the data entered ,so we can make changes to the data entered,can anybody give me solution for it. Thanks
Extracting a to and from date from datePicker
Using the datePicker range how do extract a from date and to date so I can us them as parameters to send to a Stored Proc? This is the code I used to build the datePicker. It work fine. <head> <meta charset="utf-8"> <title>jQuery UI Datepicker - Select a Date Range</title> <link type="text/css" href="/css/ui-lightness/jquery-ui-1.8.10.custom.css" rel="Stylesheet" /> <script type="text/javascript" src="../js/jquery-1.4.4.min.js"></script> <script type="text/javascript" src="../js/jquery-ui-1.8.10.custom.min.js"></script>
Dialog UI with html text
I am new in the JQuery world. My queation is how can I put in html code into the dialog box? Cheers Daniel
background-attachment
I want the background to stay fixed, while the content scrolls over it. Does the background-attachment declaration work as expected when used on the page element? It doesn't seem to when using a iPhone 3g, running iOS 3, and I've gathered information from other sources saying it has to do with the way the viewport is rendered. I haven't found much information beyond this, can anyone shed some light?
deleting records and reloading
I am using the the modal form method of jquery ui (http://jqueryui.com/demos/dialog/#modal-form) to add notes to a record. The notes are shown via an included file. I want to put a method to delete a particular note from the list w/o leaving the page. I cannot send pages b.c they are inside a protected site but here is the basic layout.. <page> $("div##notesDiv").load("inc/incNotesList.cfm",{ID:"#url.clientid#",table:"client"}); $('div.dialog-form').dialog({ autoOpen: false }); $("#addNoteBtn").click(function
Style range slider handles
Sorry if I have already posted this (I don't think it went through before my browser crashed!). I currently use this code: $(document).ready(function() { handle = $('.slider A.ui-slider-handle'); handle.eq(0).addClass('left-handle'); handle.eq(1).addClass('right-handle'); }); to add a class to the left and right handles of my range slider but if I add more than one slider to the same page this code only seems to add the classes to the first slider on the page and not all
iframe and jquery ui tabs
I am testing a web page that uses an iframe to call a page that uses jquery ui tabs and ajax to load content. The page works fine in chrome and firefox, but not in internet explorer inside the iframe. It will work in IE when it is not in an iframe. Does anyone know why and how to solve it? The parent: (http://www.commonbond.org/test_bed.aspx <iframe src="http://commonbond2.pegasus.webaloo.com/development-bundle/demos/tabs/ajax.html" width="100%" height="300" scrolling="yes" id="mainframe"> <p>Your
charset in jquery ui
hi, I'm get data from a form in jquery ui dialog. A string can contains chars like 'à' 'è'. I've a problem when saving on db, because charset in the page is ISO-8859-1 but characters are not saved in the db as ISO characters, but in other charset. Why does it happen??
Why the dialog is not showed?
Hi every: I'm trying to setup a modal dialog on my site. This is the code I'm using: <script type="text/javascript" src="view/javascript/jquery/jquery-1.5.min.js"></script> <script type="text/javascript" src="view/javascript/jquery/ui/ui.core.js"></script> <script type="text/javascript" src="view/javascript/jquery/ui/ui.dialog.js"></script> <script type="text/javascript" src="view/javascript/jquery/ui/ui.resizable.js"></script> <script type="text/javascript" src="view/javascript/jquery/ui/ui.draggable.js"></script>
Tabbed Panes show just hyperlinks, no interface
Hello, I want to use jQuery for Tabbed Panels. I do the following. It does not work. I just get the links and and text text below it. I am new to using this. <link type="text/css" href="template.css" rel="stylesheet" /> <script type="text/javascript" src="js/jquery-1.4.4.min.js"></script> <script type="text/javascript" src="js/jquery-ui-1.8.10.custom.min.js"></script> <script type="text/javascript"> $(function() { $( "#tabs" ).tabs(); }); </script> <div
Best way to override default jQuery UI icons?
I love the jQuery UI icons but they are just too small for my particular needs. I develop educational lessons for kids and they need big icons. I have hacked up my own solution but it hard to maintain. I took the jquery ui sprites and increased each by a factor of 3. I then went multiplied all the css dimension information by the same factor. I also have to tweak my own css to position the bigger icons properly. Is there an easier way to do this?
jQuery Themeroller Drupal Integration Guide
Hi Folks, For the last hour I've been Googling, searching, and otherwise scouring the 'net for instruction about how to integrate a jQuery Themeroller theme into Drupal, with no luck. Would someone kindly direct me to the best resource available? Thanks for your help!
Dropover event not firing intermittently on adjacent acceptable droppables
I have an issue on drag & drop when I have a draggable div that has 2 droppable targets that are almost right next to each other. When dragging the draggable element somehow fast from one droppable to the other, I can see that the event dropout fires on the one div where the draggable left, however, sometimes I don't get the dropover on the next div. If I do it slowly it works (both dropout and dropover get fired) . I am using jquery-ui 1.8.6 and droppable tolerance pointer.
How to: Update dialog div with new content from json
I am attempting to update the div of my dialog with new content from a json array and am encountering issues and am requesting some guidance. I output a json array which has labels for a 'Name' and a 'Definition'. A user is presented with a list of radio buttons. When a user clicks a radio button which has the following structure: <input type="radio" value="23" name="statistic" id="stat-23" />I take the value of the radio button and use this to identify which 'Name' 'Definition' pair I am referring
Binding droppable images to a dynamically created node
All, I was looking at the following post: http://forum.jquery.com/topic/how-do-i-bind-the-droppable-event-to-dynamically-created-nodes I added a question to the bottom of it but it says it was answered so I don't know if anyone looks at it. So here is my question again. The links that are supplied: Demo: http://jsbin.com/obopo3 Source: http://jsbin.com/obopo3/edit Are a very good start, but what I would like to do is alter the code in the links so that I can pull the text (in my case I want to have
jQuery 1.9 roadmap
We're using one of the 1.9 milestone releases for a project because of the new tooltip functionality (Thanks!) I'd like us to get back to using a "stable" release sooner than later, though: What's the current roadmap for 1.9, in terms of making it the a stable release? Also, do the later milestones releases for 1.9 include the code for the latest 1.8 stable at that point? Thanks.
Can I save a reference to a Tab in UI?
I was planning a project: 4 main tabs are to be primarily displayed, and if the user clicks on some inner tab content, based on said content it would make a New tab, and open that one. My page displays a list of database items, each have an "Full View", "Edit" and "delete" button to their ids. I want the 1st two options to open in a new tab, and if the user clicks a different item to load into that tab "Type" it was created for basically. I know how to make a new tab, and how to display the newly
Next Page