Re: [jQuery] Using add/remove class vs. show hide for a swap out section?
It would really help if you could post a link to a test page instead of posting code excerpts. For example, I don't see any HTML code that has id=link-about and your other links. Is that missing from your page, or did you just omit it in the code you posted? Are the LI elements supposed to be those links? In any case, since I can't help you get the code working, at least I can help you simplify it. Let me assume that those LI elements are your links. Then I would change them to this: ul li class=clicklink id=link-about # About /li li class=clicklink id=link-work # Work /li li class=clicklink id=link-ramblings # Ramblings /li li class=clicklink id=link-contact # Contact /li /ul and I would change your JavaScript - it's not Java, please :-) to: $(document).ready( function() { $('li.clicklink').click( function() { $('div.content').addClass('hide'); $( '#' + this.id.split('-')[1] ).removeClass('hide'); }); }); If that .content class is also used on other elements in your page, then I would another classname to your four content targets and change the $('div.content') to use that classname instead. -Mike On Tue, Nov 24, 2009 at 7:20 PM, rorourke r...@pixelbleed.net wrote: I'm mostly a CSS/HTML guy, so delving into jQuery is a bit more then my normal task list would contain, but I'm happy to suck up any knowledge that you may be able to impart. Here is my scenario: I have four div's each has a different class in additon to the .content class (which controls font and link styles for each of them), .about, . work, .ramblings, .contact. Each of these classes is by default shown. But I've applied a class of .hide to all the ones after .about, which is the default shown. What I have seems to work for the first link clicked after page load, but after that nothing is happening. I would like, whenever a link is clicked to show that sections div and hide the other three. I never want more then one section showing. This adding classes business or even just using the .hide() .show() functions doesn't necessarily work because the java for the ID has to handle every situation on any given click. Markup looks like this: ul li # About /li li # Work /li li # Ramblings /li li # Contact /li /ul div class=content about pYada/p /div div class=content work hide pYada/p /div div class=content ramblings hide pYada/p /div div class=content contact hide pYada/p /div Java looks like this: $(document).ready(function() { $('#link-about').click(function(){ $('.about').removeClass(hide); $('.work').addClass(hide); $('.ramblings').addClass(hide); $('.contact').addClass(hide); }); $('#link-work').click(function(){ $('.work').removeClass(hide); $('.about').addClass(hide); $('.ramblings').addClass(hide); $('.contact').addClass(hide); }); $('#link-ramblings').click(function(){ $('.about').addClass(hide); $('.work').addClass(hide); $('.ramblings').addClass(hide); $('.contact').addClass(hide); }); $('#link-contact').click(function(){ $('.about').addClass(hide); $('.work').addClass(hide); $('.ramblings').addClass(hide); $('.contact').removeClass(hide); }); }); -- View this message in context: http://old.nabble.com/Using-add-remove-class-vs.-show-hide-for-a-swap-out-section--tp26506957s27240p26506957.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] accDND: The Keyboard and Screen Reader Accessible Drag and Drop Plugin
http://plugins.jquery.com/project/accDND About accDND is a keyboard and screen reader accessible drag and drop functionality plugin for jQuery. Features include: a.. Dragging selected options between unlimited Select fields by pressing the drag key (`), or cancel (Escape) to stop dragging. b.. Optional flashing status messages to enhance user interaction. c.. WAI-ARIA support to enable automatic announcement of status messages for screen reader users. d.. Dynamic screen reader accessible hidden text to ensure accessibility for assistive technologies and browser versions that don't support ARIA. Details accDND was created to provide a fully accessible method for keyboard users to drag options between unlimited Select fields on a page. Though it is possible to create the same keyboard functionality for divs, links, images, table cells and rows, lists, and more, accDND is restricted to form Select fields for brevity. Since the plugin effects keyboard usage only, you can use both accDND and a mouse-driven drag and drop plugin on the same select fields without causing conflicts. WAI-ARIA has been implemented to allow supporting screen readers to announce status messages as they appear. Moreover, you can optionally prevent status messages from appearing visually, yet supporting screen readers will continue to announce the status messages to ensure accessibility. (All status messages are customizable and optional.) Unfortunately however, screen readers still have quite a ways to go before ARIA is considered a fully viable accessibility solution. For example, a.. accDND status messages work well using JAWS10+ with Firefox, yet the functionality is unreliable and spotty when using JAWS11 with IE8; b.. accDND status messages don't work at all when using Window Eyes7.1 with either Firefox or IE8. (Additional screen reader tests would be appreciated.) Hopefully these assistive technologies will continue to improve their ARIA support in the future. To ensure backwards compatibility with assistive technologies and browser versions that don't support ARIA, a screen reader accessible intro message is automatically inserted into the page during the setup process. Both the formatting and DOM positioning of the intro message is designed to ensure accessibility for screen reader users. For example, each intro message is surrounded by an H3 tag to allow screen reader users to quickly jump between each of these sections using the header navigation commands. This also conforms with the WCAG's guidelines regarding the proper ordering of section header markup. (The screen reader accessible intro message is completely invisible to sighted users, and has no effect on the page layout.) Instructions 1.. Simply ensure that all dragable form Select fields share the same class name. (class=ClassName) Also, you can include multiple groups of dragable selects by giving each group a unique class name. (View the demo to see an example.) 2.. Within the head tag, include: script type=text/javascript src=jquery.acc.dnd.js/script (After the script instantiating jQuery.) 3.. After the page loads, call accDND like so: $('select.ClassName').accDND(); Customization accDND is fully configurable using the following syntax: $('select.ClassName').accDND({ // The default drag toggle key is ` // Important: When changing this value, be sure to pick a key that has no screen reader hotkey conflicts. dragKey: 96, // The default cancel key is Escape cancelKey: 27, // Display visual status messages. // When set to false, status messages will be announced to screen reader users regardless, invisibly. smShow: true, // Visual status messages will disappear in n milliseconds. smTimeout: 1500, // Status messages. // To stop individual messages from being shown, pass a value of smCanceled: 'Dragging canceled', smDragging: 'Now dragging', smDropped: 'Selection added', smErSame: 'Already dragging', smErMismatch: 'Cannot drag to this list', smErNothing: 'Nothing selected', smNoticeDrag: 'Dragable', smNoticeDrop: 'Droppable', // This message is important for screen reader users, who will encounter the message when arrowing down the page. // Be sure to update this text if you change any of the default hotkeys. smIntroForScreenReaders: 'Press the %DRAG% key to drag items from one list to another, or press Escape to cancel dragging.', // Visual styling for the status messages. smCSS: { fontSize: '0.8em', fontFamily: 'Verdana,Arial,Helvetica,sans-serif', fontStyle: 'italic', backgroundColor: '#C0C0FF', border: 'solid thin black', color: '#228b22', position: 'absolute', zIndex: 10 } });
[jQuery] Re: (this[0].ownerDocument || this[0]).createDocumentFragment is not a function
thanks, i registered a $.temp var outside of my get function and now it works! $.temp = {}; $(this).bind(click, function(e){ $.temp = $(this); $.get(main.php?action=getEventDetails,},function(data){ $.temp.html(data); }); });
Re: [jQuery] Hi
in rails there are somany plugins On Wed, Nov 25, 2009 at 1:25 PM, Raju raju3...@gmail.com wrote: Hi All, I need a chat script to embed into my website, can anyone help me to find the script, Warm Regards, Mari Raj K,
Re: [jQuery] Re: (this[0].ownerDocument || this[0]).createDocumentFragment is not a function
I'd like to point out here that you don't really need to place this variable inside the jQuery namespace, you don't even need to enable it to get out of its scope by making it global, so you may do something like that : $(this).bind(click, function(e) { var temp = $(this); // this is a local variable, outside the scope of the function where it's declared it isn't registered anymore $.get(main.php?action=getEventDetails,},function(data) { temp.html(data); // though this anonymous function used as call back has been declare in the scope of temp's holding function, therefore temp is still declared and still holding the reference to former $(this) }); }); And it will still work, temp stays declared as long as the callback needs it, but it doesn't get out from your click callback so no pollution of any namespace or outer scope. Michel Belleville 2009/11/25 coffeecup gocoffee...@gmail.com thanks, i registered a $.temp var outside of my get function and now it works! $.temp = {}; $(this).bind(click, function(e){ $.temp = $(this); $.get(main.php?action=getEventDetails,},function(data){ $.temp.html(data); }); });
Re: [jQuery] accDND: The Keyboard and Screen Reader Accessible Drag and Drop Plugin
Hello Bryan and all, Thanks for that info! You're screenreader-aware... and it's great! -- With best regards from Ukraine, Andre Skype: Francophile; WlmMSN: arthaelon @ yandex.ru; Jabber: arthaelon @ jabber.org Yahoo! messenger: andre.polykanine; ICQ: 191749952 Twitter: m_elensule - Original message - From: Bryan Garaventa goo...@gutterstar.net To: jquery-en@googlegroups.com jquery-en@googlegroups.com Date: Wednesday, November 25, 2009, 10:46:57 AM Subject: [jQuery] accDND: The Keyboard and Screen Reader Accessible Drag and Drop Plugin http://plugins.jquery.com/project/accDND About accDND is a keyboard and screen reader accessible drag and drop functionality plugin for jQuery. Features include: a.. Dragging selected options between unlimited Select fields by pressing the drag key (`), or cancel (Escape) to stop dragging. b.. Optional flashing status messages to enhance user interaction. c.. WAI-ARIA support to enable automatic announcement of status messages for screen reader users. d.. Dynamic screen reader accessible hidden text to ensure accessibility for assistive technologies and browser versions that don't support ARIA. Details accDND was created to provide a fully accessible method for keyboard users to drag options between unlimited Select fields on a page. Though it is possible to create the same keyboard functionality for divs, links, images, table cells and rows, lists, and more, accDND is restricted to form Select fields for brevity. Since the plugin effects keyboard usage only, you can use both accDND and a mouse-driven drag and drop plugin on the same select fields without causing conflicts. WAI-ARIA has been implemented to allow supporting screen readers to announce status messages as they appear. Moreover, you can optionally prevent status messages from appearing visually, yet supporting screen readers will continue to announce the status messages to ensure accessibility. (All status messages are customizable and optional.) Unfortunately however, screen readers still have quite a ways to go before ARIA is considered a fully viable accessibility solution. For example, a.. accDND status messages work well using JAWS10+ with Firefox, yet the functionality is unreliable and spotty when using JAWS11 with IE8; b.. accDND status messages don't work at all when using Window Eyes7.1 with either Firefox or IE8. (Additional screen reader tests would be appreciated.) Hopefully these assistive technologies will continue to improve their ARIA support in the future. To ensure backwards compatibility with assistive technologies and browser versions that don't support ARIA, a screen reader accessible intro message is automatically inserted into the page during the setup process. Both the formatting and DOM positioning of the intro message is designed to ensure accessibility for screen reader users. For example, each intro message is surrounded by an H3 tag to allow screen reader users to quickly jump between each of these sections using the header navigation commands. This also conforms with the WCAG's guidelines regarding the proper ordering of section header markup. (The screen reader accessible intro message is completely invisible to sighted users, and has no effect on the page layout.) Instructions 1.. Simply ensure that all dragable form Select fields share the same class name. (class=ClassName) Also, you can include multiple groups of dragable selects by giving each group a unique class name. (View the demo to see an example.) 2.. Within the head tag, include: script type=text/javascript src=jquery.acc.dnd.js/script (After the script instantiating jQuery.) 3.. After the page loads, call accDND like so: $('select.ClassName').accDND(); Customization accDND is fully configurable using the following syntax: $('select.ClassName').accDND({ // The default drag toggle key is ` // Important: When changing this value, be sure to pick a key that has no screen reader hotkey conflicts. dragKey: 96, // The default cancel key is Escape cancelKey: 27, // Display visual status messages. // When set to false, status messages will be announced to screen reader users regardless, invisibly. smShow: true, // Visual status messages will disappear in n milliseconds. smTimeout: 1500, // Status messages. // To stop individual messages from being shown, pass a value of smCanceled: 'Dragging canceled', smDragging: 'Now dragging', smDropped: 'Selection added', smErSame: 'Already dragging', smErMismatch: 'Cannot drag to this list', smErNothing: 'Nothing selected', smNoticeDrag: 'Dragable', smNoticeDrop: 'Droppable', // This message is important for screen reader users, who will encounter the message when arrowing down the page. // Be sure to update this text if you change any of the default hotkeys. smIntroForScreenReaders: 'Press the %DRAG% key to drag items from one list to another, or press Escape to cancel dragging.', // Visual
[jQuery] Please help to check the form...
Hello everyone, Sorry, not sure if the message passed through the first time, so repeating it. I'm new to JQuery, so please don't be too strict). I'm checking user input in the form. The form is usual but there's rather many check-outs. I preferred to display them Div's if the fields are not completed or are completet incorrectly. What I'm trying to do is to keep the Submit button disabled in case of exceptions and re-enable it when everything is OK. Here's a part of the code: $(function () { // disabling the button by default $(#go).attr(disabled, disabled); try { // We begin processing the fields $(#ulogin).blur (function (event) { var ulogin=$(this).val(); // There's a function isValidLogin checking the login by regExp if ((ulogin==) || (!isValidLogin (ulogin))) { // Showing them a div $(#errlogin).show(); //Throwing Incorrect login message throw new Error(?=MSG37?); } else { $(#errlogin).hide(); // Enabling the button, everything goes OK $(#go).attr(disabled, ); } } ); // ... All the fields in the same manner } catch(e) { $(#go).attr(disabled, disabled); } } ); What am I doing wrong? Is there a better way? Thanks in advance! -- With best regards from Ukraine, Andre Skype: Francophile; WlmMSN: arthaelon @ yandex.ru; Jabber: arthaelon @ jabber.org Yahoo! messenger: andre.polykanine; ICQ: 191749952 Twitter: m_elensule
Re: [jQuery] jquery toggle Ie7 problem
someone? -- View this message in context: http://old.nabble.com/jquery-toggle-Ie7-problem-tp26481964s27240p26511680.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Extract tag element and closing tag
Hi, I've got the following piece of code that extracts the html code contained within a clicked element: $(p,h1,h2,h3,span,li, dd, dt,b,em,strong).click(function() { alert($(this).html()); }); I want to get the containing element from this too, it's open and close tag. For example: div id=test-div h1text in stronghere/strong/h1 /div The above code would return h1text in stronghere/strong/h1 - how can I return the div tag and it's attributes too? Thanks, Colin. -- View this message in context: http://old.nabble.com/Extract-tag-element-and-closing-tag-tp26512422s27240p26512422.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Introduction to jQuery
hi all, i have a ppt powerpoint presentation on jQuery http://docs.google.com/present/edit?id=0AW_4ZSAG69j6ZGdwOWNyY2dfOTFkZnNycmZkeghl=en have a look and give comments!
Re: [jQuery] Extract tag element and closing tag
See http://github.com/brandonaaron/jquery-outerhtml Here's the spoiler: alert( $('div/div').append( $(this).clone() ).html() ); - Richard On Wed, Nov 25, 2009 at 8:14 AM, coldwired co...@coolwired.net wrote: Hi, I've got the following piece of code that extracts the html code contained within a clicked element: $(p,h1,h2,h3,span,li, dd, dt,b,em,strong).click(function() { alert($(this).html()); }); I want to get the containing element from this too, it's open and close tag. For example: div id=test-div h1text in stronghere/strong/h1 /div The above code would return h1text in stronghere/strong/h1 - how can I return the div tag and it's attributes too? Thanks, Colin. -- View this message in context: http://old.nabble.com/Extract-tag-element-and-closing-tag-tp26512422s27240p26512422.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
Re: [jQuery] Introduction to jQuery
Hmm is it just me or some text is over another parts of text? Other than that, well I was hoping for some text-wall rather than images, most images do not even have a title, so in some images i really dont know whats shown. With a lot of refinement, this could considered to be distributed, but as it is it really needs a lot of work. --- Alexandru Dinulescu Web Developer (X)HTML/CSS Specialist Expert Guarantee Certified Developer XHTML: http://www.expertrating.com/transcript.asp?transcriptid=1879053 CSS : http://www.expertrating.com/transcript.asp?transcriptid=1870619 Odesk Profile: http://www.odesk.com/users/~~3a2d7f591313701b RentACoder Profile: http://www.rentacoder.com/RentACoder/DotNet/SoftwareCoders/ShowBioInfo.aspx?lngAuthorId=6995323 LinkedIn Profile: http://ro.linkedin.com/in/alexandrudinulescu XHTML/CSS/jQuery Blog - http://alexdweb.com/blog MainWebsite: http://alexdweb.com On Wed, Nov 25, 2009 at 6:01 AM, winster cafe0...@gmail.com wrote: hi all, i have a ppt powerpoint presentation on jQuery http://docs.google.com/present/edit?id=0AW_4ZSAG69j6ZGdwOWNyY2dfOTFkZnNycmZkeghl=en have a look and give comments!
Re: [jQuery] Extract tag element and closing tag
Magic, that's exactly what I needed. Cheers! Colin. coldwired wrote: Hi, I've got the following piece of code that extracts the html code contained within a clicked element: $(p,h1,h2,h3,span,li, dd, dt,b,em,strong).click(function() { alert($(this).html()); }); I want to get the containing element from this too, it's open and close tag. For example: div id=test-div h1text in stronghere/strong/h1 /div The above code would return h1text in stronghere/strong/h1 - how can I return the div tag and it's attributes too? Thanks, Colin. -- View this message in context: http://old.nabble.com/Extract-tag-element-and-closing-tag-tp26512422s27240p26512861.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Problem with slider if else. Please help.
Hi, I'm a jquery novice and am trying to get a simple cost slider to work the way I want with no luck. I've used this as my foundation and modified it so that the cost is set behind the scenes and not entered by the user - http://design-notes.info/demo/cost/costestimator.html . How I would like it to work: I want the default starting point to be $200 / 1 page. As the person slides to the right the page step should increase by one and the cost should increase by $150 up to a max of $3050 / 20 pages like this: $200 / 1 page $350 / 2 pages $500 / 3 pages This is what I have so far: script type=text/javascript $(function() { $(#slider).slider({ value:1, min: 1, max: 20, step: 1, slide: function(event, ui) { $(#pages).val(ui.value); $(#price).val('$'+ui.value*200); if ($(#price = 200)) { $(#price).val('$'+ui.value*150); } else { if ($(#price == 300 )) { $(#price).val('$'+ui.value*200); } } } }); $(#pages).val($(#slider).slider(value)); $(#price).val('$' + $(#slider).slider(value)*200); }); /script It's close, but not right. It starts off correctly, but then miscalculates. This is what it currently does from start then sliding to the right: $200 / 1 page $300 / 2 pages $450 / 3 pages If you move the slider back to the beginning it does this: $450 / 3 pages $300 / 2 pages $150 / 1 page There's every chance I'm incorrectly using the if else statement. It would be greatly appreciated if someone could let me know what I'm doing wrong. Thanks in advance! Cheers, Morgan
[jQuery] [validate] Issues validating two different forms on same page using validation plugin
Hi. Would have posted this on the actual plugin page but comments are closed I was sent here instead. Here's the plugin page: http://bassistance.de/jquery-plugins/jquery-plugin-validation/ I have two different forms on the same page with different id attributes. Both have separate validate methods and their own rules for validation. I have setup an invalidHandler method (coded in both validate methos) that wraps the original form labels in a span tag to make them appear in red when the input is invalid. When one form is validated and the labels of invalid fields are wrapped in the span and made to appear red, the second form also seems to be validated as all of it's labels appear in red and have the span added to them. It seems to me that when the first form is submitted, the second is as well. of course none of that is filled out so all fields have errors. I can't see the difference between my two forms and the two forms on the demo page of the plugin. Can anyone help? Thanks.
[jQuery] animated gif freezes in IE8 when applying a jQuery animation on it
Hi, here's an example page: http://debug.locport.de/jqueryproblem/ The bird is an animated gif - the wings should be flapping all the time. I'm using jQuery to move the container of this animated gif across the page and back. The problem only exists in IE8: The animated gif freezes while jQuery is moving the container! The page works fine in the following browsers: * IE 6 * IE 7 * Firefox 3.5 * Opera 9 * and I guess all others too :-( Please help!
Re: [jQuery] Hi
Raju wrote: Hi All, I need a chat script to embed into my website, can anyone help me to find the script, Google is always a good start: http://www.google.se/#q=jquery+chat+scripts Regards, Fredric Warm Regards, Mari Raj K, attachment: Fredric.Fredricson.vcf
Re: [jQuery] Problem with slider if else. Please help.
On Wed, Nov 25, 2009 at 1:18 AM, Morgan morganma...@gmail.com wrote: Hi, I'm a jquery novice and am trying to get a simple cost slider to work the way I want with no luck. I've used this as my foundation and modified it so that the cost is set behind the scenes and not entered by the user - http://design-notes.info/demo/cost/costestimator.html . How I would like it to work: I want the default starting point to be $200 / 1 page. As the person slides to the right the page step should increase by one and the cost should increase by $150 up to a max of $3050 / 20 pages like this: $200 / 1 page $350 / 2 pages $500 / 3 pages Sounds like you want $50 + (number of pages * $150). No? - Richard
Re: [jQuery] two level tabs
are you talking about their horizontal nav ? that would be known as a super dropline menu you can see the demo here : http://www.cranshawmiddleton.co.uk/waxworks/index_ie6.html#nogo http://www.cranshawmiddleton.co.uk/waxworks/index_ie6.html#nogoand the code here : http://codingforums.com/showthread.php?t=170981 http://codingforums.com/showthread.php?t=170981the above mentioned is a css version. i would do it this way done in 5 minutes. you would have to style it yourself if you want to use it. HTML == div class=menu div class=parentlevel div class=itemh3a href=#Item/a/h3/div div class=itemh3a href=#Item/a/h3/div div class=itemh3a href=#Item/a/h3/div div class=itemh3a href=#Item/a/h3/div br class=end / /div div class=droplevel div class=drop div class=itemh3a href=#Item/a/h3/div div class=itemh3a href=#Item/a/h3/div div class=itemh3a href=#Item/a/h3/div div class=itemh3a href=#Item/a/h3/div br class=end / /div div class=drop div class=itemh3a href=#Item/a/h3/div div class=itemh3a href=#Item/a/h3/div div class=itemh3a href=#Item/a/h3/div div class=itemh3a href=#Item/a/h3/div br class=end / /div div class=drop div class=itemh3a href=#Item/a/h3/div div class=itemh3a href=#Item/a/h3/div div class=itemh3a href=#Item/a/h3/div div class=itemh3a href=#Item/a/h3/div br class=end / /div div class=drop div class=itemh3a href=#Item/a/h3/div div class=itemh3a href=#Item/a/h3/div div class=itemh3a href=#Item/a/h3/div div class=itemh3a href=#Item/a/h3/div br class=end / /div /div /div CSS == style type=text/css * { margin:0; padding:0; font-size:11px; font-weight:normal; font-family:verdana; line-height:1.5em; } a:link, a:visited { color:#900; } a:hover { color:#F00; } .item { float:left; margin:0 5px; padding:0 5px; } .drop { display:none; } .end { clear:left; font-size:0; height:0; } /style jQuery = script type=text/javascript $(function() { var obj = $(.menu); var parentlevel = $(.parentlevel, obj); var items = $(.item, parentlevel); var current; var drop = $(.drop, obj); items.click(function(e) { e.preventDefault(); }); items.hover(function() { var index = items.index($(this)); if(index != current) { drop.eq(index).show(); current = index; } }, function() { drop.eq(current).hide(); }); }); /script On Wed, Nov 25, 2009 at 11:35 AM, mreeves martin.ree...@focusdigital.co.ukwrote: What would be the best way to go about producing a two level tab interface with jQuery like the one used on http://www.latimes.com/ ? Thanks Martin
[jQuery] Validate: more info on options
Hello everyone, I decided to use the Validate plugin as suggested by many of you here. But either I can't read, or I can't search, but I didn't manage to find a description or a user guide for the options used by Rules() method, for example. I have seen required, email, equalTo, and minlength. Where could I read about that? Thanks! -- With best regards from Ukraine, Andre Skype: Francophile; WlmMSN: arthaelon @ yandex.ru; Jabber: arthaelon @ jabber.org Yahoo! messenger: andre.polykanine; ICQ: 191749952 Twitter: m_elensule
[jQuery] Animated gif freezes in IE8 when applying a jQuery animation on it
Hi, please look at the example page: http://debug.locport.de/jqueryproblem/ http://debug.locport.de/jqueryproblem/ The bird is an animated gif - the wings should be flapping all the time. I'm using jQuery to move the container of this animated gif across the page and back. The problem only exists in IE8: The animated gif freezes while jQuery is moving the container! The page works fine in the following browsers: * IE 6 * IE 7 * Firefox 3.5 * Opera 9 * and I guess all others too :-( Please help! -- View this message in context: http://old.nabble.com/Animated-gif-freezes-in-IE8-when-applying-a-jQuery-animation-on-it-tp26513547s27240p26513547.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Address plug-in issues
I am using the jQuery Address plug-in (http://www.asual.com/jquery/ address/) to enable bookmarking and back and forward buttons in a document search portlet. I have things working well when there is only one search portlet on the page. However, when I put two search portlets on the page, events are being fired twice for some reason. The portlets and JS code are all namespaced properly, so I am not sure why this is happening. Below is some of the relevant code. Any ideas? I am close to tearing my hair out of this one! div id=V_2e0bae46a2d47944ddcac6101ad46f14_cmlSearch_container div id=V_2e0bae46a2d47944ddcac6101ad46f14_cmlSearch_msg class=alert style=display: none;/div form action=/ice/site/nshaw/template.RAW/cml_home/? javax.portlet.tpst=2e0bae46a2d47944ddcac6101ad46f14_ws_RWjavax.portlet.begCacheTok=com.vignette.cachetokenjavax.portlet.endCacheTok=com.vignette.cachetoken name=V_2e0bae46a2d47944ddcac6101ad46f14_cmlSearch_form id=V_2e0bae46a2d47944ddcac6101ad46f14_cmlSearch_form method=post input type=hidden name=searchType value=simplesearch div id=V_2e0bae46a2d47944ddcac6101ad46f14_cmlSearch_simpleKeyword: input type=text name=keyword /nbsp; input id=V_2e0bae46a2d47944ddcac6101ad46f14_cmlSearch_submitBtnTop type=submit value=Search//div /form /div jQuery(document).ready(function() { bindSearchForm('V_2e0bae46a2d47944ddcac6101ad46f14'); }); function bindSearchForm(ns) { var nsPrefix = #+ns+_; jQuery(nsPrefix+cmlSearch_form).bind(submit, function() { jQuery.address.value(searchresults/+ns+/+getUniqueId()); return false; }); }
Re: [jQuery] Validate: more info on options
The documentation for the plugin is here: http://docs.jquery.com/Plugins/Validation That includes documentation for the rules() method as well as descriptions for all built-in validation methods ( http://docs.jquery.com/Plugins/Validation#List_of_built-in_Validation_methods ). Jörn On Wed, Nov 25, 2009 at 3:26 PM, Andre Polykanine an...@arthaelon.netwrote: Hello everyone, I decided to use the Validate plugin as suggested by many of you here. But either I can't read, or I can't search, but I didn't manage to find a description or a user guide for the options used by Rules() method, for example. I have seen required, email, equalTo, and minlength. Where could I read about that? Thanks! -- With best regards from Ukraine, Andre Skype: Francophile; WlmMSN: arthaelon @ yandex.ru; Jabber: arthaelon @ jabber.org Yahoo! messenger: andre.polykanine; ICQ: 191749952 Twitter: m_elensule
Re[2]: [jQuery] Validate: more info on options
Hello Jörn and all, Sorry, but I still can't find the table of options accepted by the Rules() method. In the Rules() sections it says that they are the same as in Rules parameter of Validate() method, and in Validate() topic it says See Rules() for detailed description :-). -- With best regards from Ukraine, Andre Skype: Francophile; WlmMSN: arthaelon @ yandex.ru; Jabber: arthaelon @ jabber.org Yahoo! messenger: andre.polykanine; ICQ: 191749952 Twitter: m_elensule - Original message - From: Jorn Zaefferer joern.zaeffe...@googlemail.com To: jquery-en jquery-en@googlegroups.com Date: Wednesday, November 25, 2009, 4:41:28 PM Subject: [jQuery] Validate: more info on options The documentation for the plugin is here: http://docs.jquery.com/Plugins/Validation That includes documentation for the rules() method as well as descriptions for all built-in validation methods ( http://docs.jquery.com/Plugins/Validation#List_of_built-in_Validation_methods ). Jorn On Wed, Nov 25, 2009 at 3:26 PM, Andre Polykanine an...@arthaelon.netwrote: Hello everyone, I decided to use the Validate plugin as suggested by many of you here. But either I can't read, or I can't search, but I didn't manage to find a description or a user guide for the options used by Rules() method, for example. I have seen required, email, equalTo, and minlength. Where could I read about that? Thanks! -- With best regards from Ukraine, Andre Skype: Francophile; WlmMSN: arthaelon @ yandex.ru; Jabber: arthaelon @ jabber.org Yahoo! messenger: andre.polykanine; ICQ: 191749952 Twitter: m_elensule
[jQuery] Using multiple instances of datepicker generated via append()
Hi guys, I have managed to get multiple instances of a jQuery datepicker working using a technique found here http://tinyurl.com/d82fem http://tinyurl.com/d82fem The uploaded image probably explains better what I am trying to achieve, using the 'append' function i'd like to duplicate a row (with all input fields for the new row blank) while setting a different id for the datepicker for each individual row, ideally increment the id by 1. For instance, it would be 'datepicker1', 'datepicker2', 'datepicker3, and so on (for each time the 'Add another row' button is clicked) Can anyone suggest the best way of going about this? http://old.nabble.com/file/p26514224/append-datepicker.jpg append-datepicker.jpg Thanks in advance, Gav -- View this message in context: http://old.nabble.com/Using-multiple-instances-of-datepicker-generated-via-append%28%29-tp26514224s27240p26514224.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Re: $.getScript results in two requests!
just out of curiosity, have you checked to make sure you aren't using the $.ajax() method (or one of its convenience methods) elsewhere? i see in the first set of headers that the X-Requested-With header is present, which is generally added by jQuery (and most other libs) when a request is submitted via XHR. so, the first request is being submitted via ajax, and the second request is not. is this intentional? also, just a note that $.getScript() is generally used to make cross- domain calls (which are not allowed in XHR), so if the resource is on the same domain i'd recommend scrapping the $.getScript() call and replacing it with an $.ajax() call. of course, as michael suggested, a test page would get us all much closer to the answer :) On Nov 24, 4:19 pm, Michael Geary m...@mg.to wrote: Can you post a link to a test page? Pretty hard to troubleshoot by just looking at the headers. Of course, someone will come along and troubleshoot it from the headers alone and prove me wrong! :-) -Mike On Tue, Nov 24, 2009 at 6:50 AM, Eric ikeah...@gmail.com wrote: Hey there, A $.getScript() call I am making results in two seperate requests to the server. Any chance I can avoid that? Here are the headers: GET server.file?param1=param2 HTTP/1.1 Host: server User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.2; de; rv:1.8.1.20) Gecko/20081217 Firefox/2.0.0.20 Accept: text/javascript, application/javascript, */* Accept-Language: de-de,de;q=0.8,en-us;q=0.5,en;q=0.3 Accept-Encoding: gzip,deflate Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7 Keep-Alive: 300 Connection: keep-alive X-Requested-With: XMLHttpRequest Referer:http://server/indexfile.html Cookie: (Cookie Contents) Followed by... GET server.file?param1=param2 HTTP/1.1 Host: server User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.2; de; rv:1.8.1.20) Gecko/20081217 Firefox/2.0.0.20 Accept: text/xml,application/xml,application/xhtml+xml,text/ html;q=0.9,text/plain;q=0.8,image/png,*/*;q=0.5 Accept-Language: de-de,de;q=0.8,en-us;q=0.5,en;q=0.3 Accept-Encoding: gzip,deflate Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7 Keep-Alive: 300 Connection: keep-alive Cookie: (Cookie Contents) The web server runs IIS6. Thanks for your help Eric
[jQuery] Weird hight issue with show/hide div
Hi, Got a bit of a weird one here, and not sure how to fix it :/ Basically - I'm using this code: table width=100% tr !-- td align=center class=trip_header width=100% colspan=3a href=javascript: void(0); onclick=jQuery ('#chichen_itza_plus').slideToggle() style=color: white;CHICHEN- ITZA PLUS/a (click for more information)/td-- td align=center class=trip_header width=100% colspan=3a href=javascript: void(0); onclick=jQuery ('#chichen_itza_plus').slideToggle() style=color: white;CHICHEN- ITZA PLUS/a (click for more information)/td /tr /table div id=chichen_itza_plus style=display: none; content is here /div The problem is, as you can see here (click on one of the headers in the main content area) http://www.cancunandrivieramaya.com/new/chichen-itza.htm ...you will notice the main container div doesn't get any higher (so all the content gets cut off after a certain point :/) Anyone got any ideas how I can fix that? TIA! Andy
[jQuery] Re: Weird hight issue with show/hide div
BTW, you will have to load at least 2 of the tabs to see what I mean (the content doesn't go down that far, so needs at least 2 tabs to be selected before it will show the issue I'm having) TIA Andy On Nov 25, 3:30 pm, youradds andy.ne...@gmail.com wrote: Hi, Got a bit of a weird one here, and not sure how to fix it :/ Basically - I'm using this code: table width=100% tr !-- td align=center class=trip_header width=100% colspan=3a href=javascript: void(0); onclick=jQuery ('#chichen_itza_plus').slideToggle() style=color: white;CHICHEN- ITZA PLUS/a (click for more information)/td-- td align=center class=trip_header width=100% colspan=3a href=javascript: void(0); onclick=jQuery ('#chichen_itza_plus').slideToggle() style=color: white;CHICHEN- ITZA PLUS/a (click for more information)/td /tr /table div id=chichen_itza_plus style=display: none; content is here /div The problem is, as you can see here (click on one of the headers in the main content area) http://www.cancunandrivieramaya.com/new/chichen-itza.htm ...you will notice the main container div doesn't get any higher (so all the content gets cut off after a certain point :/) Anyone got any ideas how I can fix that? TIA! Andy
[jQuery] Re: Weird hight issue with show/hide div
Ok, all sorted... it was new ElementMaxHeight(); which was causing the mess up. I added that into the onclick= bit, and works perfectly now :) Cheers Andy On Nov 25, 3:36 pm, youradds andy.ne...@gmail.com wrote: BTW, you will have to load at least 2 of the tabs to see what I mean (the content doesn't go down that far, so needs at least 2 tabs to be selected before it will show the issue I'm having) TIA Andy On Nov 25, 3:30 pm, youradds andy.ne...@gmail.com wrote: Hi, Got a bit of a weird one here, and not sure how to fix it :/ Basically - I'm using this code: table width=100% tr !-- td align=center class=trip_header width=100% colspan=3a href=javascript: void(0); onclick=jQuery ('#chichen_itza_plus').slideToggle() style=color: white;CHICHEN- ITZA PLUS/a (click for more information)/td-- td align=center class=trip_header width=100% colspan=3a href=javascript: void(0); onclick=jQuery ('#chichen_itza_plus').slideToggle() style=color: white;CHICHEN- ITZA PLUS/a (click for more information)/td /tr /table div id=chichen_itza_plus style=display: none; content is here /div The problem is, as you can see here (click on one of the headers in the main content area) http://www.cancunandrivieramaya.com/new/chichen-itza.htm ...you will notice the main container div doesn't get any higher (so all the content gets cut off after a certain point :/) Anyone got any ideas how I can fix that? TIA! Andy
[jQuery] Re: $.getScript results in two requests!
Be very certain you don't accidentally bind a click function twice somehow. Assuming, that is, a click initiates the action. Setting a Firebug breakpoint on entry to the repeated code, then inspecting the Stack panel to see how you got there each time, will probably reveal how this occurs. On Nov 24, 9:50 am, Eric ikeah...@gmail.com wrote: Hey there, A $.getScript() call I am making results in two seperate requests to the server. Any chance I can avoid that? Here are the headers: GET server.file?param1=param2 HTTP/1.1 Host: server User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.2; de; rv:1.8.1.20) Gecko/20081217 Firefox/2.0.0.20 Accept: text/javascript, application/javascript, */* Accept-Language: de-de,de;q=0.8,en-us;q=0.5,en;q=0.3 Accept-Encoding: gzip,deflate Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7 Keep-Alive: 300 Connection: keep-alive X-Requested-With: XMLHttpRequest Referer:http://server/indexfile.html Cookie: (Cookie Contents) Followed by... GET server.file?param1=param2 HTTP/1.1 Host: server User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.2; de; rv:1.8.1.20) Gecko/20081217 Firefox/2.0.0.20 Accept: text/xml,application/xml,application/xhtml+xml,text/ html;q=0.9,text/plain;q=0.8,image/png,*/*;q=0.5 Accept-Language: de-de,de;q=0.8,en-us;q=0.5,en;q=0.3 Accept-Encoding: gzip,deflate Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7 Keep-Alive: 300 Connection: keep-alive Cookie: (Cookie Contents) The web server runs IIS6. Thanks for your help Eric
[jQuery] value visible in ajax response, but not used in output
hi, I am rather new to jquery ajax but I managed to get some simple stuff done. Now I am working on a wizard form that uses select items (with the options pulled from a database). This works nice. Now I want to take it a step further: I want the selection of the second selector be based on the value of the first selector. The third selector must be based on the first and the second. When I check the response given in the console I see the output I want, but that is not showing on the page. I have no clue where to find that... Here's the JS I use: http://pastie.org/714683 Here's the PHP file I use: http://pastie.org/714685 If someone could take a look, that would be very nice. Thanks in advance.
[jQuery] Re: Using multiple instances of datepicker generated via append()
Quick example: http://jsbin.com/efuqa3/edit
[jQuery] Re: value visible in ajax response, but not used in output
On Nov 25, 11:12 am, dcrunche henjohoek...@gmail.com wrote: When I check the response given in the console I see the output I want, but that is not showing on the page. Here's the JS I use:http://pastie.org/714683 I don't think you are actually using the resulting data anywhere in that code, except in the outermost success function. For each of the (three levels of!) nested .ajax calls, you ignore the returning data parameter. Perhaps you just need to copy this line to each of them: $('#productWizard fieldset').html(data); Cheers, -- Scott
[jQuery] Cycle and Transition Effects with Each Slides
Hi, I am creating a carousel using Cycle with the following effects: 1. Each slide fades/slides in when user clicks the previous or next button 2. When the slide finishes loading, I want to animate the text and images in each slide with a slide-in effect. Questions: 1. How could one do it so that the transitions are smooth (like that of a flash slideshow)? I thought about hiding the text/images and animating them when the slides finishes loading (bind a function to the after parameter) 2. And how would I animate the text on the first slide when the use comes to the page. Cycle animates each page when you navigate through them. Thanks in advance. I'm open to other plugins and suggestions as well. Vincent
RE: [jQuery] Weird hight issue with show/hide div
I'm not noticing any problem with the sliding/hiding div's id IE 8. All content seems to be showing, down to and including the Next button in each section... -Original Message- From: youradds [mailto:andy.ne...@gmail.com] Sent: Wednesday, November 25, 2009 10:31 AM To: jQuery (English) Subject: [jQuery] Weird hight issue with show/hide div Hi, Got a bit of a weird one here, and not sure how to fix it :/ Basically - I'm using this code: table width=100% tr !-- td align=center class=trip_header width=100% colspan=3a href=javascript: void(0); onclick=jQuery ('#chichen_itza_plus').slideToggle() style=color: white;CHICHEN- ITZA PLUS/a (click for more information)/td-- td align=center class=trip_header width=100% colspan=3a href=javascript: void(0); onclick=jQuery ('#chichen_itza_plus').slideToggle() style=color: white;CHICHEN- ITZA PLUS/a (click for more information)/td /tr /table div id=chichen_itza_plus style=display: none; content is here /div The problem is, as you can see here (click on one of the headers in the main content area) http://www.cancunandrivieramaya.com/new/chichen-itza.htm ...you will notice the main container div doesn't get any higher (so all the content gets cut off after a certain point :/) Anyone got any ideas how I can fix that? TIA! Andy
Re: [jQuery] Please help to check the form...
What is the problem you are trying to solve? What behaviour are you seeing to suggest it is wrong? On Wed, Nov 25, 2009 at 6:55 AM, Andre Polykanine andre.polykan...@gmail.com wrote: Hello everyone, Sorry, not sure if the message passed through the first time, so repeating it. I'm new to JQuery, so please don't be too strict). I'm checking user input in the form. The form is usual but there's rather many check-outs. I preferred to display them Div's if the fields are not completed or are completet incorrectly. What I'm trying to do is to keep the Submit button disabled in case of exceptions and re-enable it when everything is OK. Here's a part of the code: $(function () { // disabling the button by default $(#go).attr(disabled, disabled); try { // We begin processing the fields $(#ulogin).blur (function (event) { var ulogin=$(this).val(); // There's a function isValidLogin checking the login by regExp if ((ulogin==) || (!isValidLogin (ulogin))) { // Showing them a div $(#errlogin).show(); //Throwing Incorrect login message throw new Error(?=MSG37?); } else { $(#errlogin).hide(); // Enabling the button, everything goes OK $(#go).attr(disabled, ); } } ); // ... All the fields in the same manner } catch(e) { $(#go).attr(disabled, disabled); } } ); What am I doing wrong? Is there a better way? Thanks in advance! -- With best regards from Ukraine, Andre Skype: Francophile; WlmMSN: arthaelon @ yandex.ru; Jabber: arthaelon @ jabber.org Yahoo! messenger: andre.polykanine; ICQ: 191749952 Twitter: m_elensule
[jQuery] Re: Cluetip - Sticky pulling inline content
That did the trick. Thank you very much, Karl! -c On Nov 24, 10:42 pm, Karl Swedberg k...@englishrules.com wrote: You can probably fix it by adding this to your CSS: #cluetip #hidden { display:block; } --Karl Karl Swedbergwww.englishrules.comwww.learningjquery.com On Nov 24, 2009, at 8:16 PM, christopherious wrote: I have a Cluetip that is pulling content from a hiddden div on the page that is only, obviously, visible when the cluetip is invoked. Everything is working well except under IE, where the content does not show. I think this is probably just a simple CSS fix, but I'm stuck. Help! Here is what I'm doing: jQuery script type=text/javascript $(document).ready(function() { $('a.load-local').cluetip({width:340, local:true, cursor: 'pointer', sticky: true, closePosition: 'title', arrows: true}); }); /script --- HTML a id=load-local class=load-local href=#hidden rel=#hiddenLorem ipsum Stolle/a div id=hiddenLorem ipsum/div --- CSS #hidden { display:none; }
Re[2]: [jQuery] Please help to check the form...
Hello brian and all, I was attempting to validate the form manually and had deep problems with it. Now I'm using jQuery.validate plugin and almost everything goes OK, but I still have a couple of missunderstandings: 1. How can I tell the plugin that a valid login (#ulogin) is a login that fits to a regexp or, say, just doesn't contain whitespaces? 2. For some reason I can't make the plugin validate a group of radiobuttons (gender selection) that is required. I'm using $(#signup).validate( { rules: { ... usex1: required, ... } }); ... fieldset id=ugender legendSelect your gender:/legend input type=radio name=usex id=usex1 value=1Malebr input type=radio name=usex id=usex2 value=2Female /fieldset What am I doing wrong? I tried to validate #ugender but it didn't help, either. -- With best regards from Ukraine, Andre Skype: Francophile; WlmMSN: arthaelon @ yandex.ru; Jabber: arthaelon @ jabber.org Yahoo! messenger: andre.polykanine; ICQ: 191749952 Twitter: m_elensule - Original message - From: brian zijn.digi...@gmail.com To: jquery-en@googlegroups.com jquery-en@googlegroups.com Date: Wednesday, November 25, 2009, 7:47:03 PM Subject: [jQuery] Please help to check the form... What is the problem you are trying to solve? What behaviour are you seeing to suggest it is wrong? On Wed, Nov 25, 2009 at 6:55 AM, Andre Polykanine andre.polykan...@gmail.com wrote: Hello everyone, Sorry, not sure if the message passed through the first time, so repeating it. I'm new to JQuery, so please don't be too strict). I'm checking user input in the form. The form is usual but there's rather many check-outs. I preferred to display them Div's if the fields are not completed or are completet incorrectly. What I'm trying to do is to keep the Submit button disabled in case of exceptions and re-enable it when everything is OK. Here's a part of the code: $(function () { // disabling the button by default $(#go).attr(disabled, disabled); try { // We begin processing the fields $(#ulogin).blur (function (event) { var ulogin=$(this).val(); // There's a function isValidLogin checking the login by regExp if ((ulogin==) || (!isValidLogin (ulogin))) { // Showing them a div $(#errlogin).show(); //Throwing Incorrect login message throw new Error(?=MSG37?); } else { $(#errlogin).hide(); // Enabling the button, everything goes OK $(#go).attr(disabled, ); } } ); // ... All the fields in the same manner } catch(e) { $(#go).attr(disabled, disabled); } } ); What am I doing wrong? Is there a better way? Thanks in advance! -- With best regards from Ukraine, Andre Skype: Francophile; WlmMSN: arthaelon @ yandex.ru; Jabber: arthaelon @ jabber.org Yahoo! messenger: andre.polykanine; ICQ: 191749952 Twitter: m_elensule
Re: Re[2]: [jQuery] Please help to check the form...
On Wed, Nov 25, 2009 at 1:03 PM, Andre Polykanine an...@arthaelon.net wrote: Hello brian and all, I was attempting to validate the form manually and had deep problems with it. Now I'm using jQuery.validate plugin and almost everything goes OK, but I still have a couple of missunderstandings: 1. How can I tell the plugin that a valid login (#ulogin) is a login that fits to a regexp or, say, just doesn't contain whitespaces? Have a look at this: http://stackoverflow.com/questions/280759/jquery-validate-how-to-add-a-rule-for-regular-expression-validation 2. For some reason I can't make the plugin validate a group of radiobuttons (gender selection) that is required. I'm using $(#signup).validate( { rules: { ... usex1: required, ... } }); ... fieldset id=ugender legendSelect your gender:/legend input type=radio name=usex id=usex1 value=1Malebr input type=radio name=usex id=usex2 value=2Female /fieldset What am I doing wrong? I tried to validate #ugender but it didn't help, either. For the rules, the key is the name attribute of the element. You're using the ID of one of the radio buttons. Try: usex: required,
[jQuery] NEW! jQuery CKEditor Plugin v0.10
NEW! jQuery CKEditor Plugin v0.10 http://www.fyneworks.com/jquery/CKEditor/ It's been a while but hey, I've finally done it. I've just released the very first version of my new CKEditor plugin for jQuery. I only started working on it today, but soon enough I hope to turn it into a complete interface between jQuery and CKEditor's API methods. The most important thing the plugin does is take care of ajax submissions, reading the editor's output before the ajax call is made AND clearing old editor objects from memory, in an environment when editors are created and destroyed on the fly (my cms for example). IMPORTANT: Be notified of future updates via this Twitter account: http://twitter.com/fyneworks
[jQuery] unknown pseudo-class or pseudo-element
Is there a solution to the unknown pseudo-class or pseudo-element error when using : selectors (like :visible, :first, :animated, :odd, etc) in 1.3.2 yet? It generates only a warning in FF3.5 but it seems to generate an error in IE8.
[jQuery] [validate] Specifying custom highlight/unhighlight methods problem
I'm trying to specify a couple of custom methods for highlighting/ unhighlighting valid/invalid fields on my form, but I'm getting some strange behaviour, which I'm not sure is due to me misunderstanding how these methods are supposed to be implemented, or if it's just buggy. $().ready(function() { // validate signup form on keyup and submit $(#contactForm).validate({ showErrors: function(errorMap, errorList) { $(#result).html('span class=errors/spanspan class=msgPlease check/fill the marked fields/span !'); this.defaultShowErrors(); }, highlight: function(element, errorClass) { $(element.form).find(label[for= + element.id + ]).addClass (errorClass); }, unhighlight: function(element, errorClass) { $(element.form).find(label[for= + element.id + ]).removeClass (errorClass); }, rules: { name: required, email: { required: true, email: true } } }); }); My problem is when some of inputs in invalid, then the label will take the error class, will be turn on red, when I correct the content of input my label disapear, I have also the valid class, in my css file, what colud be the problem I hope You understand what I mean;
Re: [jQuery] Using multiple instances of datepicker generated via append()
Dude thats awesome!!! Thanks for the help it is very much appreciated! :clap: MorningZ wrote: Quick example: http://jsbin.com/efuqa3/edit -- View this message in context: http://old.nabble.com/Using-multiple-instances-of-datepicker-generated-via-append%28%29-tp26514224s27240p26515996.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Close Button using prettyPhoto w/ JQuery
Hello, 1st I am using prettyPhoto, prettyPhoto is a jQuery based lightbox clone. Not only does it support images, it also add support for videos, flash, YouTube, iFrames. ... www.no-margin-for-errors.com/ What I am using it for is to open an iframe to pull in another html page. Here is my page http://www.thejonnyoshow.com I'm running an internet radio show on UBroadcast.com They offer an embed code to add the stream and chatroom to your website. The only problem is there is no way to log in to join the chat from the embedded stream. The work around they have is a link to open a new window on UBroadcast, people log in, close the window and refresh MY website to get the browser to see the cookie/session ID. And then the listener is able to chat. My workaround is I have a sign/in button which uses prettyPhoto to open a modalwindow.IFrame to pull in the UBroadcast log in page. The listener logs in, and clicks on the close button on the modal window. From there the listener STILL has to refresh the page or cick my reload button on the site. This is still a pain as you can see, so this is what I would like to do. When the Listener clicks the CLOSE button on the modal window, I would like it to be able to a. close the modal window and or refresh the parent window. I am not a Java programmer, but am learning things as I go. If anyone has any help I would greatly appreciate it! and would be more than happy to plug whatever the helper wants to promote on the show! lol this is not a bribe! lol or at least not a good one! Thanks is advance! jonnyvegasss
[jQuery] Superfish Animation Issue
Hi, I am experiencing the following problem with the Superfish plugin. I have a series of drop down menus that slide down upon hovering over their parent. However, I have noticed the following issue with menu items not displaying. I can reproduce the problem as follows: 1) Hover over a parent menu item 2) Move quickly to another parent menu item before the menu has fully completed its animation 3) Move back to the parent item in #1 The result is that the menu does not expand until I hover over another item and then go back to it. My Superfish initialization settings are as follows: //Initialize Main Menu $(ul.sf-menu).superfish({ autoArrows: false, animation: {opacity:'show',height:'show'}, dropShadows: true, delay: 400, speed: 'normal' }); The behavior only occurs when I animate the menus. If I remove the animation I do not experience the problem. Please see http://www2.dordt.edu/athletics/soccer/women/ for an example of the above. Thanks, Brady
[jQuery] Jquery form plugin and accessing formData
I am using the excellent jquery form plugin to obtain form data, do some pre-submission processing, and pass the altered form on to a django view via ajax for some additional processing. I have a jQuery form plugin beforeSubmit function to basically divide a form field by 12 if another monthly/yearly checkbox is checked, and pass the altered value on to django. I have a html form called myForm with a bunch of text inputs amount1, amount2, amount3, etc. and two checkboxes for each text input amount1my, amount2my, amount3my etc. for the user to select whether amount fields are monthly or annual amounts (the checkbox values are m and y) I bind the form in $(document).ready(function() : var options = { ... beforeSubmit: myBeforeSubmit, ... } $('#myForm').ajaxForm(options); } What I want to do is search the form data for a y value in any of the checkboxes, and if present, get the related amount field and divide by 12. the beforeSubmit function is basically this: function myBeforeSubmit(formData, jqForm, options) { //for loop to get the name of each formData name field containing y - I get this using match(/y/) - so far, so good ///strip the field name of the my to get the underlying amount field name and create new variable theFieldName for the resulting stripped string - so far, so good. //This all works to this point, but when I try to do the math on the field: formData.theFieldName.value = formData.theFieldName.value/12; // the jQuery Form plugin sees theFieldName as a form field name which of course does not exist } Question: it is possible to insert a variable in the formData.[field name].value statement? Mark
[jQuery] Change images dinamically with jquery
Hi guys! I come write from Italy, I am a jquery noob and I am working on it to improve my skills. This instrument is fantastic for noobs!! Here it is my website (do you like my shots??). I am triyng to change horizontal image bar with new images when I click on left sections. How can I do it? Can you help me? http://www.searose.it
[jQuery] Re: Close Button using prettyPhoto w/ JQuery
On Nov 25, 12:27 pm, jonnyvegasss jonnyvega...@yahoo.com wrote: When the Listener clicks the CLOSE button on the modal window, I would like it to be able to a. close the modal window and or refresh the parent window. I am not a Java programmer, but am learning things as I go. We're all learning as we go, even learning little trivia like the fact that Java and JavaScript are entirely independent languages with only some superficial similarities. :-) I posted a response to a similar question the other day. The thread is at http://tinyurl.com/yfhho2g The basic idea is to simply use a timer in the parent window to watch for when the child window is closed, then perform your logic there. Check out http://jsbin.com/usuco (code: http://jsbin.com/usuco/edit) to see it in action. -- Scott
[jQuery] Re: Close Button using prettyPhoto w/ JQuery
Thanks Scott, That seems to be exactly what I need. I'm just not sure how, where to add something like that. I apologize for my ignorance, but as I said I'm learning LOL! Also, I looked at the links you posted, and I don't see the parent window refreshing after the child window is closed. Thank you for your help, it is greatly appreciated! John On Nov 25, 11:40 am, Scott Sauyet scott.sau...@gmail.com wrote: On Nov 25, 12:27 pm, jonnyvegasss jonnyvega...@yahoo.com wrote: When the Listener clicks the CLOSE button on the modal window, I would like it to be able to a. close the modal window and or refresh the parent window. I am not a Java programmer, but am learning things as I go. We're all learning as we go, even learning little trivia like the fact that Java and JavaScript are entirely independent languages with only some superficial similarities. :-) I posted a response to a similar question the other day. The thread is at http://tinyurl.com/yfhho2g The basic idea is to simply use a timer in the parent window to watch for when the child window is closed, then perform your logic there. Check outhttp://jsbin.com/usuco(code:http://jsbin.com/usuco/edit) to see it in action. -- Scott
[jQuery] Re: Debuging AJAX
Any new eyes out there? Not sure why this got changed to accessibility discussion. On Nov 24, 4:46 pm, Rockinelle ericbles...@gmail.com wrote: Hey everyone, I've been trying to make a .post work for me and I'm using firebug to attempt to debug my problems. I am trying to use ajax to process a form and from what I can tell in Firebug, I am not getting a response. Now I have removed the action in the form itself so it's just reloads the page after the .post fails. $('#testform').live('submit',function(){ var formData = $(this).serialize(); alert(formData); //to verify the data is formatted properly and it is. $.post('ajax/setvalue.php', formData, function(data) { document.write(data) }); }); The path to the remote script is correct. formData is formatted properly. The php doc only echo the string 'pass' to let me know it got the request. I'm using .live rather than .submit because the form is loaded via an ajax call so it waits for the form to load before it binds this ajax request to the form. So if you have some tips on my code great, but I'd really like a good tool to debug this myself. Maybe there is something in firebug I'm missing.
[jQuery] Re: superfish navbar issue in Afterburner or JA-Purity Templates
This is a progress report on finding a solution : If all CSS pertaining to the NAV position in the Template's style sheet are commented out, then it works. This is a dirty solution and I would like to find the root of the problem. I think it has to do, at least in part with the WIDTH parameter. I am progressing with learning CSS, understanding JQuery and overall trying to figure out how all those files interact to give out the web page I want. I still find it hard to follow CSS priorities across the different stylesheet and identifying the proper Class to modify. This is where I was hoping to get help. Keep you all posted.
Re: [jQuery] Re: Debuging AJAX
Hey, don't use document.write() or alert() to debug - either use console.log() or have a div in the document which can display debugging information and append any data to it. $('#testform').live('submit',function(){ var formData = $(this).serialize(); console.log(formData); $.post('ajax/setvalue.php', formData, function(data){ console.log(data) }); }); Firebug should log the POST as well as any response from it as well. HTH on 25/11/2009 21:10 Rockinelle said:: Any new eyes out there? Not sure why this got changed to accessibility discussion. On Nov 24, 4:46 pm, Rockinelle ericbles...@gmail.com wrote: Hey everyone, I've been trying to make a .post work for me and I'm using firebug to attempt to debug my problems. I am trying to use ajax to process a form and from what I can tell in Firebug, I am not getting a response. Now I have removed the action in the form itself so it's just reloads the page after the .post fails. $('#testform').live('submit',function(){ var formData = $(this).serialize(); alert(formData); //to verify the data is formatted properly and it is. $.post('ajax/setvalue.php', formData, function(data) { document.write(data) }); }); The path to the remote script is correct. formData is formatted properly. The php doc only echo the string 'pass' to let me know it got the request. I'm using .live rather than .submit because the form is loaded via an ajax call so it waits for the form to load before it binds this ajax request to the form. So if you have some tips on my code great, but I'd really like a good tool to debug this myself. Maybe there is something in firebug I'm missing.
[jQuery] Validate: Display errors after Ajax form submit
I have the validator setup nicely with client side rules and some remote validations. That part is working well. When the form is submitted (via ajax) there may be some more complicated server side validations that generate errors. (Such as checking a credit card with the cc service, db concurrency issues, etc) When I gather these server side errors, I send them in a JSON response with HTTP code 200. The best method I could find in the documentation was showErrors. I have this working also, where the 1 or more server side errors are shown next to each field in error. The problem is that while this shows them, it doesn't register these as errors, like the client side errors. For these server side errors, once the user changes some other field to trigger a client side error, the server errors displayed with showErrors vanish. Also, for client errors, the submit button does not trigger submit. With showErrors of server errors, they can submit again right away. Looking for a method like showErrors that will treat these errors just like the other Rules based ones, not clearing the error until the user has changed that data in some way.
[jQuery] toggle anonymous function doesn't like object value in .css()
Hello all, I'm running into a problem where it looks like the toggle() method's anonymous functions don't like object values in the css() method. I'm not having any problems without this outside my toggle(), I'm doing stuff like: zip.css({ 'border': + zip_data.no_error.border, 'background': + zip_data.no_error.background }); And it works fine. It's only inside toggle() that it gives me problems. Anyone know how I can resolve this? I'm using the values in my zip_data object several times so I'm trying to keep the actual data in one place so that it's easily changed. Also, I have several other objects with data inside zip_data, I didn't include those here just to keep the code to a minimum. Here's the pertinent code that is giving me trouble, anyone have any ideas? * var zip_data = { no_error: { border:'1px solid #e1e1e1', background:'#f2f3f2' } }; $('form#zipcode').submit(function() { //bunch of stuff here //calling zip_data.no_error.border works fine $('#change_location').toggle( function() { //listener odd //body }, function() {//listener even //body //calling zip_data.no_error.border does NOT work here //though I can console.log the object and see the values just fine //I have to hard code the object values below for them to take zip.css({ 'border': '1px solid #e1e1e1', 'background': '#f2f3f2' }); } ); }
[jQuery] Problems injecting text into div classes
Hi Guys I have several div classes and I am trying to insert some html into one of them but firebug keeps telling me its not a function. Code below: div class=direction/div div class=direction/div div class=direction/div div class=direction/div $(.direction)[1].html(div class=\direction_err\The Map cannot be loaded./div); ERROR MSG: $(.directions_box)[id].html is not a function
[jQuery] Re: Problems injecting text into div classes
$('.direction') returns a jQuery object that is similar to an array of nodes. $('.direction')[0] returns the first node in the jQuery object, without any jQuery features... just the basic DOM node. $ ('.direction').eq(0).html or $('.direction:eq(0)').html are what you are looking for. They return the jQuery object instead of the basic DOM node. You're also better off using single quotes around the html string so you do not need to escape the quotes, but that is just a style issue $(.direction).eq(1).html('div class=direction_errThe Map cannot be loaded./div'); On Nov 25, 3:25 pm, shaf shaolinfin...@gmail.com wrote: Hi Guys I have several div classes and I am trying to insert some html into one of them but firebug keeps telling me its not a function. Code below: div class=direction/div div class=direction/div div class=direction/div div class=direction/div $(.direction)[1].html(div class=\direction_err\The Map cannot be loaded./div); ERROR MSG: $(.directions_box)[id].html is not a function
[jQuery] Re: Problems injecting text into div classes
Thanks seasoup. That prevents the error from popping up but no html is injected into the DIV. Why do you think this is ? On Nov 25, 11:49 pm, seasoup seas...@gmail.com wrote: $('.direction') returns a jQuery object that is similar to an array of nodes. $('.direction')[0] returns the first node in the jQuery object, without any jQuery features... just the basic DOM node. $ ('.direction').eq(0).html or $('.direction:eq(0)').html are what you are looking for. They return the jQuery object instead of the basic DOM node. You're also better off using single quotes around the html string so you do not need to escape the quotes, but that is just a style issue $(.direction).eq(1).html('div class=direction_errThe Map cannot be loaded./div'); On Nov 25, 3:25 pm, shaf shaolinfin...@gmail.com wrote: Hi Guys I have several div classes and I am trying to insert some html into one of them but firebug keeps telling me its not a function. Code below: div class=direction/div div class=direction/div div class=direction/div div class=direction/div $(.direction)[1].html(div class=\direction_err\The Map cannot be loaded./div); ERROR MSG: $(.directions_box)[id].html is not a function
[jQuery] Re: toggle anonymous function doesn't like object value in .css()
So it looks like it's not liking '1px solid' in my data object value. If I change things to: var zip_data = { no_error: { border:'#e1e1e1', background:'#f2f3f2' } } zip.css({ 'border': '1px solid ' + zip_data.no_error.border, 'background': zip_data.no_error.background }); It all seems to work, but unfortunately, '1px solid' is hard coded several places instead of inside the data object where a global change can be made by editing it once.
[jQuery] AUTO: Michael Lawson is out of the office (returning 11/30/2009)
I am out of the office until 11/30/2009. Due to severe triptophan intake, I will be unable to check my email, nor will I be in the office. (it's Thanksgiving) Note: This is an automated response to your message [jQuery] Re: Close Button using prettyPhoto w/ JQuery sent on 11/25/09 13:46:49. This is the only notification you will receive while this person is away.
Re[4]: [jQuery] Please help to check the form...
Hello brian and all, Thanks for your time! Now I've added the following method: $.validator.addMethod( regexp,function (value, element, regexp) { var check=false; var re=new RegExp (regexp); return this.optional(element) || re.test (value); }, Please check your input.); It works well here but it doesn't monitor the changes. Say, I entered a wrong login, than I went back and corrected it. At this time it still says Incorrect login. What might be the reason? What check do I need to implement? -- With best regards from Ukraine, Andre Skype: Francophile; WlmMSN: arthaelon @ yandex.ru; Jabber: arthaelon @ jabber.org Yahoo! messenger: andre.polykanine; ICQ: 191749952 Twitter: m_elensule - Original message - From: brian zijn.digi...@gmail.com To: jquery-en@googlegroups.com jquery-en@googlegroups.com Date: Wednesday, November 25, 2009, 8:14:12 PM Subject: [jQuery] Please help to check the form... On Wed, Nov 25, 2009 at 1:03 PM, Andre Polykanine an...@arthaelon.net wrote: Hello brian and all, I was attempting to validate the form manually and had deep problems with it. Now I'm using jQuery.validate plugin and almost everything goes OK, but I still have a couple of missunderstandings: 1. How can I tell the plugin that a valid login (#ulogin) is a login that fits to a regexp or, say, just doesn't contain whitespaces? Have a look at this: http://stackoverflow.com/questions/280759/jquery-validate-how-to-add-a-rule-for-regular-expression-validation 2. For some reason I can't make the plugin validate a group of radiobuttons (gender selection) that is required. I'm using $(#signup).validate( { rules: { ... usex1: required, ... } }); ... fieldset id=ugender legendSelect your gender:/legend input type=radio name=usex id=usex1 value=1Malebr input type=radio name=usex id=usex2 value=2Female /fieldset What am I doing wrong? I tried to validate #ugender but it didn't help, either. For the rules, the key is the name attribute of the element. You're using the ID of one of the radio buttons. Try: usex: required,
Re[5]: [jQuery] Please help to check the form...
Hello all, Oh sorry, it's my screenreader fault: for some reason it doesn't hide and show the message properly. -- With best regards from Ukraine, Andre Skype: Francophile; WlmMSN: arthaelon @ yandex.ru; Jabber: arthaelon @ jabber.org Yahoo! messenger: andre.polykanine; ICQ: 191749952 Twitter: m_elensule - Original message - From: Andre Polykanine an...@arthaelon.net To: brian jquery-en@googlegroups.com Date: Thursday, November 26, 2009, 2:25:31 AM Subject: [jQuery] Please help to check the form... Hello brian and all, Thanks for your time! Now I've added the following method: $.validator.addMethod( regexp,function (value, element, regexp) { var check=false; var re=new RegExp (regexp); return this.optional(element) || re.test (value); }, Please check your input.); It works well here but it doesn't monitor the changes. Say, I entered a wrong login, than I went back and corrected it. At this time it still says Incorrect login. What might be the reason? What check do I need to implement? -- With best regards from Ukraine, Andre Skype: Francophile; WlmMSN: arthaelon @ yandex.ru; Jabber: arthaelon @ jabber.org Yahoo! messenger: andre.polykanine; ICQ: 191749952 Twitter: m_elensule - Original message - From: brian zijn.digi...@gmail.com To: jquery-en@googlegroups.com jquery-en@googlegroups.com Date: Wednesday, November 25, 2009, 8:14:12 PM Subject: [jQuery] Please help to check the form... On Wed, Nov 25, 2009 at 1:03 PM, Andre Polykanine an...@arthaelon.net wrote: Hello brian and all, I was attempting to validate the form manually and had deep problems with it. Now I'm using jQuery.validate plugin and almost everything goes OK, but I still have a couple of missunderstandings: 1. How can I tell the plugin that a valid login (#ulogin) is a login that fits to a regexp or, say, just doesn't contain whitespaces? Have a look at this: http://stackoverflow.com/questions/280759/jquery-validate-how-to-add-a-rule-for-regular-expression-validation 2. For some reason I can't make the plugin validate a group of radiobuttons (gender selection) that is required. I'm using $(#signup).validate( { rules: { ... usex1: required, ... } }); ... fieldset id=ugender legendSelect your gender:/legend input type=radio name=usex id=usex1 value=1Malebr input type=radio name=usex id=usex2 value=2Female /fieldset What am I doing wrong? I tried to validate #ugender but it didn't help, either. For the rules, the key is the name attribute of the element. You're using the ID of one of the radio buttons. Try: usex: required,
[jQuery] add element after page has loaded
Hi. I have the following document.ready: $(document).ready(function(){ $('#formGen1').load('formGen1.jsp'); if(${membership eq 'propertyContractor'}) { $('#formGen2').load('formGen2.jsp'); $('#formGen3a').load('formGen3a.jsp'); } else if (${membership eq 'cleaningContractor'}) { $('#formGen2').load('formGen2.jsp'); $('#formGen3a').load('formGen3b.jsp'); $('#formGen3b').load('formGen4.jsp'); $('#formGen4').load('formGen3a.jsp'); } else if (${membership eq 'staff'}) { $('#formGen2').load('formGen3a.jsp'); } $(window).load(function () { alert($('#dob').prev().html()); //run code }); }); the html loaded in 'formGen1' is: fieldset legendPersonal details/legend plabel for=nameName/label input class=required type=text id=name name=name/ span/span/p plabel for=dobDate of birth/label input type=text class=expanddate id=dob name=dob value= format=date span/span/p /fieldset What I want to do is add an element after the #dob element. In the 's$(window).load' statement I am showing the html of the previous element as some feedback... As I understand it, $(window).load should kick in after all the pages have loaded, but clearly in my case something else is going on... i.e. the pages havent loaded yet... How can I do this? Thanks. Kind regards. Luke.
[jQuery] simple jquery form plugin question
Hi, Just started using jquery and it looks really good! I have question regarding the jQuery form plugin. I tried to get the simplest example I could up and running but I ran into a wall. In the example when I press submit, I expect an alert box to appear but I only get directed to the url that is on the form's action. I expect to stay on the same page. any help is greatly appreciated. David html head titlejQuery Form Plugin/title style type=text/css form { background: #DFEFFC; border: 5px solid #c5dbec; margin: 10px 0; padding: 20px } /style script type=text/javascript src=../jquery-latest.js/script script type=text/javascript src=../jquery.form.js/script script type=text/javascript script type=text/javascript // wait for the DOM to be loaded $(document).ready(function() { // bind 'myForm' and provide a simple callback function $('#myForm').ajaxForm(function() { alert(Thank you for your comment!); }); }); /script /script /head body form method=post action=http://jquery.malsup.com/form/dummy.php; id=myForm Name:input type=text value=MyName1 name=Name/ input type=submit value=Submit1 name=submitButton/ /form /body /html
[jQuery] How would I implement this?
A component of my website needs a table that holds a lot of information. On most screens there will be too many columns to fit across the width of the site. I would like the user to be able to scroll through these columns (probably through use of buttons). Would it be possible to use jQuery to scroll all of the table columns to one side; effectively hiding a column on one side of the table and showing one on the other side? Any tips on how to going about doing this? What classes should I be taking a look at? Thanks in advance.
[jQuery] Autocomplete IE scrollbar not appearing
Hey, I implemented the jQuery Autocomplete plugin and when I do a search that returns a lot of items I want a vertical scrollbar. I added the scroll: true, and scrollHeight but the scroll bar doesn't want to work in IE (works in FF and Chrome perfectly). This is the jQuery I have for the plugin: $(document).ready(function(){ $(#Search).autocomplete('Search.txt', { width: 350, minChars:3, matchMatch: true, scroll: true, scrollHeight: 220, delay: 500 }); }); I also played with the CSS (jquery.autocopmlete.css) by adding overflow-y: scroll; and height .ac_results { padding: 0px; border: 1px solid black; background-color: white; /*overflow: hidden;*/ overflow-y: scroll; height: 220px; z-index: 9; } This got the scrollbar to appear in IE, but whenever I clicked on the scrollbar it went away because it lost focus or something. Is there anyway I can get the scrollbar working in IE browsers or some kind of workaround solution? Thanks, zLan
Re: [jQuery] How would I implement this?
Have you tried setting a max width and using the CSS overflow rule? On Wed, Nov 25, 2009 at 4:04 PM, Damien redjel...@gmail.com wrote: A component of my website needs a table that holds a lot of information. On most screens there will be too many columns to fit across the width of the site. I would like the user to be able to scroll through these columns (probably through use of buttons). Would it be possible to use jQuery to scroll all of the table columns to one side; effectively hiding a column on one side of the table and showing one on the other side? Any tips on how to going about doing this? What classes should I be taking a look at? Thanks in advance.
Re: [jQuery] simple jquery form plugin question
Are you sure that your javascript is being loaded properly? You can check that easily with Firebug or the FF WebDeveloper extension. On Wed, Nov 25, 2009 at 7:07 PM, David phon...@gmail.com wrote: Hi, Just started using jquery and it looks really good! I have question regarding the jQuery form plugin. I tried to get the simplest example I could up and running but I ran into a wall. In the example when I press submit, I expect an alert box to appear but I only get directed to the url that is on the form's action. I expect to stay on the same page. any help is greatly appreciated. David html head titlejQuery Form Plugin/title style type=text/css form { background: #DFEFFC; border: 5px solid #c5dbec; margin: 10px 0; padding: 20px } /style script type=text/javascript src=../jquery-latest.js/script script type=text/javascript src=../jquery.form.js/script script type=text/javascript script type=text/javascript // wait for the DOM to be loaded $(document).ready(function() { // bind 'myForm' and provide a simple callback function $('#myForm').ajaxForm(function() { alert(Thank you for your comment!); }); }); /script /script /head body form method=post action=http://jquery.malsup.com/form/dummy.php; id=myForm Name:input type=text value=MyName1 name=Name/ input type=submit value=Submit1 name=submitButton/ /form /body /html
Re: [jQuery] Using add/remove class vs. show hide for a swap out section?
Thanks for the help. I think we are getting somewhere. Here is where the page is being developed: http://banderdash.net/design/ The JavaScript you suggested is in the 'slide.js' file. Found here: http://banderdash.net/design/js/slide.js The problem I am running into now is that it appears the hide class is hiding the navigation. Because my sub-nav is itself inside the div.content (4 separate times). This was done to ensure the proper active class was shown automatically as one cycles through the sections. On viewing the page you might get a better idea of what I am trying to achieve. That is (from the black portion under the sketches), when a viewer clicks 'about' 'work' 'ramblings' or 'contact that div is swapped for the already present, but hidden other div's. Make any sense? Michael Geary-3 wrote: It would really help if you could post a link to a test page instead of posting code excerpts. For example, I don't see any HTML code that has id=link-about and your other links. Is that missing from your page, or did you just omit it in the code you posted? Are the LI elements supposed to be those links? In any case, since I can't help you get the code working, at least I can help you simplify it. Let me assume that those LI elements are your links. Then I would change them to this: ul li class=clicklink id=link-about # About /li li class=clicklink id=link-work # Work /li li class=clicklink id=link-ramblings # Ramblings /li li class=clicklink id=link-contact # Contact /li /ul and I would change your JavaScript - it's not Java, please :-) to: $(document).ready( function() { $('li.clicklink').click( function() { $('div.content').addClass('hide'); $( '#' + this.id.split('-')[1] ).removeClass('hide'); }); }); If that .content class is also used on other elements in your page, then I would another classname to your four content targets and change the $('div.content') to use that classname instead. -Mike On Tue, Nov 24, 2009 at 7:20 PM, rorourke r...@pixelbleed.net wrote: I'm mostly a CSS/HTML guy, so delving into jQuery is a bit more then my normal task list would contain, but I'm happy to suck up any knowledge that you may be able to impart. Here is my scenario: I have four div's each has a different class in additon to the .content class (which controls font and link styles for each of them), .about, . work, .ramblings, .contact. Each of these classes is by default shown. But I've applied a class of .hide to all the ones after .about, which is the default shown. What I have seems to work for the first link clicked after page load, but after that nothing is happening. I would like, whenever a link is clicked to show that sections div and hide the other three. I never want more then one section showing. This adding classes business or even just using the .hide() .show() functions doesn't necessarily work because the java for the ID has to handle every situation on any given click. Markup looks like this: ul li # About /li li # Work /li li # Ramblings /li li # Contact /li /ul div class=content about pYada/p /div div class=content work hide pYada/p /div div class=content ramblings hide pYada/p /div div class=content contact hide pYada/p /div Java looks like this: $(document).ready(function() { $('#link-about').click(function(){ $('.about').removeClass(hide); $('.work').addClass(hide); $('.ramblings').addClass(hide); $('.contact').addClass(hide); }); $('#link-work').click(function(){ $('.work').removeClass(hide); $('.about').addClass(hide); $('.ramblings').addClass(hide); $('.contact').addClass(hide); }); $('#link-ramblings').click(function(){ $('.about').addClass(hide); $('.work').addClass(hide); $('.ramblings').addClass(hide); $('.contact').addClass(hide); }); $('#link-contact').click(function(){ $('.about').addClass(hide); $('.work').addClass(hide); $('.ramblings').addClass(hide); $('.contact').removeClass(hide); }); }); -- View this message in context: http://old.nabble.com/Using-add-remove-class-vs.-show-hide-for-a-swap-out-section--tp26506957s27240p26506957.html Sent from the jQuery General Discussion mailing list archive at Nabble.com. -- View this message in context: http://old.nabble.com/Using-add-remove-class-vs.-show-hide-for-a-swap-out-section--tp26506957s27240p26523705.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Re: Cancel Selected An Item of Selectable
Thank you for replying my question. My situation is very easy I just want to ask whether the jQuery ui selectable provides a way to unselected one item by doing ctrl+click. Here is the sample: http://jsbin.com/ujile On 11月25日, 上午11时59分, Richard D. Worth rdwo...@gmail.com wrote: We'd be happy to help you over here: http://groups.google.com/group/jquery-ui http://groups.google.com/group/jquery-uiPlease post a live sample page showing the problem. If you don't have a way to host one, please create one on jsbin.com: http://jsbin.com/ - Richard On Tue, Nov 24, 2009 at 12:56 AM, I'm Jack junjie...@hp.com wrote: I used jQuery ui selectable function on my web page. So long it works fine, but I find a problem that if we’ve already selected some items, and I want to cancel selected one item of them, how could we do? I try to bind a click function to the elements to remove the style of ui- selected, but it doesn’t work at all. It’s so strange. Guys, could you help me in some way?- 隐藏被引用文字 - - 显示引用的文字 -
[jQuery] probelm with cluetip and radio button lists
I'm trying to create a radio button list programatically from a database, and have cluetip messages on the labels. I first created the databound radio button list in .NET and applied the code: $(document).ready(function(){ $('span.tips').cluetip({ splitTitle: '|', showTitle: true, arrows: true }); }); This works fine and shows the cluetip, but for some reason, you cannot click on the radio buttons to make a selection??? I suspected that the problem was because the span is around both the input and label tags: tdspan title= class=tipsinput id=publicHols_0 type=radio name=publicHols value= checked=checked /label for=publicHols_0None/label/span/td tdspan title=Holidays for Australia:|01 Jan 2010 New Year's Day| 26 Jan 2010 - Australia Day class=tipsinput id=publicHols_1 type=radio name=publicHols value=AU /label for=publicHols_1Australia/label/span/td So, I removed the .NET databound list, and used a json call to a handler file to create the radio button list like this: $(document).ready(function(){ $.getJSON('pubHols.ashx', function(country) { var i = 0; $.each(country, function() { var hols = input id=\RadioButton + i + \ type= \radio\ name=\publicHols\ value=\ + this['Region'] + \ /span title=\ + this['Holidays'] + \ class=\tips\label for= \RadioButton + i + \ + this['Country'] + /label/span; $('#pubHols').append (hols); i++; }); }); $('span.tips').cluetip({ splitTitle: '|', showTitle: true, arrows: true }); }); This time, the list of radio buttons appears ok, and you can make a selection, but the cluetip now doesn't work, and I just get the standard title appearing??? Any ideas or suggestions?
[jQuery] Re: JQuery value set delay
i've tried that one too, and get the same result. but now i already get the solution by using old way: document.pm_form.act.value = 'value'; btw, thanks for the help :) On Nov 24, 9:32 pm, Michel Belleville michel.bellevi...@gmail.com wrote: I think I've had something similar once, I'm not sure how I got it to work properly but you can try something on lines of : setTimeout($('#pm_form').submit();, 1); So you've returned and applied the changed before the form actually submits. Michel Belleville 2009/11/24 achmad dodi thead...@gmail.com Hello, I have a problem with submitting a form using a link, multiple link here is an example link i'm gonna use: a href=# class=commandBtn rel=mark title=Mark as ReadMark as Read/a a href=# class=commandBtn rel=remove title=Remove to TrashRemove to Trash/a the result I expect is when the link is clicked, a hidden input value replaced with `rel` attribute on the link and then submit the form, and here is the code: $('a.commandBtn').click(function () { $('#act').val(this.rel); $('#pm_form').submit(); return false; }); but after the form submitted, when I check the $_POST['act'] variable in PHP, it's return a default value. if I disabled the submit line in code above, the value change normally. but when I check it again using Firebug with submit line enabled, the #act hidden input value change when the form is being submitted. there is some delay when setting a value, as the result, the value is updated when the form is being submitted. can anyone give me a solution for this? and sorry for my bad english *Regards,* Achmad A.
[jQuery] custom event firing
Hi all, I am learning how to author jquery plug in and trying to fire a custom event using trigger and bind. However, for some reason, when I click the button first time, the custom event is not called. If I click again, the event will execute once. If I click the third time, the event will execute twice. Can you guys tell me what's wrong with my code? Really appreciate your help. my plug in (function($) { $.fn.hilight = function() { return this.each(function() { var $this = $(this); //hightlight //call trigger $this.trigger('myEvent'); }) }; })(jQuery); my html page $(document).ready(function() { $('#myButton').click(function(){ $('#myDiv').hilight().bind('myEvent', function(e) { alert('event fired'); }); }) }); -- View this message in context: http://old.nabble.com/custom-event-firing-tp26524737s27240p26524737.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
Re: [jQuery] custom event firing
i usually use something like this when coding a jQuery plugin. (function() { var newMethods = { // function start AddTo : function(options) { var defaults = { // set default option values here }; var options = $.extend(defaults, options); // access any options below this line var obj = $(this); }, // you seperate multiple functions by a *,* character // function end // function start RemoveFrom : function(options) { var defaults = { // set default option values here }; var options = $.extend(defaults, options); // access any options below this line var obj = $(this); } // function end }; jQuery.each(newMethods, function(i) { jQuery.fn[i] = this; }); })(); On Thu, Nov 26, 2009 at 8:06 AM, Allen123 chiupin.c...@gmail.com wrote: Hi all, I am learning how to author jquery plug in and trying to fire a custom event using trigger and bind. However, for some reason, when I click the button first time, the custom event is not called. If I click again, the event will execute once. If I click the third time, the event will execute twice. Can you guys tell me what's wrong with my code? Really appreciate your help. my plug in (function($) { $.fn.hilight = function() { return this.each(function() { var $this = $(this); //hightlight //call trigger $this.trigger('myEvent'); }) }; })(jQuery); my html page $(document).ready(function() { $('#myButton').click(function(){ $('#myDiv').hilight().bind('myEvent', function(e) { alert('event fired'); }); }) }); -- View this message in context: http://old.nabble.com/custom-event-firing-tp26524737s27240p26524737.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
Re: [jQuery] Re: JQuery value set delay
Let me check a little point though, did you set the *id* of your input to act or was act just the *name* ? Because this selector : $('#act') selects an element that has the *id* act, whereas in vanilla DOM document.your_form.act points to the element that has the *name* act. If so, no wonder your field wasn't changed in time, or at all. Michel Belleville 2009/11/26 Adods thead...@gmail.com i've tried that one too, and get the same result. but now i already get the solution by using old way: document.pm_form.act.value = 'value'; btw, thanks for the help :) On Nov 24, 9:32 pm, Michel Belleville michel.bellevi...@gmail.com wrote: I think I've had something similar once, I'm not sure how I got it to work properly but you can try something on lines of : setTimeout($('#pm_form').submit();, 1); So you've returned and applied the changed before the form actually submits. Michel Belleville 2009/11/24 achmad dodi thead...@gmail.com Hello, I have a problem with submitting a form using a link, multiple link here is an example link i'm gonna use: a href=# class=commandBtn rel=mark title=Mark as ReadMark as Read/a a href=# class=commandBtn rel=remove title=Remove to TrashRemove to Trash/a the result I expect is when the link is clicked, a hidden input value replaced with `rel` attribute on the link and then submit the form, and here is the code: $('a.commandBtn').click(function () { $('#act').val(this.rel); $('#pm_form').submit(); return false; }); but after the form submitted, when I check the $_POST['act'] variable in PHP, it's return a default value. if I disabled the submit line in code above, the value change normally. but when I check it again using Firebug with submit line enabled, the #act hidden input value change when the form is being submitted. there is some delay when setting a value, as the result, the value is updated when the form is being submitted. can anyone give me a solution for this? and sorry for my bad english *Regards,* Achmad A.
[jQuery] Re: probelm with cluetip and radio button lists
OK - I found my newby mistake. The cluetip function should be inside the getJSON function...
[jQuery] Re: value visible in ajax response, but not used in output
Hi Scott, thanks, that was what did the trick. I didn't need this without using the actual vars - then it worked well. But it makes sense I need to actually return the new result. D. On Nov 25, 5:57 pm, Scott Sauyet scott.sau...@gmail.com wrote: On Nov 25, 11:12 am, dcrunche henjohoek...@gmail.com wrote: When I check the response given in the console I see the output I want, but that is not showing on the page. Here's the JS I use:http://pastie.org/714683 I don't think you are actually using the resulting data anywhere in that code, except in the outermost success function. For each of the (three levels of!) nested .ajax calls, you ignore the returning data parameter. Perhaps you just need to copy this line to each of them: $('#productWizard fieldset').html(data); Cheers, -- Scott