Visited state for the UI accordion
I implemented a FAQ page with the accordion from jquery-ui-1.8.11. It came out ok - http://www.steveswebshopphp.com/upaya/FAQ.html. But one thing that I wanted to implement but couldn't is a visited state for visited questions. That is, after you've opened, read and closed one question I'd like for that question to have a different text appearance so the user is reminded that they've already opened and read that question. But the accordion code seems to clear the visited state of the link in
datepicker question
Is there anything in datepicker that allow me to block some days? like this i wont to allow users to select anyday except saturday and sunday, and hollydays, and other no workday
How do I remove the default trigger element in UI Accordion?
I need to know if I can remove the default accordion trigger element, which is currently set as <H3>. I know you can declare other elements or their id/classes as triggers, but I need to remove the <H3> element from triggering the accordion function. The reason is I am setting up a master CSS sheet that needs to be viewable in an HTML environment. The CSS styles will, of course, include all the <H1-6> elements. Clearing this trigger will allow the <H3> CSS sample element to show properly. I want
JQuery / JQueryUI upgrade breaks Tabs AJAX calls (WRONG_DOCUMENT_ERR)
I have a chrome extension that works fine. I went to perform some additions to the functionality, but though i would first upgrade the Jquery and JQueryUI to the latest releases and retest. This breaks the extension. I have a Tab panel with 4 tabs, 2 tabs are static and 2 are href'd. The 2 href'd tabs fail to load (remain blank) and in the chrome console i get the WRONG_DOCUMENT_ERR message. I am moving from V1.4.2 and V1.8.2 (UI) and was taking them up to V1.5.1 and V.8.11. You can see a sample
nested accordion only shows one option i.e. not fully expanding
Hi, I'm trying to setup a jQuery UI nested accordion for site navigation. The nested accordion opens/expands showing only one option, while there are two in the child according list. I cannot figure out what the problem is here. I've tried all the options as clearStyle: true and autoHeight: false, but than the accordion is not working at all. Can anyone help or is this a known bug ? this is the code: jQuery(document).ready(function(){ $("#accordion").accordion({ active: false, header: 'a.head',
split button ajax function example
I wrote a function to streamline the creation of drop-menus that conform to jQuery UI (a split button with drop-down). Simple menus based on an array of strings are possible. As are ajax-driven menus. And I've allowed the linking of menus -- a sub menu that can update (via ajax) when a choice is made on the primary menu. http://chasefox.net/jqui/drop_menu/ enjoy. This is a working first draft. It is intended to be used as a form field, but that portion hasn't been completed yet.
Attach ui-widget to dynamic element
When dynamically creating a div using an .ajax() function. I'm unable to attach the .tabs() widget to the newly created <div>. This link creates the new div and pulls the #tabs div from "somefile.php" <a href="newdiv">Creates New Div</a> <div id="newdiv"> <div id="tabs"> <ul> <li>Example One</li> <li>Example Two</li> </ul> </div> </div> Here is the script I'm using. Output - Error: (d || "").split is not a function $( "#tabs" ).live(function(){
apply datepicker to input element in a hidden div
I am applying a datepicker to an input field in a hidden div that is a jquery dialog that will be opened by another trigger. The same code on one shared hosting (aruba.it -> www.parrocchiasanlino.org) works fine, while on another shared hosting (altervista.org -> consultapg33.altervista.org) the datepicker isn't hidden like it should be. It's appearing where the hidden div is on the page, towards the bottom of the page. I'm not seeing any particular error messages in firebug in this regard either,
How to simply integrate a customized jQuery Theme made with ThemeRoller in Drupal 7
I'm a pretty noob in Drupal as well as in jquery. My knowledge in html is average and in css rather little. In php I can copy / paste a code snippet but not much more until now. So I've been trying everything out for a couple of days to simply get some jquery script working as desired in Drupal 7. I started with a simple accordion snippet and I finally managed to have it work. (Maybe it's something to obvious for having some guys writing a understandable 'how to' about it for dummy newbies...) Now
Can i retrieve an css attribute from a rule, in a LINK tag stylesheet ?
I don´t know if i am in the right way. I wish to extract some features of the "theme" link tag and them apply in other elements. For example, extract backgroundColor from rule .ui-widget-state-active, work in that color and them apply it in a color of other element. In fact, i wish generate a style tag, completing theme stylesheet, but using some collors directly from the choosed theme. Is it possible without tricks ?
Widget Factory _setOption
When working with jQuery UIs Widget factory is it considered standard to provide _setOption functionality for every option available at instantiation? The reason I ask it because I'm finding myself adding a shed load of bloat to my widget just to allow option changes that, in all honesty, I can't see being used after instantiation? Any advice? Rich
Jquery autocomplete
iam developing a simple jquery-Html 5 application with mysql database.How i can connect the autocomplete extender to the function which retreiving details from database(ex: city collection).
Unable to configure the UI Accordion
I copied the accordion code from the jquery UI documentation into a new .html file and the accordion works. But when I replace the text in one of the divs with a larger paragraph, not all of the text is shown when that div is opened. Instead, it's cut off and a scroll bar is provided at the right of the window to see the rest of the text. I tried defeating this behavior by inserting the jQuery line $( ".selector" ).accordion({ autoHeight: false }); as the
[solved] Can't get custom options to update from default
I have script (http://jsbin.com/ifoke5/31) that adds some extra capabilities to the dialog widget. Everything works fine on default settings but if i use the following: $('...').dialog('option', { 'scrolling': false}); the default value is still assigned //option.scrolling: auto What am i missing? ~Thanks in advance.
toggle custom theme button
Hi - How do I make my custom theme show up 1st, without having to click the toggle custom theme button to view it in its entirety ?? ex is) http://layout.jquery-dev.net/demos/layouts_inside_tabs.html Now, for example, I have my own custom theme designed from the Themeroller and it shows up when I toggle over, but i dont wanna click the toggle button for it to show up...how do i set this up? Thank you in advance - Don -
Ajax with JQuery
I am currently building a room booking web application for a school (as a school project) i currently have a index page with a div as follows: HTML Code: <div id="page_content"> </div>this area of the page is used to load in external php pages with generate contnent for a database i am currently using jquery to load the content in: Code: $('#Rooms').click(function(){ $('#page_content').load('rooms.php'); });within the rooms.php file there is a jquery datepicker the problem i am having is making the
Buttons not getting displayed
Hello, I'm pretty new to javascript and jquery/jqueryUI but of course trying to learn. In my project i'm adding some buttons that I want to display with the aid of jQueryUI, but unluckily even if to me what I did pretty resembles what's in the radio buttons demo, it still won't work at all. First of all, I of course added the css both for my page and jqueryUI: <link rel="stylesheet" type="text/css" href="css/webgeocss2.css"> <link rel="stylesheet" type="text/css" href="css/blitzer/jquery-ui-1.8.11.custom.css">
UI.TABS remove method - additional option to select specific tab after removal
One of the problems with the remove method of jquery ui.tabs is that after deleting the tab it either selects the tab on the right or if it is the last tab it selects one on the left. My initial impression was that I could change this behavior by calling the select method in the 'tabsremove' event. But that does not work as the default selection takes place before the event is fired as indicated in the source below: remove: function( index ) { index = this._getIndex( index );
UI Dialog : Google Chrome problem with youtube
Problem is that youtube link reloads page on chrome and not on firefox? Thanks. var link = "http://www.youtube.com/watch?v=QU5DhngJfr8" var object = '<object height="385" width="640">' + '<param value="'+link+'" name="movie">' + '<param value="true" name="allowFullScreen">' + '<param value="always" name="allowscriptaccess">' + '<embed height="385" width="640" allowfullscreen="f" allowscriptaccess="always" type="application/x-shockwave-flash" src="'+link+'">'
jQuery UI Demo JS error in IE
Is it me or the jQuery 1.5.1 & jQueryUI 1.8.11's demo addClass have compatibility issue with IE? Demo http://jqueryui.com/demos/addClass/ jsBin http://jsbin.com/equba5
How to set multi-selectable as default mode
Now we can press ctrl button to multi-select Selectable interactions. Is there way to set multi-select Selectable interactions as default mode. we don't need to press ctrl key to get it. Thanks Tim
Problem with dialog demo code
I'm extremely new to jQuery, although not new to javascript in general. I'm trying to use the UI dialog widget. I've downloaded a .min.js file containing the dialog widget and a few others, and already have the core .min.js. I copied the demo code directly from the UI doc for modal form and pasted it into a plain html file. Clicking the button does not work; nothing happens. Also, the form that's supposed to be displayed in the dialog shows at the top of the page. Can anyone tell me if there's something
Accordion not working?
The problem is that it's just not working. I don't know jquery very well, I'm using it to finish up this site I've been working on. anyways here is the code: This is the <head> code referring to it. <head> <meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <title> Marnee Music </title> <link rel="stylesheet" href="style.css" type="text/css" media="screen" /> <script type="text/javascript" src="js/jquery1.5.11min.js"
distinguish between sorting same list and connected list
Hello i want to distinguish between a sorting in a list itself or when an item from a list is placed in another list: <ul class="connectedSortable"> <li>Item 1</li> <li>Item 2</li> </ul> <ul class="connectedSortable"> <li>Item 1</li> <li>Item 2</li> </ul> The problem is that the list are dynamic so now there are two ul's and tomorrow it could be 5 or 4 etc I am not able to distinguish if a sorting take place in the same ul or if a li item is moved to another ul when using a class connectedSortable.
Re-creating jquery-ui elements after xhr update
Hi all, I have a function (createButtons()) which executes on document.ready, which selects button elements and creates a jquery UI button, and attaches an event handler for the click event. This all works until I update the part of the page via an ajax call. The buttons returned in that aren't being detected by the original createButtons() function. Adding a call to the createButtons() function in the ajax updaters success function doesn't re-initialise the buttons. Is it possible to do this? Thanks
Using range slider to query records from db
I'm very new to all of jQueryUI and I've played very little with javascript and Ajax. My background is mostly PHP and MySQL. that said, here is the task I would like to perform... using jQueryUI Slider (range) 1) Main page PHP: Query a range of values from the database for the max and min values and set those as the max and min value for the slider. 2) as the slider range is changed have the min and max values adjust the "where" conditions on another query to pull up other values that fall
Using Resizable and Draggable with Containment
When I add resizable() and draggable(), or even just draggable() with containment, the element get a margin-right that matches the extra space from the right side of the element to the bounding box of the parent on the right side. So a <span> that is 100px wide inside a <div> that is 500px wide, ends up with a margin-right:400px. At this point, i cannot move the element laterally, only vertically. Is there a way to avoid this? The kicker is when I have resizable() on the the same element, and
Problem in obtaining a value from a combobox
I have a series of comboboxes from which I have an issue getting the selected value. I have fudged this by setting up a selected event and setting the value to a local variable and I would like to stop using that. I have looked at this for hours and I know it will be something simple. My combobox code is posted below. Thanks in advance. (function( $ ) { $.widget( "ui.combobox", { options: {phpfile:null, opid:1 }, _create: function() { var self = this; var select
ajax tabs inside accordion-
If the ajax tabs content loads slowly, my accordion collapses. if i click again on the accordion i see my tab has fully loaded. how can i prevent the accordion from collapsing? (but i DO want collapsible : true) thanks from jennifer
how to add custom images to jquery tabs?
hello, i have 3 tabs and i would like to add custom images on the tabs that change when the tabs are active or not. like this my layout is like this: <div class="tabs"> <ul class="tabNavigation"> <li><a class="ep-messages" href="#first">Firstddddd</a></li> <li><a class="ep-friends" href="#second">Second</a></li> <li><a class="ep-alerts" href="#third">Third</a></li> </ul> <div id="first"> <h2>First</h2> <p>Lorem ipsum dolor sit amet, consectetur
How do you close the accordion in default?
How do you close the accordion in default? http://jqueryui.com/demos/accordion/#mouseover its open as you can see in default. can anyone help , Im still new using jquery UI framework. any help is appreciated
highly functional draggable + sorttable - where the drag only sorts upon snap
I know this is very very specific. I have been trying to write this code for the past 2 days and i am getting nowhere. heres my scenario: I have a list of 10 images, left to right. I want a user to be able to drag the li's wherever they want on screen individually, but also if they are near the original container snap to the container and start sorting inside of it. when they stop dragging if they are not 'snapped' to their original container i want to not revert, but stay afloat wherever on screen
jquery ui datepicker input not posting to PHP
I'm having problems posting the selected date from the datepicker. I want to add it into my form so people can simply select a date and it will insert it with the form into the mysql database. It works fine sometimes... but when other people use it or I try on random machines it will just post "0000-00-00" as the date. Here is how I'm doing it: (I've trimmed alot of unimportant info from it) <?PHP mysql_connect("localhost", "xxx", "xxx") or die(mysql_error()); mysql_select_db("xxx") or die(mysql_error());
Get all dialogs listed
Hi, I was wondering is there a way to get all dialogs and close/open them with a button that has .live("click") set to it? Tried using this $("button").live("click",function(){ $("div.ui-dialog").dialog("close"); });but it didn't work. Edit Got it working, here is the code (if someone want's it) $('button').live('click', function(){ $("div.ui-dialog").each(function(){ var id = $(this).attr("aria-labelledby").replace('ui-dialog-title-',''); $("#"+id).dialog("close");
Accordion fillSpace problem - it would show the whole content!
Hi I am a pretty much a newbie to jQuery and I need some help please! I am using the jQuery UI accordion menu and also using the fillSpace feature, so the accordion will conform its size to the size of the content. I am pulling an html document in via AJAX, and I know that I need event delegation to retrieve the new value of the window, but I have no idea how to do it. $('h3').click(function(){ var header= $(this).text(); nextdiv= $(this).next('div'); nextdiv.load(header + "-AJAX.html"); In
jQueryUi table resize problem
my code already works but it i still need some help.my aim is to drag the red div and resize all affected rows. first row works, but all rows under the first one were ignored. does anybody have a hint ? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
newbie - events on datepicker
Sorry, very new to JqueryUI and this is a simple question. I am using the datepicker inline and I'm trying to retrieve the selected data value but can't figure out where I'm going wrong? Any help greatly appreciated. $(function(){ // Datepicker $('#datepicker').datepicker({ inline: true }); $('.selector').datepicker({ onSelect: function(dateText, inst) { alert(inst.value); } }); });
jQuery Accordion - on page load, all open then close
I apologize if this has been asked before. I am using the accordion on a menu and have its default set for all to be collapsed. However when the page first loads, all of them are expanded, then they all collapse as they should be, this makes the page really jump. I am sure this is happening because the page loads....then the jQuery runs to collapse the menu, is there something I can do so this does not happen? Code from aspx page: <div id="navigation"> <h3 class="first"><a href="#nogo"
error ids
Good morning, I am working with jquery 1.5.1 and ui 08/01/1911, and found a problem, when the tabsare created for the first time the forms within them I work and identifiers of each well, butwhen I go through another menu re-create the tabs, the identifiers are exhausted and thefailure to produce the information, and I take the values of the fields by their IDs, anyone can help me with that, thank you very much beforehand. One more thing sorry for my English.
Need your help regarding jQuery UI tabs
Hello, My name is Aamir (mostly on #jquery and ot). I have created jquery scrollable tabs http://jquery.aamirafridi.com/jst/ using jquery 1.4 and jQuery UI 1.8.1. It worked as you can see but for your ease I have create a quick demo page: http://jsbin.com/obiko/55/edit When you updgrate jQuery to 1.5 it still work so nothing wrong with jQuery 1.5 but jQuery UI 1.8.9 is not happy with this and it breaks the plugin. http://jsbin.com/obiko/56/edit All i want is to wrap the <li>s of tabs titles and than
Next Page