Re: [jQuery] [mcDropdown] Enhancement Request
There's no need to add this to the code. You can just place the wrapper in the actual HTML and apply whatever CSS you need specific to the instance of the mcDropdown. -Dan On Mon, Jan 18, 2010 at 4:21 PM, Jerry jerryab...@gmail.com wrote: Howdy... The GivaInc.com site says that the devs monitor this list for stuff and they don't give out their emails anywhere on the site. So... The mcDropdown is great but needed a little push from me in order to get the field to display properly on a form with labels to the left of the field (versus above). Because of that I needed to have a way to create css for the anchor and wrapper div tags inserted by the mcDropdown plugin. I added the following two new defaults: , wrapperId: null // The id of the wrapper for more css control ... added 2010-01-18 Jerry Ablan jab...@pogostick.com , anchorId: null // The id of the anchor for more css control ... added 2010-01-18 Jerry Ablan jab...@pogostick.com In addition, the following was changed at line 160 (after insert of above two lines): // create the div to wrap everything in $divInput = $('div class=mcdropdowna ' + ( settings.anchorId ! == null ? ' id=' + settings.anchorId + ' ' : '' ) + 'href=# tabindex=-1/ainput type=hidden name=' + (el.name || el.id) + ' id=' + (el.id || el.name) + ' //div') .appendTo($('div ' + ( settings.wrapperId !== null ? 'id=' + settings.wrapperId + ' ' : '' ) + 'style=position: relative;/ div')) .parent(); With the wrapper div and anchor accessible now, I can style the CSS to get the field in the right place. Thanks!
Re: [jQuery] Sum up of selected classes
palgo: You probably mean: $(#total).val(tot); The selector $(total) would be looking for an element named total (i.e. total /,) where as $(#total) looks for an element with an id of total. -Dan On Fri, Nov 13, 2009 at 10:13 AM, palgo rusha...@gmail.com wrote: Hi guys, I have several input fields where the value get set (gave them class name =part). I want to sum up the input values into a last input field with class = total, whenever something is being typed in some other fields. The input fields with class part is not a fixed amount, they can vary between 2 to infinite. So I tried this, which doesn't work: $(.whatever).live(keyup, function(event){ var arr = $(.part); var len = arr.length; var tot = 0; while (ilen) { tot = tot +arr[i].val(); i--; } $(total).val(tot); }); Anyone know what I'm doing wrong?
[jQuery] Re: namespacing jQuery
See the $.noConflict() docs: http://docs.jquery.com/Core/jQuery.noConflict var j = *jQuery.noConflict*(); // Do something with jQuery j(div p).hide http://docs.jquery.com/Effects/hide(); // Do something with another library's $() $(content).style.display = 'none'; -Dan On Tue, Oct 27, 2009 at 10:25 AM, El Greg greglaval...@gmail.com wrote: I'm interested in namespacing jQuery to something like $myjQ. or myjQ. $ and wondering what the best way is to do it. I will potentially be using my version of jQuery on other pages that are running other versions of jQuery - hence the idea to rename it completely so that I have control over version, plugins, etc. I thought about just doing a find and replace on the word jQuery in the source, but I'm hoping there's an easier way. Thanks!
[jQuery] Re: $.post() speed
Adonis, The $.post() function is asynchronous (by default) when your code hits a $.post() call, it'll keep executing code. In order to do something with the results of your AJAX call, you'll want to use the callback option--which is a function run when the AJAX call is completed. -Dan On Thu, Oct 8, 2009 at 7:14 AM, Adonis achrysoch...@hotmail.com wrote: I am not entirely sure if i am using proper definitions here, but here it goes.. I have $.post() inside javascript functions. If ajax is successfull, it returns data from the server. I am trying to assign this data to javascript global variables. The problem is that my global javascript variables end up to be empty. It seems it takes time for the ajax to return the data and by the time the server data is returned, the browser has comploted reading through the rest of the javascript functions. Thus, leaving my global variables empty. Do you have any suggestions on how this could be fixed? I am trying setTimeOut() at the moment but i would be glad to concider other solutions as well.. I could provide code examples on request. Thanks in advance!
[jQuery] Re: load with callback confusion
The second argument for the load() function is data, not callback: http://docs.jquery.com/Ajax/load#urldatacallback Do this instead: $(span#mycontent).load(mytext.txt, {}, function(){ // callback code here }); -Dan On Fri, Sep 18, 2009 at 5:51 AM, geegler jkp_fb_st...@myvws.net wrote: How come this code doesn't work? $(span#myinfo).mouseover(function(){ $(span#mycontent).load(mytext.txt,function(){ var soffset = $(this).offset(); var stop = soffset.top; var ihgt = $(div#footer).css(height); var mtop = $(div#mydiv).css(top); var mhgt = $(div#mydiv).outerHeight() + 50; var ntop = stop - mhgt; $(div#mydiv).css(top,ntop); $(div#mydiv).fadeIn(slow); }); }); This version works but, I don't want to display the div element until the small text file has completed loading. $(span#myinfo).mouseover(function(){ $(span#mycontent).load(mytext.txt); var soffset = $(this).offset(); var stop = soffset.top; var ihgt = $(div#footer).css(height); var mtop = $(div#mydiv).css(top); var mhgt = $(div#mydiv).outerHeight() + 50; var ntop = stop - mhgt; $(div#mydiv).css(top,ntop); $(div#mydiv).fadeIn(slow); });
[jQuery] Re: Paste an image into a tag...
It's been a while since I've looked at either TinyMCE or FCKEditor (now CKEditor) but non of the WYSIWYG editors based on the browser can do what Hogsmill wants. In order to paste an image from the clipboard, you'll need something that can also upload the image to the server on the paste operation. The product I've used in the past to accomplish this is XStandard--which comes as either a Firefox add-on and an ActiveX control for IE. It does require an client installation, but it's a very powerful XHTML-based editor and works really well for us. The images are uploaded to the server via a web service on the paste operation--it even handles multiple images in the clipboard. We choose XStandard, because users could copy an entire Word document into the clipboard with multiple images and simply paste it into the XStandard editor and the content would get pasted complete with all the images in the Word document. There are some Java-based rich text editor controls I found too, but they were all much more expensive. Also, if you *only* care about pasting a single image (and don't really need the whole rich text portion) you could write a signed Java applet to do this. For our help desk application, I wrote a signed Java applet that would either take the screenshot for the user or allow pasting an image from the clipboard to add as an attachment. I can't share the code, but it's relatively straightforward (the biggest issue is handling clipboard operations on the Mac.) -Dan On Fri, Sep 18, 2009 at 9:22 AM, Peter Edwards p...@bjorsq.net wrote: Have you thought of using a rich text editor to do this such as TinyMCE and FCKEditor - they both have paste from clipboard functionality On Fri, Sep 18, 2009 at 11:12 AM, Hogsmill i...@hogsmill.com wrote: This may or may not be possible, but if anyone knows a way to do it, I'd love to hear from you. Basically, I simply (?) want to copy an image (e.g. from ALT-Print Screen or 'Copy Image'), and paste/drop it into an img tag on a page so it appears on the page. I can then resize, drag-drop, etc. as required. I've had a rummage around the net, but can't find anything. Maybe it's impossible? Cheers, Steve
[jQuery] New iPhone-style button plug-in released...
We've just released another jQuery plug-in which emulates the iPhone-style button used to toggle settings on/off. The plug-in works with both checkbox and radio button groups and we've worked hard to make this a complete plug-in. While there are several similar plug-ins, we couldn't find one that actually had all the features we needed--which is why we built this version. http://www.givainc.com/labs/ibutton_jquery_plugin.htm You can see a demo here: http://www.givainc.com/labs/ibutton_example.htm Here are the features: - Works with checkboxes or radio elements - Full keyboard support — use the [TAB] key to move from field to field and use the spacebar to toggle the status of the iButton (or use the arrow keys for radio buttons) - Custom event handlers - Detach iButton behavior from the element - Metadata support — when used with the jQuery Metadata Plug-inhttp://plugins.jquery.com/project/metadata, you can define the properties for your button completely within the class attribute of your input elements - Enable/disable drag support — while the dragging behavior is intuitive on touch-based devices, it's not always be the best or expected UI behavior and may cause some mouse users problems (NOTE: In order to help differentiate between an intended mouse click or an actual drag event, we're developed the clickOffset option. If the time (in milliseconds) is under this value (120ms by default) it's assumed the user was attempting to click the button and not drag the handle.) - Enable/disable animation - Single sprite image — easily change the look of your button by just replacing the image sprite - Customizable labels — use any labels you want for your buttons - Support for disabled buttons - Easing support for animations - iPhone support Hopefully some of you find this useful. -Dan
[jQuery] Re: New iPhone-style button plug-in released...
Keyboard support is often overlooked, but it's always high on our priority list because many of our users are very keyboard centric and don't like using the mouse at all. On Fri, Sep 4, 2009 at 12:23 PM, Dave Methvin dave.meth...@gmail.comwrote: We've just released another jQuery plug-in which emulates the iPhone-style button used to toggle settings on/off. Very nice, Dan. I like the way you haven't forgotten keyboard access.
[jQuery] Re: input has focus
You can add a class to your field when it has focus and then check for the class: $(:input) // add focus/blur events .focus(function (){ $(this).addClass(has-focus); }) .blur(function (){ $(this).removeClass(has-focus); }); Now you can just do $(input#1).is(.has-focus) to check if it has focus. -Dan On Mon, Aug 10, 2009 at 3:20 PM, MartinBorthiry martin.borth...@gmail.comwrote: Hello: I'm trying to know if an input has focus. Is that possible using jquery? samething like this: $('input#1').has_focus()
[jQuery] Re: [Linkselect] Change function fires when using replaceOptions
skube, This is not a limitation, but a specific design decision. If you're replacing the options in a select box you are in affect also changing the value (or at least potentially changing) the value since you now have a completely new set of values in the box. Therefore, to ensure that dependency attached to the behavior are correctly carried through the change callback is fired. For example, let's say had 3 linkselects in your chain. Select 1 changes the options in Select 2 and Select 2 changes the options in Select 3. When you change the value in Select 1, the options in Select 2 will change, however the options in Select 3 will also correctly change to reflect the new value in Select 2. However, if you *really* need to avoid the callback from running, the replaceOptions() method does have a second argument you can set to false for preventing the change callback from running. However, this really should be the exception to the rule and should only be used if you're going to end up with some kind of circular logic. -Dan On Tue, Aug 4, 2009 at 2:54 PM, skube sku...@gmail.com wrote: Ok, I think I have one last outstanding problem with Giva Labs' awesome Linkselect plug-in. I'm wondering if it is a limitation of the plug-in or if I am simply doing something wrong. I am using one select to update another and everything works perfectly. However, I am finding the change function fires when I use replaceOptions to update the second select even though I'm simply re-initiating the second select with a new set of options. I think the change function should only fire when I do I physically select another option in the second select and not every time I update the first select. I've recreated a cut/paste demo to illustrate the point below. As you can see, the alert occurs when changing either the first or second select. ?xml version=1.0 encoding=UTF-8? !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Strict//EN http:// www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd html xmlns=http://www.w3.org/1999/xhtml; xml:lang=en lang=en head titleTest/title script type=text/javascript src= http://ajax.googleapis.com/ajax/ libs/jquery/1.2.6/jquery.min.js/script script type=text/javascript src= http://www.givainc.com/labs/lib/ jquery.linkselect.js/script script type=text/javascript src= http://www.givainc.com/labs/lib/ jquery.bgiframe.js/script link type=text/css href=http://www.givainc.com/labs/css/ jquery.linkselect.css rel=stylesheet title=default media=all / link type=text/css href=http://www.givainc.com/labs/css/ jquery.linkselect.style.select.css rel=alternate stylesheet title=select media=all / script type=text/javascript $(function(){ $(#one).linkselect({ change: function(){ $(#two).linkselect(replaceOptions, [{value:1,text:asdf}, {value:2,text:qwer}]); } }); $(#two).linkselect({ change: function(){ alert('fired prematurely'); } }); }); /script /head body select id=one optionoption 1-1/option optionoption 1-2/option optionoption 1-3/option /select select id=two optionoption 2-1/option optionoption 2-2/option optionoption 2-3/option /select /body /html
[jQuery] Re: Filter List Items w/ Sub-Lists
Try: $('.start-here li').filter(':has(ul)').append('span class=ui-icon ui- icon-plus/span'); -Dan On Wed, Aug 5, 2009 at 11:59 AM, Panman rpann...@gmail.com wrote: I have selected a list that contains sub-lists. Now, I'd like to search for the list items that contain sub-lists (but not including the sub-list-items). I think the example below will explain what I'm trying to do. HTML: ul class=start-here liDo Not Need/li liNEED THIS ITEM ul liDo Not Need/li liDo Not Need/li /ul /li liDo Not Need/li liNEED THIS ITEM ul liDo Not Need/li liDo Not Need/li liNEED THIS ITEM ul liDo Not Need/li liDo Not Need/li /ul /li liDo Not Need/li /ul /li liDo Not Need/li /ul jQuery: $('.start-here li').filter(':has(li)').append('span class=ui-icon ui- icon-plus/span'); The above jQuery statement selects the correct li but also all child li's, which I do not want.
[jQuery] Re: [linkselect] Positioning menus off bottom of window
Sherri, You can use the open callback to handle repositioning the container if you wish. The callback gets 4 arguments: $container, $a, $selected, $title The $container argument is a jQuery object referencing the dropdown. You could just offset it's top position by XXX amount to move the box up. -Dan On Mon, Aug 3, 2009 at 10:07 AM, Sherri enigmaticf...@gmail.com wrote: Hi all, I'm working on a website where we're using the jquery.linkselect plugin, and we're running into a situation where we have one of the dropdown linkselect menus happening near the very bottom of the users' window. Imagine that we have a list of articles with abstracts, authors, etc. running down the left hand side in a div which is set to show a scrollbar if the results list gets long, and each article has a linkselect dropdown menu. Unexpectedly, if you've scrolled to the bottom of the scrolling div and you're on the last item in the list, linkselect is allowing the menu to drop down extending past the bottom of the scrolling div and outside the boundary of the browser window. This is problematic, as it makes the menu items inaccessible. We're looking for a way to have it automatically detect the bottom of the screen and reposition the menu accordingly (similarly to the way it does it to make sure it doesn't get positioned off the right hand side of the screen). I might be able to hack it, but was hoping maybe the linkselect team might be able to put something in more quickly and efficiently than I can. :) Alternately, a way to specify that a menu drops up rather than drops down would also be a great solution to our situation (I didn't see that in the options, though please let me know if I missed it). Thanks in advance for any help, --Sherri
[jQuery] Re: Linkselect Plugin Woes
What's your code looks like? Are you using the replaceOptions() method correctly: $(#id).linkselect(replaceOptions, options*, doCallback*) Replaces the options in the dropdown with the array of objects passed into the options argument. You can use this API method to repopulate a Linkselect with options via an AJAX call. When the options are replaced, the changecallback is triggered for the newly selected item. You can set the doCallback to false to prevent callback from being triggered. For example: var options = [ {value: 1, text: Option 1} , {value: 2, text: Option 2} , {value: 3, text: Option 3, selected: true} , {value: 4, text: Option 4} , {value: 5, text: Option 5} ]; $(#id).linkselect(replaceOptions, options); Each item in the options array is a JavaScript object that must contain at least the keys value and text. Also supported are the keys selected (which can be true for any single item that needs selecting) and the className key, which can be used to define a class for the option / element. Are you using v1.2.07? -Dan On Thu, Jul 30, 2009 at 1:17 AM, bharathbhooshan ambati bharathbhooshan.amb...@gmail.com wrote: please check the link its not wrking On Thu, Jul 30, 2009 at 1:02 AM, skube sku...@gmail.com wrote: I'm having a problem with the GivaLabs' Linkselect plugin (http:// www.givainc.com/labs/linkselect_jquery_plugin.htm) and I'm wondering if anyone has any insight? The plugin works great for most things, expect when I try to use the replaceOptions to repopulate the option list. I keep getting the following error: I[0] is undefined Failed to load source for: jquery.linkselect.min.js It seems like a generic error, but I'm wondering if anyone could offer any input? -- భరత్ భూషణ్ అంబటి
[jQuery] Re: Linkselect Plugin Woes
skubie, I've fixed the problem. The error was in the repaint() method--which was expecting that the select / element had a title attribute. I've uploaded a fixed version of the plug-in: http://www.givainc.com/labs/linkselect_jquery_plugin.htm Let me know how the new version works out for you. -Dan (BTW - I recommend looking into adding a title attribute to your select tag, it can make the linkselect a little more user-friendly.) On Thu, Jul 30, 2009 at 11:35 AM, skube sku...@gmail.com wrote: Here is a distilled (cut and paste) version of the code. Only the plugin is not supplied. The error that is coming up is I[0] is undefined ?xml version=1.0 encoding=UTF-8? !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Strict//EN http:// www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd html xmlns=http://www.w3.org/1999/xhtml; xml:lang=en lang=en head titleTest/title style type=text/css a.linkselectLink {text-decoration:none; display:block;} .linkselectContainer {position: absolute; left: 0; top: 0; display: none; max-width: 500px; } .linkselectContainer .scrollable {width: auto; background- color: white; text-align: left; overflow: auto; max-height: 216px; clear: both;} .linkselectContainer ul {margin: 0px; padding: 0px;} /style script src=http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/ jquery.min.js type=text/javascript/script script src=jquery.linkselect.min.js type=text/javascript / script script type=text/javascript $(function(){ $(#one).linkselect({ change: function(){ $(#two).linkselect(replaceOptions, [{value:1,text:asdf}]); } }); $(#two).linkselect(); }); /script /head body select id=one optionoption 1-1/option optionoption 1-2/option optionoption 1-3/option /select select id=two optionoption 2-1/option optionoption 2-2/option optionoption 2-3/option /select /body /html
[jQuery] Re: Linkselect Plugin Woes
The title attribute isn't required--it's optional. However, we use it as a hint in the dropdown to provide the user with some form of instruction. On Thu, Jul 30, 2009 at 4:37 PM, skube sku...@gmail.com wrote: Oh and I didn't clue into the missing title attribute since my page was validating fine using Tidy. On Jul 30, 4:29 pm, skube sku...@gmail.com wrote: N/m I now see the page has been updated with version 1.2.08. Thanks Dan! This was frustrating the heck out of me. :)
[jQuery] Re: jquery.calculation modification
Since you have a very specific use case, you're probably better off just writing custom logic to accomplish this task. However, one way you could hack this solution is to define a custom jQuery.fn.getValue function: jQuery.fn.getValue = function (){ return this.attr(some_str); } If the calc plug-in finds a jQuery method called getValue it'll use that function to retrieve it's value instead of the val method. So you can just write a getValue method that grabs the value from the correct location. Just be aware that the getValue() method will be used for all the methods in the calc plugin for retrieving the value. -Dan On Wed, Jul 15, 2009 at 8:57 AM, introvert aljaz.faj...@gmail.com wrote: Hello, I need some help on jquery.calculation plugin modification (I want to change it so that it would also read the attributes of elements if a string is passed as an attribute name). I want to change the .calc function so that I could optinally pass a string with each jquery object which are passed as an array of objects: ([id^=total_item]).calc( qty * price, // define the variables used in the equation, these can be a jQuery object { qty: $(input[name^=qty_item_]), price: $([id^=price_item_]) }, function (s){ return $ + s.toFixed(2); }, function ($this){ } ); I want to be able to specify a string for each row in an array (qty, price) (as an array). Maybe something like: qty: $(input[name^=qty_item_])[some_str], price: $([id^=price_item_]) I'm unsure how should I change the syntax and retrive the value inside the calc function (the second argument is called vars): for( var k in vars ){ // replace the keys in the expression expr = expr.replace( (new RegExp(( + k + ), g)), _.$1); if( !!vars[k] !!vars[k].jquery ){ parsedVars[k] = vars[k].parseNumber(); } else { parsedVars[k] = vars[k]; } } Many thanks in advance!
[jQuery] Re: mcDropdown jQuery Plug-in v1.2.07
Darren: One thing to keep in mind is this plug-in was designed to be a new form UI control that allows the users to type in their choices. Thus, the default behavior when clicking in the box puts the focus in the text box so you can begin typing. However, you could accomplish what you want by: * Using a div element instead of an input / element. This will make the dropdown readonly w/no keyboard support. * Attaching a click handler to the layer with the mcdropdown class Example: div id=mcdropdown/div script type=text/javascript // create the drop down $(#mcdropdown).mcDropdown(#menu); // attach a click handler to the div class=mcdropdown element $(#mcdropdown).parent().click(function(){ // when the element is clicked on, open the menu $(#mcdropdown).mcDropdown().openMenu(); }); /script I haven't tested this extensively, but it should work. -Dan On Fri, Jul 10, 2009 at 6:17 AM, takuhii taku...@googlemail.com wrote: I am using this FANTASTIC drop down plugin for jQuery, but wondered how I can customise it so that rather than hit the button ont he right, I can click the whole active area to get the dropdown to appear. I currently have the menu attached to a single line text box and would like it to open up when ever I click in the text box, or on the dropdown arrow? Also, how can I specify some default text in the text box that is acting as my dropdown launchpad? Regards Darren
[jQuery] New Plug-in: Marquee, an ESPN-style ticker...
My current employer (Giva, Inc) has released another jQuery plug-in today called the Marquee jQuery Plug-in. The jQuery Marquee plug-in converts a list element (ul / or ol /) into an ESPN-style scrolling marquee. Messages are scrolled in from top or bottom (based on the yScroll option) and longer messages will then ticker to the left in order to show the full message. While there are a number of ticker/marquee style plug-ins, nothing did exactly what I needed. I really wanted something that would scroll up/down new messages, but would then ticker messages that didn't fit on the screen. In our SaaS application, our customers wanted a place at the top of the screen where they could put important notices to their clients, and they seem to be very happy with the effects we use in this plug-in. The Marquee jQuery Plug-in has an example you can look at or you can see several different marquees in different configurations at: http://www.givainc.com/labs/marquee_example.htm Marquee Plug-in: http://www.givainc.com/labs/marquee_jquery_plugin.htm Marquee jQuery Project Page: http://plugins.jquery.com/project/giva-marquee The plug-in is only 3K minimized. -Dan
[jQuery] Re: Known issues with webkit and jQuery 1.3?
Kelvin, While I didn't really dig into the problem, looking at the inspecting the jScrollPaneContainer element in Chrome, the width is being set to 1130px for me. My guess is something in your code is calculating the wrong width for the element. My best guess is this is due with the issue in Webkit where if you don't load *all* the CSS before the JS, then the ready() function fires before all the CSS is applied, therefore your dimensions can be off. You might try moving the scrollpane code in a $(window).load() event temporarily to see if that changes things. -Dan On Tue, Apr 28, 2009 at 1:13 PM, Kelvin Luck kelvin.l...@gmail.com wrote: Hi again, I have now reproduced the issue in Safari on PC and now Chrome on PC. One of the user's reported a problem with this site: http://warehousetwentyone.com/ Clicking back and forth between warehouse and services in the aforementioned browsers sometimes breaks. A refresh fixes it. And it never breaks on the initial load. So it appears to be a webkit issue but I'm not sure exactly where it is going wrong... Any ideas still much appreciated, Kelvin :) On Tue, Apr 28, 2009 at 9:53 AM, Kelvin Luck kelvin.l...@gmail.com wrote: Hi, Sorry for the vague question but I'm wondering if there are any known issues with webkit browsers (e.g. Safari and Chrome) and jQuery 1.3? I've had quite a few queries from users of my jScrollPane plugin who have noticed issues with it on Safari on mac. They seem to be related to either document.ready firing at the wrong time or possibly to calculations of height going wrong. You can see some of the reports here: http://code.google.com/p/jscrollpane/issues/detail?id=60 It also seems to be related to the state of the user's cache. One user said: Scrollbar works correctly on first load, but breaks when one or more of the dependent files loads from the browser cache, specifically in Safari on Mac. while another said: Loads frequently with no scrollbars at all, on refresh is fine.. This is what makes me wonder if the problem is related to document.ready... It seems like some people solved the problem by adjusting the order of the script and css files in the head of the document but this didn't work for everyone. I first started getting reports like this around the time jQuery 1.3 came out and I don't think there were any previous to that. So it may be related to 1.3. But it could also be related to some changes I did at that time... I am asking my users to help me debug but I wondered if there was any known issues that might be causing this... Thanks for any ideas or pointers, Kelvin :)
[jQuery] Re: Form plugin: input elements excluded
Dennis, You could do a manual AJAX submit and then just manually serialize your form fields. Also, before doing the AJAX submit, you could do something like: $(#your_form).append(#your_dialog); This would move the fields back into the form / element. -Dan On Mon, Apr 27, 2009 at 5:16 AM, dth dennis.thry...@gmail.com wrote: Aha! I guess it must be because the dialog is moved to be the last element of the body element, and thus outside of the form. I guess that's necesarry for absolute placement etc. I'll see if I manually can pick up the extra field values. Suggestions are welcome :) -dennis On Apr 27, 11:11 am, dth dennis.thry...@gmail.com wrote: According to firebug not much is altered, and the fields should be included in the form as far as I can tell. But they aren't :/
[jQuery] Re: Synchronized 2 ajax calls
Use the complete callback to run some logic after an ajax call is complete. So you can do something like: $.ajax({ url: first_url , type: post , complete: function (){ $.ajax({ url: second_url , type: post , complete: function (){ alert('done with 2nd call!); } }); } }); -Dan On Sun, Feb 22, 2009 at 7:37 AM, major mei...@gmail.com wrote: I have ajax call which implemented in Dojo. I need some JQuery mechanism which allow 1 ajax call to run, only after the former call has finished. I need such mechanism, since there is a known bug in IE which cannot run 2 ajax calls simultaneously.
[jQuery] Re: New jQuery Conditional Chain Plugin
On Mon, Feb 9, 2009 at 4:45 PM, Eric Garside gars...@gmail.com wrote: Not really, ternary operators work fine for most situations. This is designed for a much more variable approach. Imagine a case where you want to conditionally call different functions based on the state. $('div').cond(settings.use_thumbnails, 'createThumb').cond (settings.use_image_security, 'createScreen', settings.screen_opacity); You can still use ternary operations when you need a dynamic method as well: $(div)[condition ? addClass : removeClass](myClass); -Dan
[jQuery] Re: $(document).keydown only works in FireFox?
The enter key is only registered on a keypress event in IE and Webkit--so use keypress instead. -Dan On Mon, Jan 5, 2009 at 6:20 AM, s0h0 simon.rueckert@siemens.com wrote: Hello, i tried to use jQuery for cross browser compatibility...I want to execute a click on a Button when Enter got pressed on page... but the following script still only works in FireFox and not in IE. can anyone help me or have an idea? script type=text/javascript src=jquery.js/script script type=text/javascript $(document).ready(function() { $(document).keydown(function(evt) { if (!evt) evt = window.event; if (evt.keyCode == 13) { // alert(enter captured from IE); $(btnCanelEditUser).click(); } else if (evt.which == 13) { //alert(enter captured from Gecko, Opera); $(btnCanelEditUser).click(); } }); }); /script -- View this message in context: http://www.nabble.com/%24%28document%29.keydown-only-works-in-FireFox--tp21289326s27240p21289326.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Re: firebug regression: console.log($('div')) less useful
It's a Firebug change. Use console.dir() instead (but I agree--I like the old console.log() method) On Fri, Jan 2, 2009 at 1:10 AM, Danny d.wac...@prodigy.net wrote: Has anyone else noticed that Firebug before 1.2 would treat console.log ($('div')) as an array and list all the matched elements on the console, so you could mouse over the list and highlight the elements, or right-click and scroll into view etc., but now it just lists Object length=13 and you need to click on that, then you get a vertical list that you need to scroll through. The old way was more helpful, I think. John Resig, you're the Mozilla Firebug person as well as the jQuery Man; can this be fixed? Workaround: console.log.apply(console, $('div').get()) comes close to reproducing the old behavior. I'll crosspost this on the Firebug list.
[jQuery] Re: Spammer bypassing JQ Validate to register?
So, this dude from Poland managed to register without a first name, without a last name and likely without an invitation code. I'll deal with the EE issues separately, but is there a known issue where someone can mess with the jquery in the page to bypass the validation that is running? As David said, client-side validation is purely for the benefit of the user--it offers no security to your site. All you need to do is to turn off JavaScript to bypass the validation (however, the spammer is problem just using a bot to post directly to your submission page.) -Dan
[jQuery] Animation speed dilemma...
I'm working on an ESPN style ticker and one of the problems I'm running in to is that I need to base animation on a specific speed, not a duration. Right now the animations all are based on duration (aka complete this animation in 2 seconds.) However, I need my animations to all run at the same visual speed (like 12/frames a seconds.) Any easy way to do this with the built-in animation methods? I can roll the animation up manually, but thought there might be a tip for converting the animation speed to frames per second instead of overall duration. -Dan
[jQuery] Re: SOT: Blinking cursor in Firefox 2 bleeds through divs...
Mike, No matter what I set the z-index to, it always blinks through the layer. Here's a very straightforward example that shows the issue in every version of FF2 I have: Dan, do you have the cursor keys option enabled? No--that's a different issue altogether. :) That was one of the first things I checked. Are you not seeing the issue in FF2? -Dan
[jQuery] Re: SOT: Blinking cursor in Firefox 2 bleeds through divs...
Karl, I wish I could give you some good news, but instead I can only commiserate. FF 2 had all sorts of problems like that. Try having an absolutely positioned div overlapping the scrollbar of a div with overflow: scroll. Ugly. I even recall seeing a cursor in one tab's textarea blinking through to the currently visible tab. Those problems appear to have been fixed in FF3. FF3 works as expected. I know FF2 has a few bizarre issues like this, but I just thought placing a div overlay over an input field was common enough that there might be a fix for the issue. -Dan
[jQuery] SOT: Blinking cursor in Firefox 2 bleeds through divs...
I have a weird problem I'm running into again, but haven't been able to find a fix. In FF2, when I place a div / over an input / element that currently has focus, the blinking cursor shows up through the top layer. I put together this little video to show off the problem: http://blog.pengoworks.com/index.cfm/2008/12/4/Blinking-cursor-in-Firefox-2- bleeds-through-divs Does anyone know of a fix for this problem? -Dan
[jQuery] Re: linkselect plugin problem (related hover gets deactivated) -- help please
Carl, Thanks. I'm attempting what you suggested, but maybe my syntax is incorrect? Firebug tells me missing ) after formal parameters. Can you point me in the right direction? // replace select objects in the main content $(document).ready(function (){ $('#container select').linkselect({fixedWidth: true}); }); // replace select objects in the header navigation $(document).ready(function (){ $('#header select').linkselect({ fixedWidth: true , init: function ($select, $input, $am $container){ $('#navNewsSearch').append($container); } }); }); I suspect somewhere in your code you've missing a closing parentheses. -Dan
[jQuery] SOT: Using FF2 input element sometimes including padding in width...
This is slight off-topic, but I thought maybe someone on this list might have seen the issue before. I've got an input element that has some a large padding to include a background image icon. Most of the time in FF2 the element renders properly, however occasionally the input element renders it's 100% width so that the padding is included in the width (making the element too large for the space its in.) This is seemingly random, but once it starts rendering it that way it tends to render it that way for an indeterminable amount of time and then it will eventually start rendering properly. I suspect this is just a bug in FF2, but wanted to see if anyone's seen the issue before and has a fix. Here's what the pertinent code looks like: #search_input { background: #fff url(./images/1.5/icons/search_text_16_disabled.png) no-repeat 4px 4px; font-size: 10px; padding: 5px 5px 5px 25px; border: 1px solid #c3c3d5; width: 100%; color: #ccc; } #search_input.active { background-image: url(./images/1.5/icons/search_text_16.png); border: 1px solid #d07c57; color: #4c4c4c; } div input type=text name=search id=search_input value= / /div -Dan
[jQuery] Re: linkSelect - the width of the options container
Snobo, I stumbled upon the situation, which seems confusing to me. In my app, I noticed that the LinkSelect used to create the container for its option list which is too wide. I read the docs and found the option fixedWidth. To my bewilderment, it didn't work. I fired the Venkman and analyzed, what's going on... So, the following piece of code takes care of the container width (lines 532-537): // get the width of the anchor link unless inline, then grab width of parent var aw = ($a.css(display).indexOf(inline) -1) ? $a.parent().outerWidth() : $a.outerWidth(); // get the original width of the container var width = options.fixedWidth ? aw : $container.width(); // make sure the width of the drop down is at least as wide as the link if( width aw ) width = aw; in my case, the fragment of DHTML structure (after LinkSelect has already transformed SELECT into A) is: td h5ORIGIN/h5 labelCountry: /label a class=linkselectLink id=_link href=#Select country.../ ainput type=hidden value= id= name=/ labelPort:/label a class=linkselectLink id=_link href=#Select city.../ainput type=hidden value= id= name=/ /td so, while the width the options for each SELECT is only appox 140px, LinkSelect executes the line if( width aw ) width = aw; and takes the WIDTH OF THE CONTAINER (td), which is way bigger - 330px in my case. Needless to say, the container turns to be excessively wide. I worked this around by enclosing my original SELECTs in a span. But the question to the developers of LinkSelect - is it the intended and correct behavior? Yes, this is the expected behavior and it's done by design. If the link is an inline element, then the container will size to it's parent element (unless the CSS rules change this behavior.) However, you can control this behavior via CSS by imposing a max-width to the container or by just altering the CSS, like in Example 10 (go to http://www.givainc.com/labs/linkselect_example.htm#example10 and click on the Select Style button; you'll see the width of the container is the same size as the anchor element.) -Dan
[jQuery] Re: Select an element in an ancestor selector
(this).parents().find(a.apImg).addClass(apImgOn).removeClass(apImg); You could trim this to: (this).parents(a.apImg).addClass(apImgOn).removeClass(apImg); -Dan
[jQuery] Re: mcdropdown mouseout problems
Ken, I am trying to use mcdropdown for an easy search function for a shopping cart. The category list is long enough to force two columns. When mousing from the first column to the second the entire menu will disappear. In another case when drilling down below 3 levels if you mouse up to a parent selection the entire menu will disappear. My test page is at: http://reloadinginternational.com/catalog/includes/index_nav.php To experience the first issue select search by caliber and use the mouse to select from the second column (works if you're really quick). To experience the second issue, select search by manufacturer, highlight a style, highlight a caliber. Then move the mouse back up to the selected style. This is an incredible plugin but these issues really limit it's use in a lot of cases. The problem is due to the anchor tags. That's going to cause problems with the event handlers attached to the li / tags. What you need to do is remove the anchor tags and select option to go to the URL: $(#category).mcDropdown(#nav, { select: function (value, display){ select.location = /catalog/index.php?cPath= + value; } }); This plug-in was really designed to be a form control, not a navigation control (which is why anchors don't work well.) If you remove the anchors and just use the code above, things should work well. -Dan
[jQuery] Re: mcDropDown: any click event fire the drop down animation
Like the topic says, any click, right or left, fires the animation for the mcDropdown. It disappears right after. Has anyone encountered this bug? Any fixes/workarounds? Are you seeing the problem on the example page? http://www.givainc.com/labs/mcdropdown_jquery_plugin.htm What version are you using? Is there a live example of the problem you're having? -Dan
[jQuery] Linkselect Plug-in Released...
My current employer has released another jQuery plug-in: the Linkselect jQuery Plug-in. This plug-in converts a normal select / element into a component that can be highly stylized via CSS. While there are a number of similar plug-ins already, there are a several of key differences which we think make this unique: * Drop down menus are intelligently positioned to stay in the viewport * Specifically designed to work in a limited amount of real estate * Specifically designed to work well with elements aligned on the right edge of the viewport * Full keyboard support (emulates IE6's select / element) * Feature rich API (for updating value, replacing options, disabling elements, etc) * Many callback features to control behavior (on change, on init, on format, etc.) * Supports tabindex I blogged about this on Friday and also posted a little video demo: http://blog.pengoworks.com/index.cfm/2008/10/17/Linkselect-jQuery-Plugin-Rel eased You can download the plug-in from: http://www.givainc.com/labs/linkselect_jquery_plugin.htm Here's an example page: http://www.givainc.com/labs/linkselect_example.htm -Dan
[jQuery] Safari/WebKit bug with maxWidth?
This doesn't look like a jQuery issue per-se, but webkit doesn't seem to return a value for: $el.css(max-width) or $el[0].style.maxWidth IE and FF both return the correct value, but Webkit returns none. Is there a way in Webkit to get the maxWidth of an element? -Dan
[jQuery] Re: livequery strange behaviour
I've recently discovered livequery plugin, but I can't make it work. I explain: I have the next code: $(document).ready(function (){ alert (executing jquery); $([EMAIL PROTECTED]).livequery(function(){ alert(hey, one div wanna be rounded!); ${this}.rounded(); }); }); ...and it doesn't work. Neither the first alert nor the second one is invoked. But if I drop the line: ${this}.rounded(); That's because you don't have parenthesis around (this)--you have curly brackets {this}. -Dan
[jQuery] Re: Dan Switzer's Autocomplete plugin - can I do this...
Andy, First I'd recommend updating to latest version that Jörn's been managing. I have no plans on updating my version. I'm using Dan's autocomplete plugin in an app and it's working great. I just have one question. I'm loading in all options (around 5-10) into an array when the page loads. I'd like to trigger the list selection screen when the user clicks into the text field. Is this possible? So if I've got the following in my array: [Accessories,Interior,Maintenance,Parts,Service,Tires,Vehicle Sales] I'd like all of those items to display when the user clicks the text field. Then, as they type, it would filter out other options. Or of course they could select it straight away, or type their own. I thought it would be enough to put a click handler on the input field like so: .click(function(){ showResults(); }); but that doesn't work. Anyone? Dan? I think you might be able to hack it the way you want by changing the line: var prev = ; to: var prev = null; And then you'd need the to set the option minChars to 0. I haven't tested this and don't know what else this might impact. -Dan
[jQuery] Re: Dan Switzer's Autocomplete plugin - can I do this...
Andy, I think it might actually work without those changes you suggested. Problem is that at the point I'm calling the plugin, it doesn't recognize showResults as a method: That's a private function that only the plug-in can access. -Dan
[jQuery] SOT: Documenting keyboard entry for select element
Has anyone seen any good documentation on how the keyboard selection works for the select / element in the various browsers. It looks like the behavior is pretty different in each browser. Firefox and IE7 allow variations of doing ba to select the first option with a string starting with ba, however the actual implementation differs (and quite frankly confusing.) IE6 only allows you to toggle through the first letter. So press b and then a would go to the first option starting with b and then go to the first option starting with a. I've been trying to find any documentation, preferable something really indepth. We've had some customers ask for use to replicate this behavior in a plug-in, but since the behavior is so different in all the browsers I'm trying to really fully understand how each method works before I make recommendations. -Dan
[jQuery] Re: Adding Values (Sum) of TD.
Scott, I am trying to do a footer at the bottom of the table, and I would love to use jquery to provide a total in the footer, something like this: 1 | 1 | 3 2 | 1 | 4 -- 2 | 2 | 7 (JQuery added the TDs above) Is it possible? And can anyone point me in the right direction. You should be able to do this pretty easily using my Calc plug-in: http://plugins.jquery.com/project/calc -Dan
[jQuery] Re: delayed action
what if i need to make such actions: after sending e-mail write message your message was sent, than wait for sometime and close the form. i tried setTimeout($('#somediv').fadeOut, 5000) , but it did not work You need: setTimeout(function (){ $('#somediv').fadeOut(); }, 5000); I believe there's also a pause() or delay() plugin on the jQuery site that does the same thing, but uses chaining: $('#somediv').pause(5000).fadeOut(); -Dan
[jQuery] Re: do I need to use var $var = something
I've seen jQuery developers use the following syntax when declaring variables. Does the $ character help in any way? Does it do anything or is it mostly just for convenience. For example is this: var paras = $(p); better than this: var $paras = $(p); The $paras declaration identifies it as a jQuery object. The $ doesn't hold any special function, it's just a way of using Hungarian Notation. Take the following: var el = document.getElementById(products); var $el = $(el); You now you know that el is a reference to the straight DOM object, while $el is a reference to the jQuery equivalent. -Dan
[jQuery] Re: do I need to use var $var = something
Forgive me if this sounds ignorant, but...if I understand correctly, using $ is purely for the developers own benefit so they remember that the variable is using jQuery. Correct. That's the idea behind the Hungarian Notation (which I recommend you read up on if you want more information.) You're using pre-determined naming convention with variables so that you can easily identify the data type by the variable name. -Dan
[jQuery] Re: $(this) is powerful, but is it a member of the family?
I have two jQuery books and scant coverage of $(this) between them. I need to know if $(this) has parents, children and siblings, and if so how to access them. Here's why... I have a page with six one-line forms on it. I put the forms in divs and hide the divs on page load based on the class of the divs. Each div has an immediate sibling a that will toggle the form on a click. It works great if I write a separate function for each div, but I want to combine them into one function, bind that function to all of the a by ID and use $(this) to know which is which when the event fires. No problem, except that I need to fire the event on the next sibling, not on the element I get with $(this). I've tried using the + sign in several ways, but nothing has worked so far. How do I select the parent, child or sibling of $(this)? This would attach the behavior to any link element with the class of formToggle: $(a.formToggle).click(function (e){ // this = anchor tag that was just clicked $(this).prev().toggle(); }); -Dan
[jQuery] Re: Fall back to IFRAMEs with jQuery
Istvan: I know this is a question which is really old news, but we have a site where some of our users have centralized security settings, and their ActiveX has been switched off and of course they can not use IE7. they are proud IE6 users. I have had a look at plenty of old libraries that uses IFRAMEs I tried one of them but absolutelly does not work together with jQuery. does anyone know a way of doing this ? Any help is very welsome ! I assume you're referring to AJAX/XHR support. If so and Flash is a valid alternative, then check out: http://ajaxian.com/archives/flxhr-flash-based-xhr-from-flensed I've not used, but it's designed to be a drop-in replacement for the XHR that's supposed to be cross browser compliant. They also claim to have updated hooks to most libraries (including jQuery.) -Dan
[jQuery] Re: jQuery animate performance help...please!!!
Tom, i'm relatively new to jQuery and the world of javascript but since i've started using it it's opened up a huge amount of possibilities that i'm know everyone has encountered!! anyway, i was hoping that someone with a bit more experience and knowledge could help me out and possibly take a look at something and see why the performance of this particular animation is so badly affected, as it is the same function/animation that is used on other pages of the site and that works really smoothly. I am assuming there must be a conflict or heavy load somehwere causing the dramatic reduction in performance of the animation... the page that is affected is here: http://www.test- area.co.uk/sysco/v1.5/sysco.co.uk/library/photos/default.aspx and the page that it seems to work fine is here: http://www.test-area.co.uk/sysco/v1.5/sysco.co.uk/portfolio/default.aspx it is the animation of the right hand side pane (opened when you click the links) and the slide down that occurs once the page has been successfully requested via an ajax call. as i say i'm new and this is my first major project using the framework and no doubt i am not doing things the best way, but at the moment im just trying to learn as quick as i can!!! I didn't notice any speed difference between the 2 pages. The fx fluidity seemed the same to me. What I would recommend doing any time you're having a problem, is updating to the latest build of jQuery. I see you're running v1.2.3 and v1.2.6 is the latest release. Upgrading to v1.2.6 will also remove the need for the jquery.dimension.js plug-in, since all that functionality is now integrated into jQuery. A couple of other notes: 1) You're using a speed of 1000ms (1 second) for your fx. You might want to use a faster speed. If you have a lot of stuff happening in the background (like lots of setIntervals or functions that keep calling setTimeout) then that can affect the fluidity of animations. 2) Since the content panel is draggable, I'd make sure you're running the latest version of the UI plug-ins too. There's been lots of work on these plug-ins to fix various bugs and issues. -Dan
[jQuery] Re: Safari 2 Mac - loads of problems!
Safari 2 has some serious problems with it's Javascript interpreter. Any page that has a heavy amount of Javascript will fail. I know the jQuery team has to run the jQuery unit tests on Safari 2 in chunks, otherwise Safari 2 blows up. There's several posts about this in the archives. -Dan -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Jeffrey Kretz Sent: Thursday, July 10, 2008 2:39 PM To: jquery-en@googlegroups.com Subject: [jQuery] Re: Safari 2 Mac - loads of problems! Unfortunately, I too have had a number of problems related to Safari 2, in building a CMS system. I was able to get the public part of the site to work, but the CMS administration (HTML Editor, etc) had many many problems, despite everything working well in FF, Opera, IE6 and IE7. Eventually, my boss decided to not support Safari 2, and we've had to tell our clients on our CMS who use Safari to switch to Firefox or upgrade to Safari 3. JK -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of herrflick Sent: Thursday, July 10, 2008 10:51 AM To: jQuery (English) Subject: [jQuery] Safari 2 Mac - loads of problems! I've been working on a site that is really heavy with jquery stuff, but have found it almost impossible to get even pretty basic stuff working in safari 2 on a Mac. The development site is at: http://dev2.drfoster.co.uk/ the scripts I've written are at: http://dev2.drfoster.co.uk/script/hg-functions.js http://dev2.drfoster.co.uk/script/graph.js, and i'm using jquery v1.2.6. The graphs all the page functions work as intended in all the browsers I need (ie6 + win, firefox 2+, safari 3 mac, safari win etc), but in safari 2 Mac the browser originally just crashed. I added browser detection and created some basic alternative stuff, but as soon as I add more than a few functions, the site stops working. Has anyone had a similar issue with jquery, safari 2 (and perhaps google maps API?) Thanks for listening!
[jQuery] Re: Custom sort on table cell attribute value in tablesorter plugin rather than innerHTML value: help please!
I am using the tablesorter plugin, which I really like. However, in several of my table cells I have oddly formatted time values that look like the following: 1d 12h 34m 25s Which maps to: 1 day, 12 hours, 34 mins and 25 seconds I cannot change how these values are displayed - they have to be in that format. However, in my code I also create an attribute to the table cell called sorttable_customval in which I insert the raw number format as a float: td sorttable_customkey=dlt sorttable_customval=65.093 1m 5s/ td I have tried to write my own add-on to the tablesorter source code to get this attribute value in the confines of the tablesorter textExtraction method: Javascript at the top of my webpage with the table == (#monitor).tablesorter({ textExtraction: 'customattribute', debug: true, widgets:['zebra'] }) The modified part of tablesorter.js (rows 233 and 234) = 221 function getElementText(config,node) { 222 223 if(!node) return ; 224 225 var t = ; 226 227 if(config.textExtraction == simple) { 228 if(node.childNodes[0] node.childNodes[0].hasChildNodes()) { 229 t = node.childNodes[0].innerHTML; 230 } else { 231 t = node.innerHTML; 232 } 233 } else if(config.textExtraction == customattribute) { 234 t = $(node).attr('sorttable_customval'); 235 } else { 236 if(typeof(config.textExtraction) == function) { 237 t = config.textExtraction(node); 238 } else { 239 t = $(node).text(); 240 } 241 } 242 return t; 243 } I thought this would work, but I get the following error in Firebug: s is undefinedjquery.tablesorter.js (line 703) return $.trim(s.toLowerCase()); The problem with using the textExtraction (at least from my understanding) is that it works for all columns. So, I suspect the error is coming from the fact that the 'sorttable_customval' only existing on some columns and is returning undefined for the other columns (thus breaking $.trim().) You were close when you wrote a custom parser--which is the way I've solved this problem in the past. The problem is you used the is option instead of the function option. Try this: $.tablesorter.addParser({ id: 'dlt', is: function (s){ return false }, format: function(value, table, cell){ return cell.parentNode.getAttribute('sorttable_customval'); }, type: 'numeric' }); In the format option, the value is what's coming back from the textExtraction method. In this case, we want to ignore this value all together, and instead use the cell to extract the attribute. -Dan
[jQuery] Re: jScrollPanel not always initializing in Safari
$(document).ready() will not fire consistently in Safari (and I believe FF3) unless you load all the external CSS stylesheets before your JS scripts. Try moving all your link / and style / blocks above any script / tags and see if that doesn't resolve the issue. There's been talk about making it a requirement that in order for the jQuery $.ready event to work properly, you must load all external CSS first. -Dan -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Sam Sherlock Sent: Tuesday, July 08, 2008 1:41 PM To: jquery-en@googlegroups.com Subject: [jQuery] Re: jScrollPanel not always initializing in Safari i've had troubles too; I've tried $(window).ready and also tried calling it twice. with a bit of tweaking and tinkering I thought I found a solution - but then lost it 2008/7/8 hubbs [EMAIL PROTECTED]: I am using jScrollPanel, and I have noticed that it does not always get initialized when the page first loads in Safari. If I refresh the page, it correctly loads up jScrollPanel. Any ideas why this might be happening? http://www.puc.edu/ Thanks!
[jQuery] Re: $(something).text() doesn't preserve whitespace in IE
I'm having some issues when calling $(something).text() in IE 6/7. Basically I'm getting the calling text() on a pre element which is whitespace sensitive. In Firefox and Safari it works perfectly returning the text with whitespace intact. Is it possible to make it work in IE or shall I give up? Have you tried using html() instead? -Dan
[jQuery] Re: Strange jQuery cross-browser problem
Vladimir, We are developing a site at http://www.trashortreasure.com.au/ When you click on an icon on a Google map, the info window opens and when you click on read more it should open a thickbox. Problem is that some of our users report the feature not working in FF3. Then for some it doesn't work in IE6. For others it works. Most of them got it to work in IE7. That's a strange FF3 and IE6 consistency problem. I was wondering if you can you have a go with it and see if you can spot anything unusual? My guess is it's not a browser problem, but a JS problem. I just took a look at your tb_show() function and that thing is huge. You also have everything in a try/catch block with the catch just doing nothing--which is probably what's happening. You might want to add a statement to your catch block that sends the error to your server--that way you can view the exceptions being thrown. -Dan
[jQuery] Re: Best way to detect between jQuery triggered event and actual browser-based event...
Hmmm...that hasn't come up for me yet. Seems like the way you're doing it would be the way to go for now. Maybe in the next jQuery version they could add a key internalTrigger or something like that to the event object when the trigger method is run. Needing to determine the difference is a corner case, but it's an issue I've run into from time-to-time. For example, I've got a plug-in where I've got a click event set to toggle the current visibility of an element. However, if I call that event programmatically I always want to make sure that it shows the element (and doesn't toggle the state.) As I said, it's a corner case but one I've run into a few times in the past 6 months. -Dan
[jQuery] Re: Best way to detect between jQuery triggered event and actual browser-based event...
Needing to determine the difference is a corner case, but it's an issue I've run into from time-to-time. For example, I've got a plug-in where I've got a click event set to toggle the current visibility of an element. However, if I call that event programmatically I always want to make sure that it shows the element (and doesn't toggle the state.) As I said, it's a corner case but one I've run into a few times in the past 6 months. It looks like maybe this is a better method: function isJQueryEvent(e){ return !(($.browser.msie ? cancelBubble : bubbles) in e); } The ctrlKey is only available when a keyboard event occurs. I needed something that works for the click event too. There may be some issues with this, so it would be nice if a jQuery event object had: e.jquery = true. That would make my code fullproof. -Dan
[jQuery] Preventing form field caching on refresh...
Does anyone know a reliable way to prevent form field caching on a page reload? I want all form fields to return to their original state (aka defaultValue.) I'm developing a page and I really need the form to always return to it's original HTML state. The page isn't being cached, but FF is replacing the form fields with the changed values (which I don't want.) Any suggestions? Thanks, Dan
[jQuery] Re: How to center text (sweet mother of mary can it be this hard?)
ltg, I really did not want to post here and ask for help on centering text. But I have created the simplest possible JQuery sample page, used Firebug, and still can't figure it out. Can anyone say what it would take to center text on this page: http://dev.hdgreetings.com/test.htm You can do this purely in CSS: .redButton { background-color:#E5214B; color:white; font-family:arial; font-weight:bolder; font-size:16px; letter-spacing: 0.5pt; text-align:center; width:150px; height:50px; /* center text */ position: fixed !important; top: 50%; left: 50%; margin-top: -25px margin-left: -75px; } The idea is you're placing the div in the middle of the screen and then using negative margins so that the very middle of the div is now dead center. Without the negative margins, the top left of the div is in the middle of the screen. Also, I had to use the !important directive on the position, since the corner plug-in looks to be setting the position to relative. You could use either an absolute position or a fixed position. I used fixed in this example so that even if you scroll, the layer will stay dead center (which I thought is probably what you were going after. -Dan
[jQuery] Best way to detect between jQuery triggered event and actual browser-based event...
Just curious as to everyone's recommendations on detecting the difference between a jQuery created event object (i.e. $(#el).trigger(click)) and a real event object (i.e. create by the browser.) Right now I'm doing: if( !(ctrlKey in e) ) I believe the ctrlKey should be sent by every browser when the event action occurs via a user's action, but just wanted to know if there's a better way. It would be really nice if jQuery would pass a key that indicates whether an event object is generated by the browser or by jQuery. I've come across a few occasions were I needed to do different things based on how the event was being triggered. -Dan
[jQuery] Re: Google Analytics Tracking with JQuery
Gaudicia, I just started looking into JQuery and I have a few questions. Mostly about how to make tagging my links with google analytics tracking faster. I want to be able to track my outgoing links, which I've read is possible, but I really haven't see anything about tracking third party booking engines. So basically what I want is this. If I have links linking to my domain or an eCommerce or booking engine, I don't want those links to be tagged as outgoing. However, if the link is to a booking engine/eCommerce I want them to be tagged like this: a href= https://www.securecart.com/?store=parameters; onclick=pageTracker._link(this.href); return false;Purchase Now/a or like this a href=javascript:openWindow(pageTracker._getLinkerUrl('http:// bookingengine.com'))Booking Engine/a What you're looking to do is very easy: $(a).click(function (){ pageTracker._link(this.href); return false; }); a href=https://www.securecart.com/?store=parameters;Purchase Now/a Or if you only wanted to track specific links: $(a.track).click(function (){ pageTracker._link(this.href); return false; }); a href=https://www.securecart.com/?store=parameters; class=trackPurchase Now/a Also, I'm not sure how Google Analytics link tracking works, but just remember that if JS is disabled, no tracking will occur. -Dan
[jQuery] Re: Is it possible to fade images partially?
I'd like to know if it is possible to apply the fadeOut function to an element, but just partially, so that the element looks transparent (like a disabled button). I've been looking in the tutorials section of jQuery's official site and in Google, but I haven't found anything about it. Is it possible? if so, how? Thanks in advance. Use the fadeTo() method... -Dan
[jQuery] Re: New jQuery Plug-in: Multicolumn Dropdown
Tony, I was able to fix by own bug. I commented out like 899 ($self.blur();) and added a return true after line 901. That makes it so if you hit tab while at the end of the tree the tab will bubble up to the browser which will move focus to the next item. I tested in IE7 and FF4 and it works great. On line 150 I added tabindex=999 so that pressing tab would move from the dropdown to the next form field. Without the tabindex the next tab moved the selection to the dropdown arrow image, which isn't how a standard dropdown works. On an unrelated issue this plugin doesnt' work with jQuery.noConflict(). That probably doesn't matter for most people but I'm transitioning from prototype and need to use noConflict. I just replaced $. with jQuery and $( with jQuery( and it everything worked great. I just pushed out a new build that should resolve all the issue you were having. My fixes were a bit different, but they should do exactly what you're wanting (for example, I'm using tabindex=-1 which should prevent the dropdown anchor from being in the tab order altogether.) v1.2 (2008-06-26) * Added focus() method * Fixed autocomplete list from showing dropdown when go back levels in FF3 * Fixed autocomplete list corruption in when go back levels after using mouse * Added tabindex=-1 to the dropdown arrow (so it shouldn't recieve focus on tabbing) * Fixed tabbing behavior so hitting [TAB] should go to the next element in the tabindex * Autocomplete no longer shows (by default) if the input is empty and recieves focus (use the setting.showACOnEmptyFocus to control this behavior) * Added setting.showACOnEmptyFocus (used for controlling whether the autocomplete list shows on focus if list is empty; default = false) * Fixed noConflict() bug (where $ wasn't being properly scoped) http://www.givainc.com/labs/mcdropdown_jquery_plugin.htm -Dan
[jQuery] Re: [autocomplete] combobox behaviour (and SELECT/OPTION accesibility)
Enrique, thank you, I'll test that and check speed for local 6.000 options (our customers/vendors)... Replacing 6,000 items is going to be slow. Quite frankly, that's a job for AJAX. A select element w/6,000 items not only is a lot of content to push to the client, it's a usability nightmare. That's really a perfect candidate for AJAX. If you really require unobtrusive JS, from a UI standpoint I think you'd be better breaking that list down for the user (either by splitting things up alphabetically or by categories.) You can then always replace that with the autocomplete box if JS is enabled. -Dan
[jQuery] Re: New jQuery Plug-in: Multicolumn Dropdown
Josh, Very nice! One small issue...if I click in the main part of the dropdown, rather than on the down arrow, I can't select any options with the mouse. This is a little different than a native select control, where you can click anywhere on it. I updated the code over the weekend. You should now be able to use the mouse to select options in the autocomplete option. -Dan
[jQuery] Re: New jQuery Plug-in: Multicolumn Dropdown
Stan, Key navigation doesn't work at all - I'm not able to key down or anything. I wonder if the hotkeys plugin for jQuery might be helpful in this front since it normalizes key entry behavior? Just a thought. Thanks again for the stellar plugin. Keyboard support should now be working correctly in Safari. -Dan
[jQuery] Re: tablesorter: Glue two rows together
Michael, Here's an example:http://www.pengoworks.com/workshop/jquery/tablesorter/tablesorter.h tm Wow, looks great, thanks! I didn't have time to look over the code yet, so one one question: When I expand the second row and make a resort, the second row is hidden again. Is it possible to let the second row stay visible? The rows should stay expanded. They do for me in every browser I've tested. Try expanding the first row and then clicking the Date column twice. The Bike World should stay expanded. -Dan
[jQuery] Re: New jQuery Plug-in: Multicolumn Dropdown
Adam, Great plugin, Dan. Quick bug report: if I go down three levels (by using the first option) and the mouse off of the third out to the left, the 3rd level stays while I attempt to navigate to another option. I'm in FF3 on a Mac. This behavior should be fixed now. -Dan
[jQuery] Re: New jQuery Plug-in: Multicolumn Dropdown
Isaak, I've just tested the plugin demo available at: http://www.givainc.com/labs/mcdropdown_jquery_plugin.htm in Opera 9.27 and 9.5 and it's completely compatible, which is great news! I can also confirm the following bug in Firefox 3 on Windows: I just fixed the code to fix the mouse behavior, so it should be working as expected now. -Dan
[jQuery] Re: New jQuery Plug-in: Multicolumn Dropdown
Graeme, This plugin looks really cool! I found a small issue: If you load the page for the first time (in ff3) and just click on the blank area in the dropdown (instead of the down arrow) there is no animation when it expands down and the hierarchy arrows don't work when you use the mouse. If you then click the down arrow and go down a level or two in the hierarchy and don't select something and go back to clicking on the blank area of the dropdown, the formatting gets messed up (large vertical spacing of the Entertainment entry in the demo). 1) If you click inside the text box, you go into keyboard entry mode--so you're actually seeing the autocomplete box, not the dropdown menu. You can change the styles in the CSS to make this look however you want (so that you can make it look visual different.) Currently, when you're in keyboard entry mode you can not use the mouse to select entries. You can disable keyboard support by using a div/ element instead of an input/ element and then clicking inside would always cause the same menu as dropdown arrow. 2) The second issue (with the large vertical spacing) seems to be related to the Chili plug-in (which is used for syntax highlighting.) The problem seems to be random and only occurs when Firebug reports Chili errors (at least that's the only time I've seen the behavior.) I've never seen the behavior on a page that doesn't have the Chili plug-in. -Dan
[jQuery] Re: New jQuery Plug-in: Multicolumn Dropdown
Stan, Very nice plugin! I second Jorn's thought on the usage of both modes. I found myself slightly confused at first when I went into keyboard mode and couldn't click on anything. Seems to be an issue too when you click on the arrow, the menu is expanded and then you proceed to click on the white area that would normally trigger the keyboard mode. I know Safari wasn't in your list of supported browsers, but I did notice that the keyboard mode didn't seem to work correctly in Safari 3.1 on OS X. Safari has a fairly decent user base, especially amongst the jQuery crowd and I could see this as advantageous to you to get the plugin more circulated. All in all, excellent plugin - I will likely use it on a project of my own. What about the keyboard functionality isn't working? Is it not working at all, or just not working correctly? Unfortunately capturing keyboard entry is really a PITA. It varies drastically from browser-to-browser even on the same OS. It certainly does not surprise me it's not working correctly on Mac Safari. Obviously, if you find a fix, please let me know. -Dan
[jQuery] Re: tablesorter: Glue two rows together
Michael, is it possible to glue two table rows together, so that when the first row is sorted, the second row always comes next? Awhile back, I modded the tablesorter plug-in to do just that: http://blog.pengoworks.com/index.cfm/2008/3/28/Finished-jQuery-Tablesorter-m od-for-Collapsible-Table-Rows My code *has* been merged into the tablesorter code (in the SVN,) but the updated version has still not been officially released. With my mod you can add the CSS class of expand-child to each paired tr/ element in order to group the tr/ tags together. You can change the CSS class with the cssChildRow option. You can actually have multiple rows grouped together. Basically what happens is every consecutive tr/ tag with the expand-child class is going to be grouped with the last tr/ tag without the css class. Here's an example: http://www.pengoworks.com/workshop/jquery/tablesorter/tablesorter.htm -Dan
[jQuery] New jQuery Plug-in: Multicolumn Dropdown
Awhile back I blogged about a plug-in that my company was planning on releasing called mcDropdown (multicolumn dropdown.) Well, the plug-in was officially released today: http://www.givainc.com/labs/mcdropdown_jquery_plugin.htm If you like the plug-in, feel free to digg it: http://digg.com/programming/Multicolumn_Dropdown_jQuery_Plug_in You can jump directly to the example here: http://www.givainc.com/labs/mcdropdown_jquery_plugin.htm#example In a nutshell, this plug-in creates a tree-like form control. We need a UI control that would allow users to select an option from a large tree of data and this was the end result. I think the overall effect is pretty impressive and I've never seen a UI control like it (especially considering it supports keyboard entry.) -Dan
[jQuery] Re: New jQuery Plug-in: Multicolumn Dropdown
Thanks! I think it's a pretty unique approach and haven't really seen anything like it. We use this control for some really large hierarchical trees of data and it works very well. Generally the tree depth only goes 3 or 4 levels deep, but many of the branches have over 20 items. The multicolumn approach keeps the items in a compact space in the viewport and the keyboard entry allows for quick keyboard selection. -Dan -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Rey Bango Sent: Wednesday, June 18, 2008 12:01 PM To: jquery-en@googlegroups.com Subject: [jQuery] Re: New jQuery Plug-in: Multicolumn Dropdown This plugin is HOT Dan. Rey Dan G. Switzer, II wrote: Awhile back I blogged about a plug-in that my company was planning on releasing called mcDropdown (multicolumn dropdown.) Well, the plug-in was officially released today: http://www.givainc.com/labs/mcdropdown_jquery_plugin.htm If you like the plug-in, feel free to digg it: http://digg.com/programming/Multicolumn_Dropdown_jQuery_Plug_in You can jump directly to the example here: http://www.givainc.com/labs/mcdropdown_jquery_plugin.htm#example In a nutshell, this plug-in creates a tree-like form control. We need a UI control that would allow users to select an option from a large tree of data and this was the end result. I think the overall effect is pretty impressive and I've never seen a UI control like it (especially considering it supports keyboard entry.) -Dan
[jQuery] Re: New jQuery Plug-in: Multicolumn Dropdown
On Jun 18, 8:31 pm, Dan G. Switzer, II [EMAIL PROTECTED] wrote: Awhile back I blogged about a plug-in that my company was planning on releasing called mcDropdown (multicolumn dropdown.) Well, the plug-in was officially released today:http://www.givainc.com/labs/mcdropdown_jquery_plugin.htm snip Just a thought.. wouldn't be better it's done as a replacement over the optgroup--so that accessibility is maintained? No, because the option/ tag does not allow deep nesting (which was a requirement for us.) -Dan
[jQuery] Re: New jQuery Plug-in: Multicolumn Dropdown
It's been tested pretty extensively in Firefox 2 3 and IE 6 7 (because these are the only browsers used by our userbase.) -Dan _ From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Isaak Malik Sent: Wednesday, June 18, 2008 11:46 AM To: jquery-en@googlegroups.com Subject: [jQuery] Re: New jQuery Plug-in: Multicolumn Dropdown This plugin looks very interesting, how is the browser support? On Wed, Jun 18, 2008 at 5:31 PM, Dan G. Switzer, II [EMAIL PROTECTED] wrote: Awhile back I blogged about a plug-in that my company was planning on releasing called mcDropdown (multicolumn dropdown.) Well, the plug-in was officially released today: http://www.givainc.com/labs/mcdropdown_jquery_plugin.htm If you like the plug-in, feel free to digg it: http://digg.com/programming/Multicolumn_Dropdown_jQuery_Plug_in You can jump directly to the example here: http://www.givainc.com/labs/mcdropdown_jquery_plugin.htm#example In a nutshell, this plug-in creates a tree-like form control. We need a UI control that would allow users to select an option from a large tree of data and this was the end result. I think the overall effect is pretty impressive and I've never seen a UI control like it (especially considering it supports keyboard entry.) -Dan -- Isaak Malik Web Developer
[jQuery] Re: hover flickering, snow storm pixels on JPGs (beginner problem)
Since the problem is w/absolute black being interpreted as transparent, what happens if you put a black background behind the images? -Dan -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Andy Matthews Sent: Tuesday, June 17, 2008 5:16 PM To: jquery-en@googlegroups.com Subject: [jQuery] Re: hover flickering, snow storm pixels on JPGs (beginner problem) Ack...both you and I can confirm that it's still a bug in IE7 as well. -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of tlob Sent: Tuesday, June 17, 2008 3:53 PM To: jQuery (English) Subject: [jQuery] Re: hover flickering, snow storm pixels on JPGs (beginner problem) I just found out this one: http://www.alexjudd.com/?p=5 THANK YOU MICROSOFT argh On Jun 17, 10:48 pm, Andy Matthews [EMAIL PROTECTED] wrote: Ooops... I spoke too soon. When I click on an image from the list above, THEN I get the white dots. Interesting that each image's dots are always in the same place. For example, in gallery 1, if I click on the black/white image of the man, then click back to the first image, the dots I see are in the same exact location as the dots in your screenshot. I'm betting that this has something to do with your use of your no shoplifting image:http://siggibucher.com/img/siggibucher.com_NO-SHOPLIFTING.gif Try removing that from use and see if it continues to exhibit this behavior. andy -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of tlob Sent: Tuesday, June 17, 2008 3:39 PM To: jQuery (English) Subject: [jQuery] Re: hover flickering, snow storm pixels on JPGs (beginner problem) http://vum.ch/thomas/ie7siggi.jpg On Jun 17, 10:31 pm, Andy Matthews [EMAIL PROTECTED] wrote: I'm looking at it in IE7 and I'm not seeing any of these white pixels you're mentioning. Can you confirm the version of IE you're using? -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of tlob Sent: Tuesday, June 17, 2008 3:21 PM To: jQuery (English) Subject: [jQuery] hover flickering, snow storm pixels on JPGs (beginner problem) Hello I try to implement the cycle Plugin. Pretty successful so far. Two things are strange: -The hover function over the main Image, behaves strangely in IE. It's more flickering than hovering. -And some of the Images have strange white pixels on it. Also only in IE. Take a look:http://siggibucher.com/index2.php Can you help me out here? Thanx Tom
[jQuery] Re: easy way to get all input value
Jack, I asked this via another thread, but no reply yet... so tossing it in here, too. Do you know if *any* selector can be used with .formHash() or just an id for a form? IE, if I have a few divs inside a form can I use a div id to just get the formHash for form fields inside that div? If your selector returns multiple form elements, then it will process them. You can't feed it the div directly, but you can do any of the following: div form, #someElement form, form.someClass, .someClass, form, etc, etc. Whatever jQuery object is passed to the hashForm() method is then filtered for just form elements. So even if .someClass was assigned to various elements, it uses the filter() method to limit the collection to just form elements. -Dan
[jQuery] Re: Best practice to get form field values
Martin, Check out the Field plug-in: http://jquery.com/plugins/project/field This provides the type of functionality you're looking for (of providing form values back for any type of field.) -Dan -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of mar10 Sent: Thursday, June 12, 2008 3:17 AM To: jQuery (English) Subject: [jQuery] Best practice to get form field values Hi, what would you consider the 'best practice' to access form input values? Having an input field input value=New topic class=inputEdit name=title type=text I could use $('[EMAIL PROTECTED]').val() or $('[EMAIL PROTECTED]title]').val() or $('[name=title]').val() or $('[name=title]').val() ( I also once observed, that the right side of the '=' was evaluated, so it was possible to write var x = 'title'; $('[name=x]') but i could not reproduce it today, so maybe I'm wrong. ) Of course assigning an additional id input value=New topic class=inputEdit name=title type=text id=title would allow for $('#title') but that appears to be somewhat redundant to me. In short I am looking for the most simple built-in syntax to access form values, like prototype's $F(). This means that querying option lists should return a list of selected values (or texts), and text areas should work also. Thanks Martin
[jQuery] Re: easy way to get all input value
Jack, The Field plug-in has a formHash() method which does exactly that: http://jquery.com/plugins/project/field You can see an example here: http://www.pengoworks.com/workshop/jquery/field/field.plugin.htm If you are using Firebug, you can see the dump of the form in your console when you click the $('#frmTest').formHash() button. -Dan -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of jack Sent: Thursday, June 12, 2008 9:52 PM To: jQuery (English) Subject: [jQuery] easy way to get all input value Hi, all Is there an easy way to get all the input values on a form into an object? Thank you very much! Jack
[jQuery] Re: [ANNOUNCE] Toaster plugin
I just updated the demo, I added a stack option I had some problem calculating the spacing dynamically so I had to add a spacing option too.. There is some behavior that I don't like much, try the following: Open 3 sticky toasters, then close the first one and open a new one.. Not sure how I will fix this yet.. http://www.haineault.com/media/examples/jquery-ui-toaster/demo/ You could simplify this code a ton by putting everything inside one outer container. The outer container is what you position to top-left, top-right, bottom-left, bottom-right, etc. You then just either append (top) or prepend (bottom) the toaster notification to the container element. The cool thing about this, is it will handle all the positioning automatically. As one toaster element hides everything should shift appropriately. Also, you don't have to worry about calculating where to place each individual notification. -Dan
[jQuery] Re: [ANNOUNCE] Toaster plugin
One suggestion, multiple messages should really stack on top of each other. Right now, if you open up multiple requests they go over top of each other. They should stack on top and then slide down when each message closes. -Dan -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Andy Matthews Sent: Monday, June 09, 2008 9:18 AM To: jquery-en@googlegroups.com Subject: [jQuery] Re: [ANNOUNCE] Toaster plugin By the way... This plugin is REALLY nice when it works. Very well done. Now if you can just make sure it works in IE7, I might put this into production. -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of h3 Sent: Sunday, June 08, 2008 10:31 PM To: jQuery (English) Subject: [jQuery] [ANNOUNCE] Toaster plugin I've just released a toaster plugin Project page: http://code.google.com/p/jquery-ui-toaster/ It's inspired by Miksago's experimental toaster plugin that was no longer maintained: http://code.google.com/p/jquery- ui/source/browse/branches/experimental/ui.to aster.js Note: It's beta release and it have been tested only on Firefox and Konqueror yet, so it's most likely broken under IE and probably work fine under Safari. Feedbacks and comments are more than welcome !
[jQuery] Re: Display loading image while alternate image loads.
Andy, You can use the onerror event of an image to determine if an image loaded or not. Also, you could load the image using JS's Image object-that way you could display a loading image. Here's some example code: http://www.rgagnon.com/jsdetails/js-0083.html -Dan _ From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Andy Matthews Sent: Tuesday, May 27, 2008 4:50 PM To: [jQuery] Subject: [jQuery] Display loading image while alternate image loads. I have a default image loaded into an img tag with an id of specialImage. I also have a select box which displays a list of vehicles. The value of each option is a filename (75682.jpg, 75123.jpg, etc.). When the user selects a vehicle, I want to change the src of the img tag but I'm running into a few issues that I'm not sure how to get around. 1) Because I'm not using an AJAX call, I don't know if the file actually exists on the server. A few images are then showing as broken which is a big no no. 2) The images being loaded in aren't huge, but they might be 40k or so. Because I'm simply changing the src, I can't display a loading image while the requested image is loading. Are there ways around this? I'm thinking I could do an AJAX call to get the response headers for the file. When I trigger the AJAX call, I'd display the loading image. Then, if the response comes back 200, then I can display the actual file, if not, I can display a no image available image. Any thoughts on this method? Is there a better way to do this? Andy Matthews Senior ColdFusion Developer Office: 615.627.9747 Fax: 615.467.6249 www.dealerskins.com http://www.dealerskins.com/ Total customer satisfaction is my number 1 priority! If you are not completely satisfied with the service I have provided, please let me know right away so I can correct the problem, or notify my manager Aaron West at [EMAIL PROTECTED] image001.jpg
[jQuery] Re: Tablesorter - Disabled Header Options with Pager
In most cases, you never want to call the same plug-in twice on a set of jQuery objects that initialize a behavior on the page (you called tablesorter() twice in your incorrect example.) This is because in most cases you're applying the behavior twice and may end up with really bizarre results. -Dan -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of shoo Sent: Tuesday, May 20, 2008 9:22 AM To: jQuery (English) Subject: [jQuery] Tablesorter - Disabled Header Options with Pager This week I've been working on implementing Tablesorter. It's a great Jquery table sorting utility, but I spent quite a bit of time trying to figure out why I could only sort columns in descending order while using the pager plugin when I set the header option to disable some columns. I didn't see anything on here about it so, I thought I would post my fix / solution. Below, the incorrect way to do it. $(document).ready(function() { $(#SearchResultsTable).tablesorter({ // pass the headers argument and assing a object headers: { 0: { // disable it by setting the property sorter to false sorter: false }, 4: { // disable it by setting the property sorter to false sorter: false } } }) .tablesorter({widthFixed: true, widgets: ['zebra']}) .tablesorterPager({ container: $(#ctl00_MainContent_pager), positionFixed: false }); ; }); From what I've discovered, you really need to pass all the parameters in one pass like below: $(document).ready(function() { $(#SearchResultsTable) .tablesorter({ headers: {0: {sorter: false},6: {sorter: false}}, widgets: ['zebra'] }) .tablesorterPager({ container: $(#ctl00_MainContent_pager), positionFixed: false }); }); Above, I am calling table sorter to disable columns 0 and 6, use the zebra widget, then call the tablesorter Pager plugin.
[jQuery] Re: Filtering charachter input with jquery/javascript
Giovanni, You need to use the keypress event if you truly want to know which character was pressed. However, IE6 doesn't register the keypress event for certain non-printable characters (like the backspace, the arrow keys, etc.) So, for IE6 you need to capture those characters either on keydown (which I prefer) or keyup and then call your event handler function (onlyNumbers) for when those keys are pressed. -Dan -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Giovanni Battista Lenoci Sent: Thursday, May 15, 2008 10:34 AM To: jQuery (English) Subject: [jQuery] Filtering charachter input with jquery/javascript Hi, I'm having a problem filtering keyboard input in a text field. Here is the page with the test: http://lab.gianiaz.com/jquery/filter_input/ I use this function to catch the key pressed by the user: function onlyNumbers(e) { key = e.keyCode; if(debug) log(onlyNumbers\nkey_code:+key); if ((key==null) || (key==0) || (key==8) || (key==9) || (key==13) || (key==27) ) return true; keychar = String.fromCharCode(key); if(debug) log(keychar:+keychar); // numbers if(((0123456789.,).indexOf(keychar) -1)) { if(debug) log('OK'); return true; } if(debug) log('KO'); return false; } But If I press a number it works, when I press the dot or the comma key I receive this: onlyNumbers key_code:190 keychar:¾ KO onlyNumbers key_code:188 keychar:¼ KO Can you help me understand why it doensn't works? Bye
[jQuery] Re: Java applet doesn't load when markup loaded via jquery
I've had a ton of problems using Applets on a page with jQuery in FF2 because FF does not like jQuery accessing the expando elements when the window.onunload event runs. I've had to revert to using an iframe to load my applets in, so that it can be embedded in a page without jQuery. Perhaps you can do the same thing in your tab. Just load the applet in a iframe that only displays the applet. -Dan -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of .M. Sent: Sunday, May 11, 2008 1:09 AM To: jQuery (English) Subject: [jQuery] Re: Java applet doesn't load when markup loaded via jquery Follow up - I can get my applet loaded and running in a jquery tab (issue above was applet-specific) but this leads to another question - Is there a way ui.tabs could work that allowed an applet to stay loaded? I've been reading up on this and it appears there is a workaround for hiding and revealing DIVs without unloading an applet but jquery.ui.tabs doesn't do this. Any thoughts? On May 10, 6:49 pm, .M. [EMAIL PROTECTED] wrote: Hi Anyone got suggestions for this? I'm trying to integrate this SFTPapplet(http://www.jscape.com/ sftpapplet/) into my site. My standalone page with the object/embed code loads fine but if I try to load this dynamically into the page theappletdoesn't load. I have the following function linked to the onclick method of a ui.tab so that when you click on the tab theappletcode is loaded into page. Markup loads fine butappletdoesn't start. function loadFTP() { $(#fragment-3).load(/sftpapplet); } Best .M.
[jQuery] Preventing text field focus() when user tabs to field...
I'm working on an input field where I need to disable the browser from automatically doing this.select() on an input text field. In a nutshell, I've got an input box I basically am treating like a masked input. The reason is I'm manually pre-selecting a text range. If I invoke my function to pre-select the correct text asynchronously (via setTimeout) it works correctly, but you get a very brief flash as the browser natively does a select() on the text already in the input field. I've tried using both e.preventDefault() and e.stopPropagation(), but neither stopped the behavior in FF. Returning false doesn't prevent the behavior either. Here's basically what the code looks like: $(input#myField).bind(focus, function (){ setTimeout(function (){ // preselect just the first 2 chars setSelection(this, 0, 2); }, 0); }); // set the text selected in a text field function setSelection(field, start, end) { if( field.createTextRange ){ var selRange = field.createTextRange(); selRange.collapse(true); selRange.moveStart(character, start); selRange.moveEnd(character, end); selRange.select(); } else if( field.setSelectionRange ){ field.setSelectionRange(start, end); } else { if( field.selectionStart ){ field.selectionStart = start; field.selectionEnd = end; } } field.focus(); }; Does anyone know of a trick to completely prevent FF from trying to select all the text in a field automatically? -Dan
[jQuery] Re: autocomplete onSelectItem
It's onItemSelect, not onSelectItem (the docs are wrong.) -Dan -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of michelem Sent: Friday, May 09, 2008 12:11 PM To: jQuery (English) Subject: [jQuery] autocomplete onSelectItem Hi, I'm trying the autocomplete plugin from: http://www.pengoworks.com/workshop/jquery/autocomplete.htm I have a problem with the onSelectItem option that I suppose it will be triggered when I select a value, right? So i would like to do something when the value is selected, but It doesn't work with my code: script type='text/javascript' jQuery(document).ready(function($){ $(#searchbox).autocomplete(db.php, { minChars:2, maxItemsToShow:25, cacheLength:10, onSelectItem:function(){ alert('Hello'); }, autoFill:true }); }); /script input type=text name=myinput id=searchbox class=ac_input Everything works fine but the onSelectItem option seems to do nothing, any ideas? thank you very much Michele
[jQuery] Re: Preventing text field focus() when user tabs to field...
Karl, I don't know off-hand, but the first place I'd look would be Josh Bush's Masked Input plugin. He has done a ton of work to make it an excellent plugin, so I'm guessing you could get some ideas by looking at his code: http://digitalbush.com/projects/masked-input-plugin Hope that helps. I looked there after I made my post and he's also using setTimeout to do it asynchronously--so there may not be a cross browser way to actually stop the default behavior (there might be, but Josh didn't have a solution either.) -Dan
[jQuery] Re: Expression/Selector question...
Karl, Yeah, it's also strange that while this doesn't work: $(body ul li).filter($li[0]); this does: $(body ul li).not($li[0]); I'm a little lost by your parents example, though. Not sure exactly what you're trying to get (esp. since you don't show where you've declared $el and $parent. Let's say you have: ul li id=1 Parent 1 ul li id=2 Child 1 /li /ul /li /ul What I want to do is see if Child 1 has Parent 1 somewhere in it's parent path. I don't really care if Child 1 would be a child of a child of a child, just that at some point Parent 1 was actually in the parent path. So, I would expect to be able to do: var $p = $(#1); $(#2).parents($p); Well this does work: $(#2).parents(#1); It doesn't work for me, since the actually expression I need to check against a jQuery object that can't be reliable queried through a pure CSS-style selector. couldn't you do something like $el.parent() ? or $el.parent('.someclass') ? or $el.parents('.someclass:first') ? (just using class in the parents filter because not sure what you're after). As I stated, using a CSS expression doesn't work for me because I'm actually checking to see if another jQuery object is somewhere in the parent's tree. -Dan
[jQuery] Re: Expression/Selector question...
Just wonder if there were any comments to this? On May 5, 4:24 pm, Dan G. Switzer, II [EMAIL PROTECTED] wrote: One thing that I've noticed is that the expr attribute is pretty inconsistent across methods (such as filter, find, parents, parent, etc.) The documentation is very vague about what an expression is, other than it just being a selector. However I would assume a valid expression for one element would be valid for all elements, but I've noticed that an HTML element is only a valid expression in the find() method. For example: $li = $(li); // returns the first matches for $li $(body ul li).find($li[0]); // this actually errors with a t.substring is not a function error $(body ul li).filter($li[0]); // I would expect this to only return the element which is the first $li, // but instead it ignores the expression altogether and returns all parents $(li[rel=45]).parents($li[0]); Shouldn't expressions work the same across all methods? Right now I'm having to use this to find only the explicit parent: $el.parents().filter(function (){ return this === $parent[0]; }); However, if parents() worked like find() I would be able to do: $el.parents($parent[0]); (Before you say Why not just use $parent?, it's because I'm checking to see if an element is a child of a specific element.) -Dan
[jQuery] Re: use jQuery selector on IE5.5
Angus, I just know that in jQuery + IE5.5 most selectors return empty array. After digging into source code I found that it will try to get the nodeName and nodeType of document (nodeType=9) which IE 5.5's document element doesn't have these two attributes. As a quick fix I add the following lines at the beginning of my HTML: if (document) { if (!document.nodeType) document.nodeType = 9; if (!document.nodeName) document.nodeName = '#document'; } and all of my selector works. Of course there should be other cases failed in IE 5.5 but at least simple selectors will work Hope this help Just so you know IE 5.5 is not supported by jQuery. So while this fix may work for what you needed it for, it's likely that you'll run into other problems with various jQuery code or plug-ins. -Dan
[jQuery] Expression/Selector question...
One thing that I've noticed is that the expr attribute is pretty inconsistent across methods (such as filter, find, parents, parent, etc.) The documentation is very vague about what an expression is, other than it just being a selector. However I would assume a valid expression for one element would be valid for all elements, but I've noticed that an HTML element is only a valid expression in the find() method. For example: $li = $(li); // returns the first matches for $li $(body ul li).find($li[0]); // this actually errors with a t.substring is not a function error $(body ul li).filter($li[0]); // I would expect this to only return the element which is the first $li, // but instead it ignores the expression altogether and returns all parents $(li[rel=45]).parents($li[0]); Shouldn't expressions work the same across all methods? Right now I'm having to use this to find only the explicit parent: $el.parents().filter(function (){ return this === $parent[0]; }); However, if parents() worked like find() I would be able to do: $el.parents($parent[0]); (Before you say Why not just use $parent?, it's because I'm checking to see if an element is a child of a specific element.) -Dan
[jQuery] Re: jcarousel in ie 5.5
Ray, Anybody knows how to make work jcarousel in ie 5.5?. Now i see a white space in the place of the jcarousel. Perfect in ie6, ie7 and Firefox. Thanks! jQuery only officially supports IE6 and above, so if you really need to support a browser that old you're probably going to have problems with any of the modern JS libraries (since they all pretty much required IE6+.) -Dan
[jQuery] Re: How to access TableSorter configuration properties
Carl, I'm using the TableSorter plugin on a table that will have new rows appended to it by AJAX calls. I want to resort the table using the current sort settings after new rows are added. I am using the TableSorter .trigger(update) and .trigger(sorton, [sorting]) methods to resort the table. I need to access the tablesorter config object to extract the SortList. How can I do this? A couple of weeks ago I created a mod of the TableSorter code: http://blog.pengoworks.com/index.cfm/2008/3/28/Finished-jQuery-Tablesorter-m od-for-Collapsible-Table-Rows My mod using the jQuery .data() method to set the config options for the current table, so you should be able to do: var config = $.data(tableElement, tablesorter); To get the config options. While this is a mod, Christian has said my changes will be implemented in the next release of the tablesorter code (although I can't say whether or not he'll revise how I implemented things.) -Dan
[jQuery] Re: SOT: Using iframe to load in a Flash movie with dynamic height
Andy, I've been dealing with this irritating issue on and off now for about a month. I'm finally going to ask for help. I have a page here: http://lexusofdanversma.redlinecontent.com/Pages/Page.cfm?pageID=118873 It contains a Flash movie whose height is set dynamically based on it's content. The Flash movie might be 250px tall, or it might be 700px tall depending on what it's currently displaying. This page works perfectly. However the client has another site on which they have an iframe which loads in the above page. On THAT page, the content of the Flash movie is getting cut off for some reason. You can see my quick example here: http://www.commadelimited.com/uploads/iframe.html Notice that when the Flash movie first loads, the bottom inch or so is getting cut off. Does anyone have any idea why this is happening, or how I might go about fixing it? Thanks in advance for any help you can provide. This is where Firebug comes in handy--as it lets you easily find padding/margin problems. It's padding and margins on your body, td and form tags that are probably the root cause. If you remove the padding/margin on those tags it basically fixes the problem. -Dan
[jQuery] Re: SOT: Using iframe to load in a Flash movie with dynamic height
Andy, So your'e saying that even though the page works fine when not loaded into an iframe, it's still a padding issue? That sounds odd to me. I'll check it though...that'd be a great thing to have fixed. You may have a different style sheet being loaded. Also, if you're opening the IFRAME up to the exact dimensions you're expecting, but haven't accounted for the padding and margins, then the height won't match up.
[jQuery] Re: clone() not maintaining checked state of cloned checkbox inputs
Jim, I'm using the following code to get all selected checkboxes from my html page and copy them into the form I'm about to submit: $ ([EMAIL PROTECTED]'BatchItem']:checked).clone().appendTo(#checkboxContainer) ; I'm pretty certain that with previous versions of jquery (specifically 1.2.1), this was working for me, but since I've upgraded to 1.2.3, the cloned checkboxes are no longer checked when the form is submitted. I've had to add additional code to specifically re-check them after the cloning. Has anyone noticed similar behavior? It seems to me that the checked state should be maintained during cloning. I've seen this behavior in IE 6 7. The fix I used was (for IE) to copy over the HTML: http://blog.pengoworks.com/index.cfm/2007/7/16/IE6--IE7-quirks-with-cloneNod e-and-form-elements You'd probably want to use outerHTML in your instance, but I believe that will fix the problem. I think the jQuery team has gone back and forth on whether or not jQuery should resolve this problem in the clone() method. I know there are several little quirks with the clone() method right now--and this is one of them. -Dan
[jQuery] Re: Two column menu using jdMenu?
Jason, I'm using jdMenu for a new project and came across a problem. Some of my menus are so long that they run off the page. Is there any way of making the menu spill over into a second column. If that can't be done, can it cut off and allow people to scroll through the listings? How should I handle extra long menus? I've been working on plug-in that addresses this exact issue. It's not ready to be released yet, but I just threw together a quick preview: http://blog.pengoworks.com/index.cfm/2008/4/3/Preview-jQuery-Multicolumn-Dro pdown-Plugin This might give you an idea of how you want to handle it. -Dan
[jQuery] Re: JQuery TableSorter pager Plugin problem
Paul, I've recently installed the TableSorter widget for jquery. It all worked fine, so I tried to go one step further, by installing the pager plugin for TableSorter. The problem I have is that the div called 'pager' appears on top of my table (at the bottom), instead of under the table, where I would like it to be. If I then select '20' (for 20 results per page) the div is placed where it should be (under the table). Then I select '10' (to go back to 10 results per page) and everything is displayed fine and correct. Any help? Try setting the positionFixed to false. -Dan
[jQuery] Re: Brain fade...how do you destroy a div?
Sounds like an odd way to do it, just do $('#div').remove(); works with any DOM selection and it's chainable $('span').fadeOut().remove(); You'd really need to do: $('span').fadeOut(function (){ $(this).remove() }); To make sure you don't remove the element until after the animation has finished. -Dan
[jQuery] Best method for detecting the depth of childed ordered list...
I'm trying to get the depth of an ordered list. I need to know what the deepest branch of the list is. My data looks like: ul li Item 1 ul li Item 1.a /li li Item 1.b /li /ul /li li Item 2 /li li Item 3 ul li Item 3.a ul liItem 3.a.i/li liItem 3.a.ii/li liItem 3.a.iii/li /li li Item 3.b /li /ul /li li Item 4 /li /ul I need to know that the deepest branch is 3 nodes deep (i.e. Item 3.a.i). I can get this using recursion or loop through all the ul nodes, but I'm wondering if I'm missing an obviously selector that will get me the same information. -Dan