Skip to main content

Posts

Showing posts from January 13, 2012

jQuery FullCalendar timezone syncronization

I am using the jQuery Fullcalendar plugin (http://arshaw.com/fullcalendar). I am only using it for "full day" events. When the user creates an event, I store it in my database via php as a date (2012-01-12). When sending the list of events to FullCalendar via ajax I convert the date to UNIX time. The problem I am foreseeing, is the case where say the server is in the US with a US timezone, and the client is in Europe. The server sends an event for 2012-01-12 00:00:00 (US Time), which gets converted to a unix time. Then the client may see an event that is at 2012-01-12 08:00:00 (8 hours later). How can I make sure that if an event is at midnight, then it's at midnight EVERYWHERE - no need adjust any timezone. If a user creates a full day event on January 12th, I need every user around the world to see it on that same date as well.

IE 7 expected identifier, string or number

Im having a problem and cant seem to find it for the life of me because my code works in all other browsers except IE7. This is the error im getting "expected identifier, string or number" This is my code. function calculate() { var principal = document.loandata.principal.value; var interest = document.loandata.interest.value / 100 / 12; var payments = document.loandata.years.value * 12; var x = Math.pow(1 + interest, payments); var monthly = (principal*x*interest)/(x-1); if (!isNaN(monthly) && (monthly != Number.POSITIVE_INFINITY) && (monthly != Number.NEGATIVE_INFINITY)) { document.loandata.payment.value = round(monthly); document.loandata.total.value = round(monthly * payments); document.loandata.totalinterest.value = round((monthly * payments) - principal); } else { document.loandata.payment.value = ""

Stretching a HTML Input Box alongside additional input?

I'm using jQuery on this site, which has form inputs. I'd like one particular field to get longer (width) as the user enters data and space runs out. How can I calculate when I ACTUALLY need to make the input ( type="text" ) longer? What works for one browser may not work for all browsers. Is this something that can't be calculated, so everybody does it based on trial and error within each browser? Will I need to resort to this and tweak stretch values with a .keyup() that checks the value?.. EG.. $(".stretchInput").keyup( function(event) { var someValueAdjustedByTrialAndError = 30; var stretchPastLength = someValueAdjustedByTrialAndError; var stretchBy = 5; var baseWidth = 100; if ($(this).val().length > stretchPastLength ) { $(this).css('width',(baseWidth + ($(this).val().length - stretchPastLength ) * stretchBy ) + 'px'); } else { $(this).css('width',''); } });

JSON parse with jquery?

I could use some help with the syntax when using jquery to parse this json data coming back from the server. I have tried several examples from stackoverflow and other sites and for some reason I keep getting undefined as the out put instead of the id numbers. Each one should be its own line. { "ROWCOUNT":7, "COLUMNS":["ID"], "DATA":{"id":"211","212","213","221","222","223","232"]} }

CSS, Javascript functionality issue relating to styled input buttons on newer browsers? (IE 8/9, FF 9)

I'm working on a site where I have input buttons (styled using CSS) that are a part of a form. For example, see below for sample code <input type="submit" name="buttonSave" value="save" id="buttonsavejs" class="button_image button_style"/> I've just found an issue where if a user clicks on the button, it moves a few pixels below and then expected action takes place intermittently . But intermittent , I mean that sometimes it works (redirects the user to the next page) and sometimes nothing happens. The developer who worked on this previously hasn't documented his code much, so I'm trying to work from scratch here (so excuse the lack of details). Anyway, after testing the code, it appears that the issue lies with how newer browsers are rendering the css and javascript. Here's a snippet of the javascript behind the button's functionality: $("#buttonsavejs").click(function(){ $(&quo

jQuery IF var = value or #id clicked

I have the .live aspect working now so if links are clicked, my function is executed, but I'm trying to figure out how include an option for a direct link to the content as well. Something like this: $(showDiv).is('shipping-timeline') or $("#inm_if_hc_shipping_timeline").live('click', function() { [code to show and hide divs] }); showDiv contains the value that identifies the proper id, extracted from the URL. My Question: How do I construct the IF statement to execute if either case is true? Can anyone help? Thanks! UPDATE: So I took the IF parts from Graydot's answer and applied it to my code and here is a more complete example of what it looks like now: $("#inm_if_hc_faq").bind('click', function(e) { if(showDiv == 'faq') { // prevent default behavior e.preventDefault(); $("#inm_if_hc_content_faq").show("slow"); $("#inm_if

How to execute Jquery-code in a dialog which received its content via $.get

Let's say the following code exists in template_A popping up a dialog which displays content from template_B. The html is presented fine in the dialog but unfortunately any javascript included in template_B does not run. Jquery & Jquery-ui are included in template_A. template_B has no javascript-includes as it is represented by a div belonging to template_A. JS in template_A : var win = $(document.createElement('div')); $.get(url, function (html) { win.html(html); win.dialog("open"); }); template_B : <div id="content"> <script type="text/javascript"> $(function () { // this never executes, // js-debugging won't enter this part... }); </script> </div>

Form XML string by recursively traversing an un-ordered list

I need a jQuery/JavaScript function to form an XML string from an un-ordered list This is the HTML <ul> <li> <input class="checktree" type="checkbox"/> <label>PhoneNumbers</label> <ul> <li> <input class="checktree" type="checkbox"/> <label>PhoneNumber</label> <ul> <li> <input class="checktree" type="checkbox"/> <label>number</label> </li> </ul> <ul> <li> <input class="checktree" type="checkbox"/> <label>type</label> </li> </ul> </li> </ul> </li> </ul> This is the code I have now NOTE: item i

jQuery DOM manipulation memory leak in IE

We found a serious memory leak on IE when doing DOM manipulation. Basically, we were doing this: $('#dataTableContainer').empty().html($(data).find('#dataTable')); and repeating that line once every 2 seconds. From what we were able to see, that line was leakin around 1Mb of memory every 10 seconds with the jQuery 1.7.1 (it was even worse with older versions). Are we doing something wrong? We tried several solutions already published in stackoverflow (Ex. jQuery memory leak with DOM removal ) but none worked.

JQuery success callback isn&#39;t being called or?

I have searched a lot of threads but i can't find any answer that suits me. Now I will try to explain my problem. I have a simple jQuery script that does a little ajax request. its simple like this: print(" <script> function buscaCaracteristicas(idTotalizador){ var target = '../../ajax/doSomeSearch.php'; $.ajax({ url: target, //dataType: 'html', dataType: 'text', type: 'POST', success: function(msg){ alert(msg); } }); } </script> "); And the PHP page does this: <?php $ret = "<p>hello world</p>"; exit($ret); ?> I have tried putting the return data on an HTML element via $.html(msg) too. Problem is: alert or the $.html() on callback NEVER fires although on firebug I can check the request has the return code 200 OK. Notice that the function code is wra

Javascript to implement drag box for client

How can I implement a javascript which gives the client option to drag various boxes from the selection and place it in the screen? My primary goal is to let user design the interface by placing various boxes in the screen where they want to place it and save it so that they can log in later to see their screen.

jQuery $(window).resize() not working when decreasing window&#39;s height

I have a div with an id "main", I want to set its height using jQuery and making so that on window.resize its height is modified using a function but for some reason it works well only when increasing window's height, when decreasing it it doesn't work. This is the JS: function setMainH() { var docH = $(document).height(); $("#main").height(docH - 40); } $(function() { setMainH(); }); $(window).resize(function() { setMainH(); }); EDIT: the problem appears either increasing or decreasing EDIT 2: the resize() event seem to be called correctly, I've tried with console.log("resizing"); on resizing and it logs correctly so the problem isn't that.

jquery avoid multiple requests preventDefault

I need a way to prevent multiple submits: $("#myDiv").click(function(e) { e.preventDefault(); console.log('open'); // submit the form $('#myDiv #myInput').click(function(e){ e.preventDefault(); /* ajax call here */ console.log('clicked'); }); }); So if when I click #myDiv is sending X times click to the child function. eg. if you click 3 times #myDiv and then click #myInput will send 3 times the form, and if you press again will send 6. Any ideas how to fix it?

Long loading times (or not even loading) with jQiery $.ajax on mobile Safari

I'm working on a web app completely made in JS (using jQery) and HTML. I discovered a problem with $.ajax and / or $.get calls which do not load or take veeery long to load. $.ajax({ dataType: 'jsonp', jsonp: 'callBack', url: 'http://mmsrv.local/character/userb', success: function(ret) { $('.charName').text(ret.data.name); $('.charLevel').text(ret.data.level); $('.charExp').text(ret.data.exp); } }); This is my code to load jsonp. At first I thought it's a problem with unsupported jsonp. But even the following code does not work $.get({ url: 'http://localhost/', success: function(data) { alert(data); } }); The 2nd snippet works perfectly on desktop browser, but not on Mobile Safari. The first one loads well in Desktop browser but goes into a "loading-loop" when visited on Mobil

Keep form values after page reload - Codeigniter

How can I keep checkboxes selected after the form has been submitted? I found the set_checkbox function in the Codeigniter User Guide, but it doesn't work. Form field code from the User Guide <input type="checkbox" name="mycheck" value="1" <?php echo set_checkbox('mycheck', '1'); ?> /> <input type="checkbox" name="mycheck" value="2" <?php echo set_checkbox('mycheck', '2'); ?> /> I also googled this and found a couple of workarounds, but they were based on previous versions of Codeigniter. And they were based on Form Validation, which isn't necessary for my form, because none of the fields are required. How can I retain the checkbox field value after the form is submitted? UPDATE : This question is not about form validation and errors. I want to retain the checkbox field value AFTER the page is reloaded. Is jquery a possibility?

Is there any way I could auto-fill the fields on this registration page?

I have a link to a registration page: Registration Page When I take users to the page, I'd like to save them a load of time, frustration and calories to burn, by filling in the fields automatically. The whole form is ran in JavaScript and JQuery by the looks of things, but I have no idea where I would start to actually do something like this. I have the users details (to input into the fields) in a SQL db, so some PHP parsing to start off with. Any ideas where I'd go from there? SORRY,forgot to mention: I don't have any moderation access to the Reg page.

Disable jquery in masterpage for a specific content page?

I have this code that warns the user about unsaved changes and it's in the MasterPage of the site I'm working on. I have a search page that doesn't allow the user to save anything and it triggers the unsaved changes warning. Is there a way to disable the code for this one content page? var _changesMade = false; $(document).ready(function () { $('form').bind($.browser.msie ? 'propertychange' : 'change', function () { _changesMade = true; }); $(window).bind('beforeunload', function () { if (_changesMade) return 'There are unsaved changes which will be lost if you continue.'; }); });

Custom Accordion

I have the accordion below which works but when an item is open if you click it again it re opens instead of closing. I'm not sure of the best way to adapt the code below to achieve this? Any help or advice would be great? Thanks $('.acc h2').click(function() { $('.acc h2.open').nextUntil('h2').stop(true, true).slideToggle(); $('.acc h2.open').removeClass('open'); $(this).nextUntil('h2').stop(true, true).slideToggle(900); $(this).toggleClass('open'); }); <div class="acc"> <h2>1. Title 1</h2> <div><p>text 1</p></div> <h2>2. Title 2</h2> <div><p>text 2</p></div> <h2>3. Title 3</h2> <div><p>text 3</p></div> </div><!--END acc-->

How do I track router change events in Backbone.js

I need to run a function every time the application switches URLs in Backbone.js, and I need to know the hashtag the URL has changed to. I'm assuming there is an event that I can bind to but I haven't been able to figure out which event and what object to bind to. Specifically I want to ship the new URL to an analytics application.

Set variable within another context

I have the following function "use strict"; function Player { this.width; this.height; this.framesA = 5; this.image = new Image(); this.image.onload = function () { width = this.width; height = this.height / framesA; } this.image.src = "Images/angel.png"; } How can I make this code to work? I want the width and height in the Player function be inalized with the width and the height of the image when the onload function is called. I need this to work with strict mode (A must). If this should be accomplished another way feel free to teach. EDIT: I updated the code to reflect a more realistic situation(I didn't know this will be so complicated) EDIT 2: Another update to the code. I didn't notice that I wrote var insted of this. Sorry. Thanks in advance

communication between an iframe and the page its part of through javascript in ie8

I have seen many questions like this but have not found anything that seems to help with my specific situation so I apologize if this question seems repetitive. I have a site www.foo.com and have an iframe in it. When information I click on an a tag in foo.com a javascript function is called that passes a new image to the iframe to show the user. The communication between iframe and its "parent" seems to work fine on all browsers EXCEPT RANDOM IE8 PAGES. I get the following error message "access is denied" and the browser points to the function that has been activated. Following is a piece of code from the site to see how it works. the iframe: <iframe scrolling="no" src="foo.com/bar" id="ifram" name="ifram"></iframe> the a tag: The javascript: if($(this).val() == '242'){ document.getElementById('ifram').style.border='0px'; document.getElementById('ifram').style.back

How can a Chrome extension&#39;s content script determine the injected page&#39;s referrer?

What is the best way to determine a page's referrer within the context of a content script in a Chrome extension? It looks possible to intercept requests' headers using the chrome.webRequest module, but it would then take some book-keeping and message-passing in order to get it into the content script. That approach feels kludgy. Is there a better way?

How to use keywords to filter a JSON array object?

I am trying to find a way to take an array of keywords that are user createda and filter a JSON array, and have the results appended to the screen. Below is the actual code I am using. var keywords= []; var interval = ""; var pointer = ''; var scroll = document.getElementById("tail_print"); $("#filter_button").click( function(){ var id = $("#filter_box").val(); if(id == "--Text--" || id == ""){ alert("Please enter text before searching."); }else{ keywords.push(id); $("#keywords-row").append("<td><img src=\"images/delete.png\" class=\"delete_filter\" /> " + id + "</td>"); } } ); $(".delete_filter").click( function(){ ($(this)).remove(); } ); function startTail(){ clearInterval(interval); interval = setInterval( function(){ $.getJSON("ajax.php?function=tail&pointer=" + p

Change css class with php multi pages

I have a multiple pages website where I wan't to change some css stuffs. So my index.php?p=page points to various pages but on every page I also want to adjust some css like the color of the currently active menu item(li) etc. What is the best way to achieve this? Should i just make a php var on each page?

JavaScript method not working in ASP.NET User Control

I asked a question before about a JavaScript code you can see it here : How can I scroll down to a multiline TextBox's bottom line, Javascript's scrollIntoView is not working for this . Well, it was solved and the accepted answer was working. Afterwards I had to move the code part you can see in that question to a User Control which finally looked like this : <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="LiveChatPart.ascx.cs" Inherits="BeyzamComArayuz.LiveChatUserControl.LiveChatPart" %> <%@ Register src="/LiveChatUserControl/GenelOdaFlashPart.ascx" tagname="GenelOdaFlash" tagprefix="gOF" %> <script language="javascript" type="text/javascript"> function buttonClicked() { // var el = document.getElementById("TxtBxOdaMesajlari"); var textBox = $get("TxtBxOdaMesajlari"); textBox.scrollTop = textBox.scrollHeigh

jQuery setTimeout issue

I have a simple function that animates a bunch of images by crossfading them. A simple banner rotation. I set up the function so that calling animateSlideshow("play") it should set the timeout and start animating and by calling animateSlideshow("stop") it should stop. When I call stop, however, the animation happens one more time. What is the cause for this one extra animation and how can I deal with it? function animateSlideshow(action){ if(action === "play"){ $(activeSlide).data('animateSlideshow', setTimeout(function(){ if( $(actvImg).index() === total - 1 ){ $(actvImg).fadeOut(animationSpeed).removeClass("actvImg").siblings().eq(0).fadeIn(animationSpeed).addClass("actvImg"); }else{ $(actvImg).fadeOut(animationSpeed).removeClass("actvImg").next().fadeIn(animationSpeed).addClass("actvImg");

phonegap page redirect not working, property &#39;location&#39; of object is not a function

I'm trying to do a simple page redirect in phonegap with js. This code is called from within an iframe, so I'm doing: window.parent.location("event_select.html"); but this doesn't work, and I get the error: uncaught typerror: property location of object(DOM window) is not a function. what am I doing wrong?

file upload using dojo.io.frame.send doesn&#39;t work in IE the first time

I'm trying to do an ajax file upload using dojo.io.frame.send(). It works with FF and chrome without any issues but not in IE 8 (not sure about other versions). The code is pasted below: function submitForm() { dojo.require("dojo.io.iframe"); dojo.io.iframe.send({ url : "/uploadfile.do", form : "myForm", method: "POST", handleAs: 'text', load : function(response, ioArgs) { return response; }, error : function(response, ioArgs) { return response; } }); return false; } I searched on the web and found this: http://groups.google.com/group/dojo-interest/browse_thread/thread/17dace02652bcec3 which prompted me to add the following snippet after dojo.require() line in the above code: if ((dojo.isSafari || dojo.isIE) && dojo.io.iframe["_frame"]) { dojo.destroy(dojo.io.iframe['_frame']); var frameName = dojo.io.iframe._iframeName; dojo.io

Javascript redirect causing a security exception in asp.net 4.0 forms

As part of my current project I have had to make a page take on two functions due to some functional limitations. At present the two views are turned on and off based on a query string value. The page is loaded from an menu that is similar to that of the original ipods and as such uses Javascript to kick things off. The problem is when I select my url (along with the query string value) I get a potential security risk error. I believe that its down to security not allowing Javascript to redirect with the query string, however I am at a loss as to how we solve this one. The error reads -- 'A potentially dangerous Request.Path value was detected from the client (?).' I know that I can turn the security off on the page, however this is not an option in this instance. Any ideas would be greatly recieved. Thanks in advance

Can we access the URL of next request of browser in prevailing HTML page &#39;s unload function

As Html code resides until new url request's response doesn't come .Then Browser calls BeforeUnload and Unload function. This means anywhere in the browser, the url is residing which has been hit for unloading the current one. So is there any way we can get that (new) URL in the Unload function? Actually My scenario is that I want pop up to be opened for providing the other options when user has just hit another URL which doesn't resemble to our domain , showing that he want to go out from our site.

Debugging Sencha Touch in Google Chrome: How to set a breakpoint?

while trying to debug the NestedList title bug http://www.sencha.com/forum/showthread.php?161303-NestedList-example-from-Github-updateTitleText-not-working I was able to set a breakpoint using Google Chrome -> Tools -> Developer Tools, in my own javascript, but I am not able to set any breakpoint in the sencha-touch-debug.js script. Is there a way to set a breakpoint in sencha-touch-debug.js ? Or is there any better way to debug the Sencha touch core?

Remotely install apps on android from the web-based market

I want to install let's say all of the top-100-free applications of the market on my android phone. I know this is doable by hand directly on the phone or with the web version of the market. Anyway, I try to automate this process. I initially thought about using libraries such as selenium, mechanize or httpUnit to programatically interact with the web-based market. But the code of the page is pretty obscure (due to some optimization/offuscation in the Javascript part) and I can't really figure out how to build the right requests to make it. By the way, I am ready to root my phone. Does anybody have an idea how to do it? Edit Beware, don't try to do this, this is illegal

Syncing dnode and Express authentication - How?

I'm building a web app with Express and dnode and I'm trying to synchronize authentication between the two. I found the following example, but the 'sessionCheck' event doesn't appear to be firing on the connection object: http://repos.io/project/github/tblobaum/dnode-session/ Anybody have input for how to correctly synchronize auth between Express and dnode using sessions? Thanks, Matt

Simulate top scroll using javacsript setInterval & clearInterval

I want to simulate scroll by moving body/html frame to the top/upwards by arbitrary amount. I know jQuery scroll or animate function, .scroll() and .animate() . But I have decided not to use it since it caused conflict between scrollTop property in animate and .scroll() jQuery native function when the animation happens and is still ongoing AND the .scroll gets called.. My plan is now to just simulate scroll by moving body/html frame to the top as smooth as possible by some arbitrary amount, and then STOP (clear the interval) when there's a native scroll happens ( .scroll() gets invoked). I am able to stop the setInterval animation when .scroll() is called, but I am still not able to move the html object to the top by the amount I want it to "scroll" (which means my code only partially works). Here is what I have so far: var scrollTop = //Some arbitrary value var fakeScroll = setInterval(function(){ console.log(scrollTop); var animObj = $('

jQuery: How to apply an effect to an element that shares a name with other elements

I am trying to write some code where a description box pops over an image when I hover over it. I have multiple images on my page which sort of looks like this: <div class="image"> <a href="?page=page1>"><img src="images/1.jpg" width="220" height="220"></a> </div> <div class="description" style="display: none;"> description 1 </div> <div class="image"> <a href="?page=page2>"><img src="images/2.jpg" width="220" height="220"></a> </div> <div class="description" style="display: none;"> description 2 </div> <div class="image"> <a href="?page=page3"><img src="images/3.jpg" width="220" height="220"></a> </div> <div class="description" style="display: none;

In jQuery what&#39;s the best way to add a class on mouseover and remove it on mouseout?

Is there a jQuery shortcut for this? $(element).on("mouseover", function() { $(this).addClass("hover"); }).on("mouseout", function() { $(this).removeClass("hover"); }); I see in the jQuery docs a method called hover() , but that seems to bind on events mouseenter and mouseleave (should I be using those events instead of mouseover and mouseout ?)

Filter array in PHP using keywords?

What could I add to the following code to filter the returned results using keywords in an array? The code that send the keywords, and made the funciton call is in Javasript. The code below opens a file, takes a pointer using a request, opens the file finds the pointer, and retrieves all log lines from the pointer to the end of the file. Then it formats it into a JSON object and sends back to Javacript. function tail(){ $keywords = json_decode($_REQUEST['keywords']); $file = "/path/to/the/log.log"; $handle = fopen($file, "r"); clearstatcache(); if ($_REQUEST['pointer'] == '') { fseek($handle, -1024, SEEK_END); } else { fseek($handle, $_REQUEST['pointer']); } while ($buffer = fgets($handle)) { $log .= $buffer . "<br />\n"; } $output = array("pointer" => ftell($handle), "log" => $log); fclose($handle); echo json_

gRaphael Library: Can&#39;t Create Line Chart

I'm using the gRaphael JavaScript library, and am attempting to draw a simple line graph. The code I currently have on the page is: <script language="javascript" type="text/javascript"> var paper = Raphael(10, 50, 640, 480); paper.g.linechart(10,10,300,220,[1,2,3,4,5],[10,20,15,35,30]); </script> I found this code from a tutorial, located here: https://github.com/kennyshen/g.raphael/blob/master/examples/linechart/linechart_basic.html All the required files, raphael.js , g.raphael.js , and g.line.js , are included earlier on the page as well. When I view the page, it just shows up as a white screen. Would appreciate any help, thank you.

AJAX one way client to server push possible?

I'm trying to write a javascript web app that will communicate with a custom java server using AJAX. My client app needs to send pieces of data at irregeular intervals, sometimes multiple times per second, and does not need any response data from the server. Is there a way to keep an XmlHttpRequest connection open and reuse it to send this data without ever closing or getting a response? On the client side, I'm going by this post to reuse the XmlHttpRequest: http://keelypavan.blogspot.com/2006/03/reusing-xmlhttprequest-object-in-ie.html and it seems to be working. I'm able to send repeated requests to the server without getting a response. But on the server side my main problem seems to be with java.net.SocketServer. I'm creating a single SocketServer and putting the accept() method in an infinite loop to handle requests. When a request comes in, the loop fires exactly 3 times with the same request data - this is if and only if I don't write to the outputstre

Resend AJAX request with link?

Is there anyway to reload just the AJAX request, so that it updates the content pulled from the external site in the code below? $(document).ready(function () { var mySearch = $('input#id_search').quicksearch('#content table', { clearSearch: '#clearsearch', }); var container = $('#content'); function doAjax(url) { if (url.match('^http')) { $.getJSON("http://query.yahooapis.com/v1/public/yql?"+ "q=select%20*%20from%20html%20where%20url%3D%22"+ encodeURIComponent(url)+ "%22&format=xml'&callback=?", function (data) { if (data.results[0]) { var fullResponse = $(filterData(data.results[0])), justTable = fullResponse.find("table"); container.append(justTable); mySearch.cache()

object Key in javascript class/dictionary?

I have a Javascipt object which I use as dictionary var obj={ xxx:'1' yyy:'2' } However - xxx and yyy should be a jQuery object . something like : var obj = { $('#div1'):'1' , $('#div2'):'2' } is it possible ? also, How can I get the " value " for key $('#div2') ? p.s. I the $.data cant help me here since its also a key value and i need in the key - object Type also.

javascript/css navigation menu not hiding nested ul

I have a navigation made and it has sub-levels, which works fine. However, I now want to add ANOTHER level to a sub-level, so that I can choose Lookup-->Webinar-->By Date The way I have this set up, the extra level is not hidden by default. It is only supposed to show when the word "Webinar" gets hovered over. Can someone help? <div id="menuwrapper"> <ul id="p7menubar"> <li><a href="#" class="trigger">Lookup</a> <ul> <li><a href="/ProductLookup.aspx">Product</a></li> <li><a href="/CategoryLookup.aspx">Category</a></li> <li><a href="#" class="subtrigger">Webinar</a> <ul> <li><a href="/WebinarLookupByDate.aspx">By Date</a></li> <li><a href="/WebinarLookupByName.aspx"&g

jQuery buggy setTimeout animation

I'm experiencing a bug with animated elements. When you right-click on a group its name-field expands downwards so that it is revealed along with 2 other groups on the line. And then a animation puts it on the default state triggered with setTimeout() after a few seconds. However if you start clicking randomly and intensively on groups on the line without waiting the current animation to finish it breaks becomes buggy and executes much faster then the given timings! Here's the key part of the code: var t = window.setTimeout(function() { for (var i = highFrontier; i > lowFrontier - 1; i--) { jQuery(groupBoxes[i]).animate({ height: '76px' }, 400, 'linear', function() {}); } }, 3300); And here's the entire application: http://jsfiddle.net/TTGr7/20/ 10x for your kind help, BR

Reference syntax does not match behavior for replace()

The function below does not work unless I assume that .replace returns the new string. The syntax implies that the input string itself it modified. MDN str.replace(regexp|substr, newSubStr|function[, Non-standardflags]); Code escape: function ( second_split ) { for( element in second_split ) { second_split[element] = second_split[element].replace('**', '*'); second_split[element] = second_split[element].replace('*|', '|'); } return second_split; },

plupload removeFiles

I'm trying to remove files with not allowed extensions on the FilesAdded event. (I can't use the filter parameter as I need an exclusive list). I have some code a bit like this: uploader.bind('FilesAdded', function(up, files) { var count = files.length; var i = 0; for (i;i<count;i++) { var validExt = validate(files[i].name); if(!validExt){ I need to remove the files added if the extensions aren't valid. I've tried the following: uploader.splice(i,1) uploader.removeFile(files[i]); uploader.refresh(); The FilesRemoved event is fired, but removed files still get uploaded with uploader.start(). I don't know if this is a bug in the program, or too obscure to expect an easy answer to, but if anyone can help, I'd be really grateful. I don't think I'm missing anything obvious. Thanks.