#dearmassimo A Great 20th Century Designer

By | October 15th, 2014|

As stated in fastcodesign.com we lost an icon to design. He was truly ahead of his time.

State Farm Mural for Bonnaroo Music Festival #ThrowBackThursday

By | March 6th, 2014|

I believe when like minded artists get together on a project, a lot of excitement is known to radiate from the centers of each participating individual’s euphorically enhanced consciousness to shoot through to the creative gods who may smile in satisfaction in return.

On June 3rd, 2012, my creative partner Jorge Urbaez, set out on a kamikaze mission to creatively manage a 307.6 ft by 6 ft 2inch mural in 24 hours for State Farm on the Bonnaroo Music & Arts Festival site in Nashville, Tennessee.
Our major ongoing collaborator and producer for this project, Atomicus Films also set on board with us to document this project with photography and video.

We did not have time to complete such massive mural in such a short time constraint so we called some of New York City’s best street artists to collaborate with us: Ozbe (Xavier Peña), Brian Life, and Fumero.

Check it out

Post to your Facebook Business Brand Page From Instagram on Your mobile

By | November 30th, 2013|

I wanted to post to my NEXTMARVEL Facebook Brand Page from my @Nextmarvel Instagram page and didn’t realize how easy it was until I did a little research. So I thought it would be nice to share some key screenshots to help guide others through this simple process. See below and cheers!

To avoid subtle confusion: These screenshots were taken from my Samsung Galaxy Note 3 (1st Profile page screenshot) and my previous Galaxy Note 2 (all the rest of the screens).

First, go to your profile page and press the options button on the upper right hand corner of your mobile screen. Then the rest should be pretty self explanatory. Feel free to comment or send me a note at edgar@nextmarvel.net

nextmarvel, samsung galaxy note iii 3, samsung galaxy note iii 2, mobile, social media, instagram, facebook, settings

nextmarvel, samsung galaxy note iii 3, samsung galaxy note iii 2, mobile, social media, instagram, facebook, settings

nextmarvel, samsung galaxy note iii 3, samsung galaxy note iii 2, mobile, social media, instagram, facebook, settings

nextmarvel, samsung galaxy note iii 3, samsung galaxy note iii 2, mobile, social media, instagram, facebook, settings

nextmarvel, samsung galaxy note iii 3, samsung galaxy note iii 2, mobile, social media, instagram, facebook, settings

Pride, passion, hard work and more blogging…

By | October 1st, 2012|

I couldn’t be more proud of the team. Everyone is doing their part in being part of a greater vision.

My creative partner, Jorge Urbaez, is running photo-shoots, writing treatments, developing scripts, art directing sets for multiple video shoots and more.

Paul Denya, our technology guru is blogging and getting awesome results out of it, building websites and apps for all kinds of organizations while finding time to build his own available app store games, and then some.

I’m working on logos, client and investor presentations, websites, an e-zine, art, and when we can we all join forces on making something awesome on the side we do it and so much more.
It’s a learning process everyday! Building a business and a name is no romantic story because it involves so much hard work, sleepless nights, failures and triumphs… At the end of the day, there is never a point where anyone wants to give up though. We have collectively come such a long way it’s inspiring to look at where things were and compare them to where things can go because of today’s awesome opportunities on the table. Our network is exceedingly dynamic, diverse and milt-faceted.

As a sign of working so passionately for so many years, we are surrounding ourselves with incredible people! And I do not believe any of us have truly embraced the full monstrous genius that lives within each of us. The multidisciplinary possibilities in between us all is truly overwhelming and after so many years of working in the ever expanding fields of multimedia and production it is becoming more clear that we can literally do whatever we put our minds to.

Time management and keeping good health is becoming more key than ever. And It’s not easy! We are gearing up and getting ready for the rush of Winter to come.
It’s getting pretty cool in NYC already and I’m excited about it.

Personally it has been 10 years in the making of downs and ups. The downs can go really down and the ups can go REALLY UP, CRAZY UP!
My career path is has been an amazing adventure that only seems to brighten by every passing year. My life has been full of color, meeting unbelievable business people, creative talents, technological geniuses.

