Hey folks,
I've been reading about this plugin this morning and got inspired to
play around with the basic functionality a <select> based (unobtrusive)
plugin like this would need to have. I figured that in order to allow a
maximum of flexibility from the design point, this plugin would need to
be capable to transform any given <select> element (and it's children)
to almost any other given Html markup. Not too long ago I've written a
tabs plugin for a client (no OS right now : /) and needed some flexible
markup transformation for styling as well. The solution I came up with
was to provide html templates with placeholders in them like you often
do with strings in PHP that are going to be populated using sprinft. Now
JS doesn't have this functionality but I was able to bypass this using a
little regex. The basic concept looks like this:
------------------------------------------------------------------------------------------
var myTemplate = '<li><strong>My value:</strong> %s</li>'
var myValue = 'This is a test';
var myElement = $(myTemplate.replace(/([^\\])%s/,
"\$1"+myValue)).appendTo('#body');
------------------------------------------------------------------------------------------
This would replace the %s placeholder in the myTemplate string with the
contents of myValue and then turn it into a DOM element using the mighty
power of jQuery in order to attach it to an element with the id body
later on. I think this is a technique that many plugins that need to
transform html could benefit from. Now I don't have time to write an
entire select plugin right now, but I've completed the basic
transformation algorithm such a plugin would need. You can see a demo of
it right here:
http://demos.thinkingphp.org/jselect/
I'd love to hear some feedback from the JS gurus in here what they think
about this and if somebody feels like turning this into a complete
plugin - feel free to do so ; ).
-- Felix Geisendörfer aka the_undefined
--------------------------
http://www.thinkingphp.org
http://www.fg-webdesign.de
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
