Hey all. I'm working on what I hope is a pretty nifty new feature for Bugzilla that will make it easier for developers to organize their bug lists and work productively. I'm not ready to demo this quite yet, so instead I submit a lazyweb request and hopefully someone can help move this along:
I'm looking for a fancy DHTML/Web2.0/Interweb++ widget for text editing. Basically, I need text to appear as normal unadorned plain text, but when you double click it, it becomes editable. Focusing something else makes the text turn back to plain text again. I can kind of fake this myself by hiding and showing a form widget, but that's exceedingly ugly unless styled perfectly in a cross-browser way and I know that someone must have done this before. Note that I do not need rich text support, just plain text. If you've seen such a widget, a comment with a link would be much appreciated.
Bonus points if it works in IE, but Firefox-only would be ok for now.
I'll let you all know when I've got something ready to try out.
Posted by zach at November 8, 2006 8:50 AMFlickr uses one those thingums to edit the title and description for your photos. You could start by having a look at how they do it.
Posted by: Jan! on November 8, 2006 9:57 AMWhat about always using a "disabled" textarea and then just trigger that attribute on double-click? A simple CSS rule could then take care of styling the textarea as all the other text when it's disabled.
Posted by: Simon on November 8, 2006 10:19 AMSee:
http://www.quirksmode.org/dom/cms.html
I think this is approximately what you are looking for, not?
Scriptaculous (the JS framework built on prototype) includes a "Edit In Place" control that I've used before. It includes the "click to edit" functionality and makes an ajax call automatically when you hit the ok button... See http://wiki.script.aculo.us/scriptaculous/show/Ajax.InPlaceEditor for docs and a couple of demos... Scriptaculous is pretty cross browser usually (IE/FF/Safari at least), but I don't know for sure about this control...
Posted by: metapundit on November 8, 2006 11:31 AMI'd like to point you at JSQuery, but their website is down. In the meantime, here's the SourceForge page for it:
http://sourceforge.net/projects/jsquery/
I've yet to actually use JSQuery, but it seems like a very nice way to do all sorts of "AJAX stuff." I'd say that Martijn's link is probably equally good, though. :)
Posted by: John Silvestri on November 8, 2006 11:37 AMI would second using jQuery.
Not only is it really really light, you can build your own small extensions to it or use someone elses.
I would suggest using
http://www.appelsiini.net/~tuupola/javascript/jEditable/
A basic example being:
http://www.appelsiini.net/~tuupola/jquery/jeditable/01_basic_usage.php
Another jQuery implementation here:
http://www.dyve.net/jquery/?editable