Big updates coming up for the NEXTMARVEL and our external business partners as we have developed so much in our time together and independently.

We can’t stop, and we won’t stop. Stay creative, be inspired and alive.


Rails Mountain Lion Errors

By | September 27th, 2012|

The Problem

If you’re starting rails server on Mountain Lion you might be encountering errors like these:

$ thin start
>> Using rack adapter
/Library/Ruby/Gems/1.8/gems/rmagick-2.13.1/lib/RMagick2.bundle: dlopen(/Library/Ruby/Gems/1.8/gems/rmagick-2.13.1/lib/RMagick2.bundle, 9): Library not loaded: /usr/lib/libltdl.7.dylib (LoadError)
  Referenced from: /Library/Ruby/Gems/1.8/gems/rmagick-2.13.1/lib/RMagick2.bundle
  Reason: image not found - /Library/Ruby/Gems/1.8/gems/rmagick-2.13.1/lib/RMagick2.bundle
	from /Library/Ruby/Gems/1.8/gems/activesupport-3.2.2/lib/active_support/dependencies.rb:251:in `require'
	from /Library/Ruby/Gems/1.8/gems/activesupport-3.2.2/lib/active_support/dependencies.rb:236:in `load_dependency'
	from /Library/Ruby/Gems/1.8/gems/activesupport-3.2.2/lib/active_support/dependencies.rb:251:in `require'
	from /Library/Ruby/Gems/1.8/gems/rmagick-2.13.1/lib/rmagick.rb:11
	from /Library/Ruby/Gems/1.8/gems/bundler-1.0.18/lib/bundler/runtime.rb:68:in `require'
	from /Library/Ruby/Gems/1.8/gems/bundler-1.0.18/lib/bundler/runtime.rb:68:in `require'
	from /Library/Ruby/Gems/1.8/gems/bundler-1.0.18/lib/bundler/runtime.rb:66:in `each'
	from /Library/Ruby/Gems/1.8/gems/bundler-1.0.18/lib/bundler/runtime.rb:66:in `require'
	from /Library/Ruby/Gems/1.8/gems/bundler-1.0.18/lib/bundler/runtime.rb:55:in `each'
	from /Library/Ruby/Gems/1.8/gems/bundler-1.0.18/lib/bundler/runtime.rb:55:in `require'
	from /Library/Ruby/Gems/1.8/gems/bundler-1.0.18/lib/bundler.rb:120:in `require'
	from config/application.rb:9
	from /System/Library/Frameworks/Ruby.framework/Versions/1.8/usr/lib/ruby/1.8/rubygems/custom_require.rb:31:in `gem_original_require'
	from /System/Library/Frameworks/Ruby.framework/Versions/1.8/usr/lib/ruby/1.8/rubygems/custom_require.rb:31:in `require'
	from config/environment.rb:2
	from /System/Library/Frameworks/Ruby.framework/Versions/1.8/usr/lib/ruby/1.8/rubygems/custom_require.rb:31:in `gem_original_require'
	from /System/Library/Frameworks/Ruby.framework/Versions/1.8/usr/lib/ruby/1.8/rubygems/custom_require.rb:31:in `require'
	from config.ru:3
	from /Library/Ruby/Gems/1.8/gems/rack-1.4.1/lib/rack/builder.rb:51:in `instance_eval'
	from /Library/Ruby/Gems/1.8/gems/rack-1.4.1/lib/rack/builder.rb:51:in `initialize'
	from config.ru:1:in `new'
	from config.ru:1

The Cause

Mountain Lion removes the /usr/lib/libltdl.7.dylib.

The Solution

1) Install XCode 4.4+ through the app store
2) Install the XCode Command Line Tools

XCode > Preferences > Downloads > Components

3) Make sure you have homebrew installed and run this:

brew uninstall imagemagick
brew install --fresh imagemagick

4) Then to recompile the gem against the new version of imagemagick:

gem pristine rmagick

Follow me on Twitter: @pdenya

Audibly: Audio Recording for Everyday Use

By | June 19th, 2012|

We’ve developed a utility for quickly and easily creating and sharing recordings from your mac desktop.

Audibly is a menubar application that lets you record audio anytime by holding a hotkey.
When you’re done recording the audio will be available on your desktop (like a screenshot).
We also upload the recording to the cloud and put a shareable link to it on your clipboard.

Check it out at audibly.nextmarvel.net.

An iOS match game for my kids

By | May 9th, 2012|

There are a lot of games in the app store available for entertaining young kids but the majority of them aren’t ideal for kids or parents. I built a simple match game for my kids that addresses a few common shortcomings of existing kids apps.

Important differences for me as a parent

  • No way for kids to get out of the game other than the home button. There are no ads, promos, in app purchase buttons, settings, start buttons, additional screens, or anything else. If the app is open all you see is the game board ready to play.
  • No sounds. This app does not make noise even when the kids are adjusting the volume and flipping the sound/vibration toggle.
  • It’s a universal app so you don’t need to buy it again on the ipad.
  • Has pictures of real animals and entertains the kids. Ok, maybe this one isn’t a differentiator.

I did my best to make it worth the 99 cents.

Ocean Match!

Animal Match!

15-30 Second Page Loads in Rails 3 Development Environment

By | May 5th, 2012|

The Problem

Rails development environment has incredibly slow page loads while production is fast. And when I say slow, I mean 15-30 seconds. Rails server will likely report the page as loading in under a second but it’s still taking 30 secons to show up.

The Cause

DNS problems. Nothing to do with rails, this is just the environment that’s not working. If your DNS is working correctly and you’re seeing page loads a bit faster than what I’m describing (3-8 seconds) check out rails-dev-boost

The Solution

Verify that you can ping the domain name you’re browsing to. I had some problem with my /etc/hosts file that a little bit of experimentation resolved.

If you found this helpful you might like to follow me on Twitter

Everyday Grep

By | December 24th, 2011|

Grep is well known and commonly used command line search function that far too many people aren’t taking advantage of. The purpose of this article is to give technically inclined folks easy to follow examples to speed up work. I’ll also discuss speed concerns because no one wants to wait 8 seconds for a search to finish.

Getting your feet wet: single file search

Searching a single file for a string is about as simple as it gets so lets jump right into it. The syntax is:

grep [search string] [file]

Here’s an example

grep "header" log/dev.log

Responds with:

Dec 09 17:16:24 Send header "Content-Type: text/plain; charset=utf-8"
Dec 09 17:16:24 "Pragma: public: 1"
Dec 09 17:16:24 Send header "Content-Type: image/png"

Case insensitive search

Adding the -i flag to grep makes it search without case sensitivity

grep -i "HeAdEr" log/dev.log

Responds with:

Dec 09 17:16:24 Send header "Content-Type: text/plain; charset=utf-8"
Dec 09 17:16:24 "Pragma: public: 1"
Dec 09 17:16:24 Send header "Content-Type: image/png"

Learning something useful: recursive search

The previous example could be done casually in a text editor. Searching all the files in a directory is also doable but from some text editors (the ones I use at least) it’s not quite as easy. The -r flag indicates recursion but I’ll be combining it with the -i flag in the examples below to retain case insensitive search.

grep -ri "iboutlet" .  

Responds with:

./InspectAppDelegate.h:@property (nonatomic, retain) IBOutlet UIWindow *window;
./InspectAppDelegate.h:@property (nonatomic, retain) IBOutlet TemplateListTableViewController *templateListController;
./InspectAppDelegate.h:@property (nonatomic, retain) IBOutlet UINavigationController *navigationController;
./LoginViewController.h:    IBOutlet UITextField *usernameField;
./LoginViewController.h:    IBOutlet UITextField *passwordField;    
./LoginViewController.h:    IBOutlet UITextField *subdomainField;        
./LoginViewController.h:@property (nonatomic, retain) IBOutlet UITextField *usernameField;
./LoginViewController.h:@property (nonatomic, retain) IBOutlet UITextField *passwordField;
./LoginViewController.h:@property (nonatomic, retain) IBOutlet UITextField *subdomainField;
./ProjectAddViewController.h:@property (nonatomic, retain) IBOutlet UITextField *projectNameField;
./ProjectDetailsImageViewController.h:@property (nonatomic, retain) IBOutlet UIImageView *imageView;
./ProjectDetailsImageViewController.h:@property (nonatomic, retain) IBOutlet UIImage *image;
./ProjectDetailsTextEditViewController.h:@property (nonatomic, retain) IBOutlet UITextView *answerField;
./ProjectDetailsTextEditViewController.h:@property (nonatomic, retain) IBOutlet UILabel *fieldName;

Special cases: getting a list of files

Recursive search is great but it can give you tons of results from the same file which isn’t ideal in all cases (eg: log files). Getting a list of the files which contain matches rather than a list of matches can be done by adding the -l flag

grep -ril "iboutlet" .

Responds with:


But that’s not all: additional flags

Grep is a mature and powerful tool and as expected it has far more options and uses than i’m going to go into here but I do feel compelled to list a few more flags that may be helpful.

-A 20

Prints 20 (or whatever number you specify) lines after each match.

-B 20

Same thing as -A but before each match instead of after.

-C 40

Same thing as -B 20 -A 20 (C for context).

-n  or --line-number   

Adds the line number of the match to the results.

-v or --invert-match     

Invert match (get all the results that don’t match the pattern provided).

A need for speed: making common searches faster within project directories

If you’re on OS X and you’re looking for a fast case insensitive search within a directory that shows only file names (grep -ril “pattern”) you should be using mdfind (spotlight on command line).

mdfind -onlyin . "iboutlet"

Responds with:


For those times when you’re not working on OS X a pruned find function can work wonders for improving slow search in large project directories. The idea is that in many situations, not all directories under the project directory need to be searched so we come up with a list of directories that do need to be searched and put them in a function in your profile.

#this goes in ~/.bashrc or /etc/profile
function projectfind() {
    grep -ril "$1" /path/to/project/search/me
    grep -ril "$1"  /path/to/project/search/here/too
    grep -ril "$1"  /path/to/project/web/js
projectfind "iboutlet"

This approach is project specific which isn’t great if you’re often switching between or starting new projects. You could change “/path/to/project/” to “./” but then you’d always need to be in the root project directory for search to work. The solution here is to pipe files to search to grep and use grep to prune the list in line. Here’s an example for a function that will search within the current directory but ignore log files and css directories:

#this goes in ~/.bashrc or /etc/profile
function myfind() {
   find . | grep -vE "\.log$|css" | xargs grep "$1" 

You can add additional logic by adding to OR clauses to the regex used in the first grep statement or adding additional grep statements.

Passing additional data to jQuery.Ajax callbacks

By | November 22nd, 2011|

jQuery makes it effortless to make additional data available from within the jQuery.ajax callbacks (success | error | complete) because within the callbacks, this refers to the object that was passed to jQuery.ajax. Knowing this, you can provide extra parameters that jQuery.ajax will ignore but you can access later. For example:

	url: ‘/‘,
	pudding: ‘chocolate’,
	success: function() {
		alert(this.pudding); //alerts chocolate

Doodle. It’s been a long time…

By | September 30th, 2011|

It’s been a long time since I’ve drawn on the train. This one might have soft colors. I may try to squeeze this into my next mural project and a personal project too. I think I’d love to see this on someone’s wall.

art illustration female face

Brew Install Postgresql on OS X Lion

By | September 4th, 2011|

The Problem

If you’re installing postgresql via homebrew on Lion you might be encountering errors like these:

psql: could not connect to server: Permission denied
	Is the server running locally and accepting
	connections on Unix domain socket "/var/pgsql_socket/.s.PGSQL.5432"?
createuser: could not connect to database postgres: could not connect to server: Permission denied
	Is the server running locally and accepting
	connections on Unix domain socket "/var/pgsql_socket/.s.PGSQL.5432"?

The Cause

Lion comes with a version of postgres already installed and uses those binaries by default. In general you can get around this by using the full path to the homebrew postgres binaries but there may be still issues with other programs.

The Solution

If a quick fix is all you’re looking for, run this:

curl http://nextmarvel.net/blog/downloads/fixBrewLionPostgres.sh | sh

Here’s the code the previous line runs. To sum up, it moves your OS X default postgres binaries into an archive folder and symlinks the homebrew versions in place of them.

BREW_POSTGRES_DIR=`brew info postgres | awk '{print $1"/bin"}' | grep "/postgresql/"`
LION_POSTGRES_DIR=`which postgres | xargs dirname`
LION_PSQL_DIR=`which psql | xargs dirname`

sudo mkdir -p $LION_POSTGRES_DIR/archive
sudo mkdir -p $LION_PSQL_DIR/archive

for i in `ls $BREW_POSTGRES_DIR`
	if [ -f $LION_POSTGRES_DIR/$i ] 
		sudo mv $LION_POSTGRES_DIR/$i $LION_POSTGRES_DIR/archive/$i
	if [ -f $LION_PSQL_DIR/$i ] 
		sudo mv $LION_PSQL_DIR/$i $LION_PSQL_DIR/archive/$i
		sudo ln -s $BREW_POSTGRES_DIR/$i $LION_PSQL_DIR/$i

If you enjoyed this post, follow me on Twitter

Compiling the MySQL2 gem on OS X with any version of MAMP

By | July 11th, 2011|

There are a number of solutions for compiling mysql with MAMP on OS X but there’s a simpler solution.

  1. Download and install MySQL (any version, I did 5.5.14 which is the latest as of this writing). Choose the “Mac OS X ver. 10.6 (x86, 64-bit), DMG Archive” option.
  2. From Terminal, run the following in your rails app’s directory:

    sudo gem install mysql2 --version=0.2.6 -- --with-mysql-dir=/usr/local/mysql
    GEMDIR=`dirname \`bundle show rails\``
    sudo install_name_tool -change libmysqlclient.18.dylib /usr/local/mysql/lib/libmysqlclient.18.dylib ${GEMDIR}/mysql2-0.2.6/lib/mysql2/mysql2.bundle
  3. In your database.yml file point to MAMP’s mysql.sock file:

    socket: /Applications/MAMP/tmp/mysql/mysql.sock

