Actually, based on Joe's suggestion, I just threw it together just now.
This is literally hacked together off the top of my head, and only tested
in IE 6... I can see some things I'd want to fix already, but that's what
you get from 5 minutes of hacking! Might make a good candidate for
inclusion in the UIWidgets taglib of Java Web Parts, but feel free to roll
a custom tag with it yourself (and contribute it back if you wish!),
otherwise I'll add it to my own to-do list...
<html>
<head>
<title>test</title>
<script>
function dropdown() {
obj = document.getElementById("ddspan");
if (obj.style.visibility == "visible") {
obj.style.visibility = "hidden";
} else {
obj.style.visibility = "visible";
}
}
function setVal(inVal) {
document.getElementById("tb").value = inVal;
dropdown();
}
function mOver(inObj) {
inObj.style.backgroundColor = "#ff0000";
}
function mOut(inObj) {
inObj.style.backgroundColor = "";
}
</script>
</head>
<body>
<input name="tb" type="text" size="20" readonly style="border:1 solid
#00000;font-size:12pt;height:28px;"><span onClick="dropdown();"
style="position:relative;top:-2;left:-1;font-size:12pt;height:28px;border:1
solid #000000;">∇</span>
<br>
<span id="ddSpan" style="width:168px;padding:4;border:1 solid
#000000;visibility:hidden;position:relative;top:-3;">
<table border="0" cellpadding="0" cellspacing="0"
style="font-size:12pt;">
<tr onClick="setVal('Lightning');" onMouseOver="mOver(this);"
onMouseOut="mOut(this);">
<td><img src="http://www.omnytex.com/images/si_resume_0.gif";></td>
<td width="100%"> Lightning</td>
</tr>
<tr onClick="setVal('House');" onMouseOver="mOver(this);"
onMouseOut="mOut(this);">
<td><img src="http://www.omnytex.com/images/si_home_0.gif";></td>
<td> House</td>
</tr>
<tr onClick="setVal('Envelope');" onMouseOver="mOver(this);"
onMouseOut="mOut(this);">
<td><img src="http://www.omnytex.com/images/si_contact_0.gif";></td>
<td> Envelope</td>
</tr>
</table>
</span>
</body>
</html>
--
Frank W. Zammetti
Founder and Chief Software Architect
Omnytex Technologies
http://www.omnytex.com
AIM: fzammetti
Yahoo: fzammetti
MSN: [EMAIL PROTECTED]
On Wed, October 19, 2005 4:30 pm, Faisal Mahmoud said:
> Okay, somewhere in my head I can remember seeing an example of this,
> but I can't recall where it was. Sounds like the solution (if one
> exists) is non-trivial. Appreciate the ideas and if I do come across
> or develop some sort of solution I will post back to this thread.
>
> On 10/19/05, Frank W. Zammetti <[EMAIL PROTECTED]> wrote:
>> I was thinking you could build an actual "custom control" to do this,
>> and
>> that's a good start... add a down arrow to the right of it to show the
>> dropdown portion and lock the textbox from editing and you'd have a good
>> start.
>>
>> Thanks Joe!
>>
>> --
>> Frank W. Zammetti
>> Founder and Chief Software Architect
>> Omnytex Technologies
>> http://www.omnytex.com
>> AIM: fzammetti
>> Yahoo: fzammetti
>> MSN: [EMAIL PROTECTED]
>>
>> On Wed, October 19, 2005 3:51 pm, Joe Germuska said:
>> > At 3:11 PM -0400 10/19/05, Frank W. Zammetti wrote:
>> >>This isn's something that is possible in straight HTML. There could
>> be a
>> >>way to do it via CSS, but nothing obvious presents itself to me... I
>> >> tried
>> >>setting a background-image, but that didn't work.
>> >>
>> >>Can you find an example of it being done? Unless there's some
>> >> non-obvious
>> >>CSS trick, or perhaps some non-standard browser extension, I'd bet
>> this
>> >>isn't possible.
>> >
>> > Here's an example of something a user might not distinguish from what
>> > is described, although it wouldn't be using <select>
>> >
>> > http://script.aculo.us/demos/ajax/autocompleter_customized
>> >
>> > By using DHTML like this and having an event cause a hidden form
>> > field value to be set, you could achieve the goal.
>> >
>> > Note that Scriptaculous builds upon the Prototype library, which
>> > breaks commons-validator client side javascript validation.
>> >
>> > Joe
>> >
>> > --
>> > Joe Germuska
>> > [EMAIL PROTECTED]
>> > http://blog.germuska.com
>> > "Narrow minds are weapons made for mass destruction" -The Ex
>> >
>>
>>
>> ---------------------------------------------------------------------
>> To unsubscribe, e-mail: [EMAIL PROTECTED]
>> For additional commands, e-mail: [EMAIL PROTECTED]
>>
>>
>
>
> --
> http://www.quidprocode.com
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: [EMAIL PROTECTED]
> For additional commands, e-mail: [EMAIL PROTECTED]
>
>
---------------------------------------------------------------------
To unsubscribe, e-mail: [EMAIL PROTECTED]
For additional commands, e-mail: [EMAIL PROTECTED]
![http://www.omnytex.com/images/si_resume_0.gif"](http://www.omnytex.com/images/si_resume_0.gif"){kind=link}
![http://www.omnytex.com/images/si_home_0.gif"](http://www.omnytex.com/images/si_home_0.gif"){kind=link}
![http://www.omnytex.com/images/si_contact_0.gif"](http://www.omnytex.com/images/si_contact_0.gif"){kind=link}