Posted in Javascript on September 14, 2008
0
I spent a lot of time trying to find a simple, lightweight, drag-and-drop example to learn from. Finally I located a
drag-and-drop demo from the fine folks at WebToolkit. The Javascript is only 50 lines which impressed even me. I've tested this to work with Firefox, IE, and Opera.
Here's how to use it. The element must have position:absolute; or position:relative;.
var dragable = dragHandler.attach(document.getElementById('some_element_id'));
/*This function will be called when dragging starts. Note that we do not write begin(); here. */
dragable.dragBegin = begin;
/*This function will be called every time the element moves.*/
dragable.drag = drag;
/*This function will be called when dragging ends.*/
dragable.dragEnd = end;
The last three lines are optional. You can write your own functions (here, imaginitively named 'begin', 'drag', and 'end') that will be run when you specify.
Here's a
Drag-and-Drop example I made. Check the source code for the rest of the Javascript.
Posted in Javascript on May 7, 2008
0
Today I decided I needed to figure out a way to prevent people double-clicking Submit buttons. Now, before you get all horrified, I already did have protection server-side. But if the Submit button was double-clicked, the user would get a confusing "Duplicate transaction" message. Guess who would have to explain that one?
Disabling the Submit button was trivial, but in the scenario that the user's computer was not able to contact the server and the user clicked the Back button, the Submit button stayed disabled. The following Javascript solves both problems. Simply add
onsubmit='return submitOnce;' to your <form> tag.
This has worked successfully with Firefox, IE, and Opera. Please comment if you test it with any other browsers.
var form_submitted = false;
function submitOnce() {
if (navigator.appName == "Microsoft Internet Explorer" || navigator.appName == "Netscape" || navigator.appName == "Opera") {
if (form_submitted == false) {
form_submitted = true;
window.onunload = function() { form_submitted = false; }
return true;
} else {
return false;
}
} else {
return true;
}
}
Posted in Javascript on December 22, 2007
0
I thought I'd post my htmlspecialchars() functions for Javascript. This should mimic the PHP version of htmlspecialchars(). I also include rhtmlspecialchars() in case you need to do the reverse.
Read more...
Posted in Javascript on November 14, 2006
0
I've had a few requests to post my AJAX Communicate Function, so here it is. As you can see, you may pass four arguments to it. The first is 'method', which may be either GET or POST (defaults to GET), 'url' and 'querystring', which are self-explanatory, and 'failure'. The 'failure' argument may contain code to be evaluated in case of failure. This can be triggered due to anything from the server giving a 404 error to the user suddenly losing their network connection. This is optional, but useful.
Read more...