Mural 2 in the Works

By | June 4th, 2011|

We’re working on a temporary mural–who knows if people really dig it, it can be permanent ;)–for the advertising agency I work at, Euro RSCG NY, and this will be one of the many elements… about to go in and color it. I don’t think I’m at liberty to talk about it much but what I can say is that any illustrators that are looking to contribute to something that could possibly get some cool press, feel free to email me for details at edgar@nextmarvel.net

Stay Inspired!


Thought: Personification of Businesses via Branding

By | April 2nd, 2011|

Branding has a served a purpose in personifying businesses since the beginning of its existence since that is the reason why it is evident and present in our society. Today brands are faced with greater challenges and risks of putting their name out into the world with all the competition. Seemingly, it’s almost as though you can get a real presence in the public discourse or a really small amount right now with no in between. You’re either a great “somebody” or a “nobody knows your name”. Now there is this new evolved thick layer of skin to a brand that did not exist less than a decade ago. Social interaction. This has gone beyond the average branding of:

1. Graphics, photography and developed creative language

2. Some cool and talked about viral promotion ad on youtube

3. An “interactive” site making you experience the product

4. A stir within the public discourse as a result of some promo activity/event or daring act in the community

… and much more… Social interaction, as we know it, has become an ongoing relationship. We now “follow” each other. We need to “blog”, “tweet”, “like” and much more.

