Reverse Inline Editing

I want to throw this out there as I’m wondering if anyone is interested in a different approach to making HTML elements editable… I recently wrote some code that does the reverse of what my existing inlineEdit plugin does. i.e. it starts of as a form input element and turns into a placeholder on load. […]

HTML5 Placeholders

HTML5 adds a new attribute to most form elements called a placeholder. Its purpose is to add a short hint inside data entry points that disappear on focus. This type of interaction isn’t new but is new to HTML as of version 5. For this reason not all browsers have implemented this feature. Try it […]

Tip: getting values from an options list

So, if you’ve ever converted an options list into a single array of values you might have intuitively done this: var select = $(‘#mySelectElement’)[0]; var values = new Array(); for (var i=0; i < select.length; i++) { values.push(select.options[i].value); } Pretty boring aye? There is a snazzier (is that a word?) alternative, which is to use […]

Labs: UI inlineEdit

After my last tutorial on building a simple inlineEdit plugin I converted the concepts into a UI widget. It’s now sitting in labs for you to use, pick apart and devour: http://jquery-ui.googlecode.com/svn/branches/labs/inlineedit/demo.html If you inspect the source code you will notice the structure is quite different. It’s actually pretty much the same functionality wise but […]

jQuery Inline Edit tutorial

Spanish translation by Maria Ramos. A friend recently asked me to review his edit-in-place code which turned out to be a modification of the one found at http://docs.jquery.com/Tutorials:Edit_in_Place_with_Ajax. Reading the tutorial on that page I asked myself how I would do this differently? Defining a global setClickable() function and then calling $(‘#editInPlace”).click() is totally uncool, […]