Articles for JavaScript

Call multiple ajax calls in sequence, rather than all at the same time

Make Select2 Dropbox to work like an autocomplete

Load data based on what you type instead of loading all of it together

XWord

Missile JS example

Compare two lists for 'same' content

Simple one page spider

Ascii art - excel to source code table

If you want to paste an example from excel into your source code - use this

Paste multiple lines with crlf into a single cell, and prevent enter in child forms

javascript animation

jDrop file uploader

jDrop is a jQuery extension for uploading files. It is fully customizable and can be configured to work with any web site. It features Progress Bar and Drag & Drop if the browser supports them. It works by extending an existing control, and specifying user elements. It will detect if your browser and is compatible with HTML5, it falls back to implementing an iFrame for older browsers, so that there are no post backs required. It supports FireFox, Chrome, Safari, Opera, and Internet Explorer 6 +.

How to write an mvc view to a string

useful when returning ajax

How to do cool radio buttons or select buttons

from twitch

Infinite scroll

How to do an infinite scroll.

How to use jsonp and mvc to cross domains when we control both domains

Sometimes you need to call ajax on a different server. Thies is how to use jsonp and mvc to cross domains when we control both domains

Cool plugins for jquery

from the maker of colorbox

Colourbox and forms

Problems when forms disappear from colorbox (colorpowered)

How to convert a DataSet to JSON for return via ajax

How to convert a DataSet to JSON for return via ajax - without any library dependencies

Mobile Websites

Cubiq.org Matteo Spinelli has got lots of mobile optimised javascript demos and libraries. http://cubiq.org/category/projects SwipeView - Provides swipe enabled slideshow with hardware accelerated animation iScroll - Proper scrolling DIVs on mobile Add to Home Screen Slide in Menu - a really nice ...

How to resize an iframe from within the iframe - using postMessage for communication

JS Date calcs

Mobile frameworks

Javascript Fullscreen mode

rflow.com/questions/1125084/how-to-make-in-javascript-full-screen-windows-stretching-all-over-the-screen">http://stackoverflow.com/questions/1125084/how-to-make-in-javascript-full-screen-windows-stretching-all-over-the-screen function cancelFullScreen(el) { var requestMethod = el.cancelFu...

jQuery

How to make some options in a dropbox grey This makes all options which contain the word 'discontinued' grey. function GreyOutInactiveProducts() { jQuery(".ProductSelector option:contains('discontinued')").css("color", "#666") } jQuery(document).ready(GreyOutInactiveProducts) How to use JS...

jQuery UI Autocomplete

There are 2 versions of jquery autocomplete - the old and the new. Both written by same dude, Jörn Zaefferer who also wrote Validation plugin. New Version Works with JSON data source (very tricky to do plain text - see here) Compatible with jquery 1.4 Part of jQuery UI 1.8 All methods pretty much...

Compare technologies

http://socialcompare.com/en/search?q=javascript&l=on&c=on Sliders http://socialcompare.com/en/comparison/javascript-slideshows-carousel-sliders-jzoekfm Charts http://socialcompare.com/en/comparison/javascript-graphs-and-charts-libraries

Flash IE8 Javascript Error

Flash generates a bunch of js code for communication with javascript. This can easily break in old versions of IE. Here is some of the Flash generated code: function __flash__addCallback(instance, name) { instance[name] = function () { return eval(instance.CallFunction("<invoke name=\""+n...

Position and Move in Jquery

If you have a page with a space in it, and you want to move a div into that space that is tacked onto the end of the page, you could do this. <script type="text/javascript"> $(document).ready(function () { var formTop = $('#chimpform').position().top var formTopPosn = $('#chimpformPosn')....

JQuery Validation and HTML 5

As Html 5 comes online more some of the older jquery valiation may not appear to work (first noticed in chrome). This is because HTML5 validation overrides JQuery Validation. To fix this add the following tag in the $(document).ready function to disable the default HTML5 validate.. $("#form").att...

Protect content on a page from copy

Using jquery, add this code (unless site is in dev mode) <%if(!Util.ServerIsDev){%> //prevent copy/paste $('body').bind('copy', function (e) { alert('Sorry, copy not allowed. Please note that Paste is allowed.') e.preventDefault(); }); <%} %> It's a fairly simple way to prevent pe...

Jquery Client Side JS Validation examples

How to put in a custom validator with jQuery validate For my current project I needed a custom validator method for the jQuery validator plug-in. I wanted to validate that a user has chosen a value from a combo box where the value is of type Guid. First I implemented a JavaScript function which tes...

jQuery Event Handling

Cloning elements and Binding and Rebinding events Use .clone(true) to copy event handlers as well. This article describes in more detail and also talks about rebinding and unbinding events manually when doing DOM manipulation other than cloning. http://www.learningjquery.com/2008/05/working-with-ev...

JQuery UI

Issues with jquery ui datepicker in Chrome answer from http://forum.jquery.com/topic/jqueryui-datepicker-and-google-chrome Here is the scenario: The page contains a form, with a dropdown box, a date field (with JQueryUI Datepicker) and a submit button. When I click on the submit button in C...

jQuery Validation

Emulate ASP.NET validation groups with jQuery validation http://encosia.com/2009/11/24/asp-net-webforms-validation-groups-with-jquery-validation/ In my most recent post, I demonstrated a workaround to allow using the jQuery validation plugin with WebForms pages. The basic idea was to trigger vali...

Change the source (src) of a flash movie without page reload

How to Change the source (src) of a flash movie without page reload function ChangeSwf(movieSwf) { var NewSwf = "img/"+movieSwf; if(document.all) { flashbg.LoadMovie(0, NewSwf); } else { document.embeds['flashbg'].LoadMovie(0, NewSwf); } } add this to the obj/embed <PARAM name="s...