The intuitive evolution of a good brand is one that instinctively understands that this age is compelling businesses to interact with their audiences at a level never experienced or thought to be possible. The questions of today are more about how do we truly ensure to make this platform of communication effective at all, as well as measure results, who/when do we hire? intern or social media expert? how do we collect data, analyze, and use it for the future?

That, among a million other questions are in the scene. These questions are not at all impossible to answer. They are as possible as they can be upon research, information, like statistics, and heavy analytics.

There are fine differences in the brand communication model due to the channels of media that are available today via the web.

What’s the point of this post? To contribute and promote thought by giving branding a closer look in the modern world as this world of social marketing has effected it greatly.

Link Shortening on Twitter.com

By | February 22nd, 2011|

I love using the twitter web interface whenever i’m not at my primary computer but after getting used to the way Twitter for Mac handles link shortening I’m often frustrated with Twitter.com.

Twitter for Mac

The letter count of a tweet with a long link in Twitter for Mac displays what the character count will be after the link is shortened and allows me to post as is.

Twitter for Mac's Link Shortening


On Twitter.com, a tweet with a long link displays the current character count rather than taking into account that the link will be shortened. There is also no way to shorten a link with the default interface and I’m unable to post because the combination of my un-shortened link and the text in my tweet is over 140 characters.

