[jQuery] Delaying Click Event
I've been searching high and low on Google over the last hour looking for this, but can't seem to find anything. Maybe I'm using the wrong search terms, but I'd think what I'm trying to accomplish is something that's been done before. What I'm looking to do is delay the action of a click for a set period of time. I have a list of links for download zip archives and when you click on one of those links, I use the BlockUI plugin to show an overlay with a message that tells the user their download will start momentarily. The reason this is done is so that I can fire off an AJAX event that inserts a record into a database for download tracking. Ideally what I'd like to do is fire the AJAX event (which should only take about .2 seconds to run) and then wait for 2 or 3 seconds before unblocking the UI and *then* letting the default action of the click (offering up the zip archive) fire. Any ideas how I might accomplish something like this?
[jQuery] Re: Delaying Click Event
That worked like a charm! I didn't realize I could pass an anonymous
function to setTimeout like that. Thanks for the quick reply!
David
On Jan 4, 10:01 am, Michel Belleville
wrote:
> The simplest way to do this is to use the setTimeout method (straight JS)
> and give it an anonymous function as callback to trigger after given period.
>
> Something like this should do the trick :
>
> $('a.delayed').click(function() { // assuming these links all share the
> "delayed" class
> var clicked = $(this); // when setTimeout calls your anonymous function,
> "this" will point to something else entirely
>
> setTimeout(function () {
> window.location.href = clicked.attr('href'); // assuming you want to go
> wherever the link points to
>
> }, 1000);
>
> return false; // to prevent default action to be immediately triggered
>
> });
>
> Hope it helps.
>
> Michel Belleville
>
> 2010/1/4 david.vansc...@gmail.com :
>
> > I've been searching high and low on Google over the last hour looking
> > for this, but can't seem to find anything. Maybe I'm using the wrong
> > search terms, but I'd think what I'm trying to accomplish is something
> > that's been done before.
>
> > What I'm looking to do is delay the action of a click for a set period
> > of time. I have a list of links for download zip archives and when
> > you click on one of those links, I use the BlockUI plugin to show an
> > overlay with a message that tells the user their download will start
> > momentarily. The reason this is done is so that I can fire off an
> > AJAX event that inserts a record into a database for download
> > tracking. Ideally what I'd like to do is fire the AJAX event (which
> > should only take about .2 seconds to run) and then wait for 2 or 3
> > seconds before unblocking the UI and *then* letting the default action
> > of the click (offering up the zip archive) fire.
>
> > Any ideas how I might accomplish something like this?
[jQuery] Lists, Filtering and Searching, Oh My!
A while back, the company I work for tasked me with coming up with a better way to move through a listing of forms on our Intranet. The way it was done before involved two identical files being maintained simultaneously, one sorted by the form ID (AA0001) and the other by name. The list of forms is nothing to sneeze at ... the first page includes a list of over 1800 forms. My first stab at a solution moved everything into a single unordered list. I was able to assign classes to each list item for the alpha character, the ID and type. Clicking on the appropriate links would show only those items which you selected. I also plugged in Rik Lomas' awesome QuickSearch plugin to quickly search the list. The only drawback was that the group responsible for maintaining the list of forms had to choose whether they wanted the list sorted by name or form ID. They chose name. Last week though, they decided that wasn't good enough and they needed to be able to sort by either name or form ID, so I've been handed this project again and told to make it work more to their liking. A table would break from the way they've organized these forms for years now, so they're really not interested in something like that, so it'd really need to be a list. The forms need to be able to be sorted alphabetically by name or form ID as well as organized by category. My first idea was to build a big (and I mean BIG) JSON file that would store all the information for these forms. I'd then be able to parse through the JSON object and build the list on the fly based on what they clicked. Of course, we're talking about a JSON file that'd probably be over 2000 lines and would have to be parsed every time they click something (I'm not sure if I could call in the JSON file and have it available instead of using $.getJSON). Then there's the issue of searching. Obviously QuickSearch works great, but how am I going to search through a static file without throwing everything on to the page? As you can see, I've begun brainstorming some ideas, but I'd really love to hear what other solutions come to mind for you guys. Any ideas you have would be awesome. Thanks! David
[jQuery] Weird Hiding Issue
The answer to this is probably really simple, but I'm just not finding it. I'm working on a newsletter and they want the first paragraph of each article shown, then a More link at the end. Got that working fine. I even have it working so that it automatically hides all but the first paragraph tag. Perfect. However, I have a few unordered lists inside paragraph tags and the unordered lists aren't hidden when the page loads, even if they're inside the paragraph tags. How would I get those elements to be hidden when the paragraph tag is hidden? Thanks!
[jQuery] Re: Weird Hiding Issue
Yeah, I figured it was probably something along those lines. So what would be the best way to hide all but the first element of a DIV? David On Jan 23, 11:12 pm, Karl Swedberg wrote: > Hi David, > > I suspect the unordered lists aren't being hidden because the browser > will not recognize that they are within the paragraph. > > Paragraphs are not allowed to have any block-level elements inside of > them: > > > The P element represents a paragraph. It cannot contain block-level > > elements (including P itself). > > http://www.w3.org/TR/html40/struct/text.html#h-9.3.1 > > When you have an invalid DOM structure, script goofiness happens. > > --Karl > > > Karl Swedbergwww.englishrules.comwww.learningjquery.com > > On Jan 23, 2009, at 3:46 PM, david.vansc...@gmail.com wrote: > > > > > The answer to this is probably really simple, but I'm just not finding > > it. > > > I'm working on a newsletter and they want the first paragraph of each > > article shown, then a More link at the end. Got that working fine. I > > even have it working so that it automatically hides all but the first > > paragraph tag. Perfect. However, I have a few unordered lists inside > > paragraph tags and the unordered lists aren't hidden when the page > > loads, even if they're inside the paragraph tags. How would I get > > those elements to be hidden when the paragraph tag is hidden? Thanks!