Twitter.com's Link Shortening

The Solution

I wrote a quick bookmarklet that will parse a tweet in the twitter.com interface and open it in a share window with the shortened link. While this isn’t an ideal solution it’s much faster than going to bit.ly, shortening the link and going back to twitter.com to tweet it.

The Code

var r = /(http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?/;
var theurl = "";
var thetext = "";
$($(".twitter-anywhere-tweet-box-editor").val().split(" ")).each(function(i,v) {
	if(r.test(v)) {
		theurl = v;
	} else {
		thetext += v + " ";


The Bookmarklet

Twitter Shorten

One line Javascript browser detection

By | February 18th, 2011|

Browser Detection Sucks

There are a lot of good arguments for avoiding browser detection and they’re 100% correct in most cases. Anyone who’s ever seen the “Browser version does not meet minimum requirements” message while in a capable browser will agree that filtering based on user-agent should be stopped.

Browser Detection Rocks

That being said, minor or last-minute bug fixes often call for some quick javascript browser detection. There are quite a few well written, full featured libraries that accomplish this task well but when I need to check whether or not the user is in IE6 for something minor I’d rather not load an extra class.

Here are a few browser and operating system detection one liners that have served me well over the years.

var IE6 = false /*@cc_on || @_jscript_version < 5.7 @*/
var IE7 = (document.all && !window.opera && window.XMLHttpRequest && navigator.userAgent.toString().toLowerCase().indexOf('trident/4.0') == -1) ? true : false;
var IE8 = (navigator.userAgent.toString().toLowerCase().indexOf('trident/4.0') != -1);
var IE9 = navigator.userAgent.toString().toLowerCase().indexOf("trident/5")>-1;
var IE10 = navigator.userAgent.toString().toLowerCase().indexOf("trident/6")>-1;
var SAFARI = (navigator.userAgent.toString().toLowerCase().indexOf("safari") != -1) && (navigator.userAgent.toString().toLowerCase().indexOf("chrome") == -1);
var FIREFOX = (navigator.userAgent.toString().toLowerCase().indexOf("firefox") != -1);
var CHROME = (navigator.userAgent.toString().toLowerCase().indexOf("chrome") != -1);
var MOBILE_SAFARI = ((navigator.userAgent.toString().toLowerCase().indexOf("iphone")!=-1) || (navigator.userAgent.toString().toLowerCase().indexOf("ipod")!=-1) || (navigator.userAgent.toString().toLowerCase().indexOf("ipad")!=-1)) ? true : false;

var MAC = (navigator.userAgent.toString().toLowerCase().indexOf("mac")!=-1) ? true: false;
var WINDOWS = (navigator.appVersion.indexOf("Win")!=-1) ? true : false;
var LINUX = (navigator.appVersion.indexOf("Linux")!=-1) ? true : false;
var UNIX = (navigator.appVersion.indexOf("X11")!=-1) ? true : false;

One simple method for spending less time debugging HTML Emails

By | February 11th, 2011|

HTML Emails in certain mail clients commonly have display issues caused by line breaks, tabs or other whitespace between elements that should be ignored. Removing this whitespace is a common, but annoying, debugging strategy but it makes the code difficult to read or modify.

Simple Solution

Have PHP remove the whitespace for you before sending to the browser.

  1. Change the extension on the file from .html to .php
  2. Make sure you’re viewing the file through a web server (http:// not file://)
  3. Add this to the top of the file:
    			//buffer output
  4. Add this to the bottom of the file:
    		   //get everything we printed
    		   $html = str_replace(array("\t", "\n", "\r"), "", ob_get_contents());
    		   //end buffer and discard previous output
    		   //send to browser
    		   echo $html;
  5. View the page and either use either Save or View Source to grab the output.


This method doesn’t work without a web server. This isn’t a problem for me since I do all of my development under localhost but I understand that isn’t true for everyone.

The render step. Having to view the page and either Save or View Source + Copy/Paste is a small extra step. I haven’t found a situation where this minor drawback wasn’t worth it for all the debugging time saved but your mileage may vary.

8 methods for securing Flash

By | November 1st, 2010|

Most flash developers at one time or another have run into the requirement of transporting data between the client and the server unmolested. As simple as it sounds this is a surprisingly difficult hill to climb with no perfect solution. There are tons of methods for safely moving data, some much better than others. I’ve put together a list of 8 of the best here.


jQuery Form Helper

By | October 1st, 2010|

The jQuery Form Helper plugin is a lightweight wrapper for two convenience functions to speed up form development: Text Replacement in <input> fields and Ajax Scaffolding for <form> elements. At only 2.6k compressed, Form Helper is light enough to be included in any project.


Once you download Form Helper, include it in the <head> after jQuery:

	<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
	<script type="text/javascript" src="js/jquery.formHelper.js"></script>

Text Replacement

Adding default instructional text inside a text box is a common and convenient method of saving space in forms. Form Helper allows you to implement this quickly without requiring you to modify your markup. Run $(elem).textReplacement() on any text input with a default value:

		<script type="text/javascript">
			$(function() {
				//setup text replacement on all inputs
		<input type="text" value="The text to be replaced" />
		<input type="text" value="A second box with text replacement" />

Form Helper’s text replacement has a few other notable features.

  • An “active” class is added to any <input> that receives focus and is removed when focus is lost (on blur).
  • A “data entered” class is also added to <input>s on focus but is only removed on blur if the user hasn’t entered any data.
  • Default classes for the “active” and “data entered” states exist (active_formHelper and data_entered_formHelper respectively) but they can be changed by passing options to $(elem).textReplacement().
  • Password <input>s can also benefit from text replacement, which is great for small login forms. Their default value can be passed in with javascript or specified through the “alt” attribute (The “alt” attribute has precedence).
  • Changing the <input>’s type from “password” to “text” doesn’t work in all browsers (Internet Explorer). To remedy this, an <input type=”text” /> with the same class and style attributes is created and swapped in and out for each <input type=”password” />. The limitation of this technique is that any CSS applied to the original <input> by ID will not effect the replacement.
		<script type="text/javascript">
			$(function() {
				$("input[type=text], #pw_with_alt, #pw_no_alt").textReplacement({
					'activeClass': 'active', 	//custom active class
					'dataEnteredClass': 'data_entered', //custom data entered class
					'passwordText': 'PASSWORD' 	//default password text
			<!--/* 	standard text replacement w/ a custom active 
					class and a custom data entered class */-->
			<input type="text" value="The text to be replaced" />
			<input type="text" value="A second box with text replacement" />
			<!--/* Default Text: The Password */-->
			<input type="password" alt="The Password" id="pw_with_alt" /> 
			<!--/* Default Text: PASSWORD */-->
			<input type="password" id="pw_no_alt" />
			<!--/* No Default Text (no alt attribute or passwordText) */-->
			<input type="password" id="pw2_no_alt" />

Ajax Scaffolding

Submitting a <form> with ajax is made quick and easy by jQuery. Form Helper makes this a little bit quicker by setting a few things up automatically:

  1. An onSubmit handler for the form with $(elem).submit()
  2. Optionally calls a supplied validation function and only continues if it returns true
  3. Submits with jQuery.Ajax() and fills in data (with $(elem).serialize()), type (the <form>’s method attribute) and url (the <form>’s action attribute) automatically, allowing you to supply the other options. Any option accepted by jQuery.Ajax() is also accepted by $(elem).scaffoldAjax().
  4. Returns false to stop the form from submitting.
		<script type="text/javascript">
			$(function() {
					'validate': function() {
						//do validation
						return true;
					'success': function(data) {
						//handle response
		<form action="services/doStuff.php" method="POST">
			<input type="text" name="first_name" />
			<input type="text" name="last_name" />
			<input type="submit" />
Load More Posts


Greg Zorrilla
Paul Denya
Inoa Photo
Minx Inx
Love Lavache