Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > Allow user to add own item if not already in drop down list

Reply
Thread Tools

Allow user to add own item if not already in drop down list

 
 
Colin Steadman
Guest
Posts: n/a
 
      10-21-2003
Is it possible to modify a dropdown list (specificially the dropdown
list I've copied below) so that a user could manually type in a value
of their own choosing; if they didn't want to select one of the
options provided. For example 'Lord' or 'Lady'. I've been asked to
do this in a form I'm setting up, but I cant see how or even if it
could be done.

The obvious answer would be to list all possibilities in the first
place. But they have their reasons and I'd prefer to give them what
they want.

TIA,

Colin

<html>
<head>
<title>Drop Down Test</title>
</head>
<body>

<P>
<select name="title" size="1" style="width: 204" tabindex="1">
<option value="Title">Select Title</option>
<option value="Mr">Mr</option>
<option value="Miss">Miss</option>
<option value="Mrs">Mrs</option>
<option value="Ms">Ms</option>
<option value="Dr">Dr</option>
<option value="Sir">Sir</option>
<option value="Professor">Professor</option>
</select>
</P>

</body>
</html>


---------------------------------------------------------------
To email, replace the word google with anything else you fancy.
http://www.velocityreviews.com/forums/(E-Mail Removed)
 
Reply With Quote
 
 
 
 
Steve Pugh
Guest
Posts: n/a
 
      10-21-2003
(E-Mail Removed) (Colin Steadman) wrote:

>Is it possible to modify a dropdown list (specificially the dropdown
>list I've copied below) so that a user could manually type in a value
>of their own choosing; if they didn't want to select one of the
>options provided. For example 'Lord' or 'Lady'. I've been asked to
>do this in a form I'm setting up, but I cant see how or even if it
>could be done.


Sure, include an 'other' option and an additional text input.

The server side script handling the form submission then needs to be
tweaked to use either the entry from the select element or if that is
set to other to use whatever is in the text input.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <(E-Mail Removed)> <http://steve.pugh.net/>
 
Reply With Quote
 
 
 
 
Michael Wilcox
Guest
Posts: n/a
 
      10-21-2003
Steve Pugh <(E-Mail Removed)> wrote:
> Sure, include an 'other' option and an additional text input.


Or elminate the drop down list all together and allow them to choose thier
own title.
--
Michael Wilcox
mjwilco at yahoo dot com


 
Reply With Quote
 
Colin Steadman
Guest
Posts: n/a
 
      10-22-2003
>
> Sure, include an 'other' option and an additional text input.
>
> The server side script handling the form submission then needs to be
> tweaked to use either the entry from the select element or if that is
> set to other to use whatever is in the text input.



I'm not with you, could you give an example?

I've had a play but all I end up with is a text field outside the dropdown.

TIA,

Colin
 
Reply With Quote
 
Steve Pugh
Guest
Posts: n/a
 
      10-22-2003
(E-Mail Removed) (Colin Steadman) wrote:

>>
>> Sure, include an 'other' option and an additional text input.
>>
>> The server side script handling the form submission then needs to be
>> tweaked to use either the entry from the select element or if that is
>> set to other to use whatever is in the text input.

>
>
>I'm not with you, could you give an example?


<select name="title" size="1" style="width: 204" tabindex="1">
<option value="Title">Select Title</option>
<option value="Mr">Mr</option>
<option value="Miss">Miss</option>
<option value="Mrs">Mrs</option>
<option value="Ms">Ms</option>
<option value="Dr">Dr</option>
<option value="Sir">Sir</option>
<option value="Professor">Professor</option>
<option value="other">Other</option>
</select>
<input type="text" name="title-other">

Add styles, labels, etc. to suit.

>I've had a play but all I end up with is a text field outside the dropdown.


And? What's wrong with that?

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <(E-Mail Removed)> <http://steve.pugh.net/>
 
Reply With Quote
 
Michael Wilcox
Guest
Posts: n/a
 
      10-22-2003
Colin Steadman <(E-Mail Removed)> wrote:
> Is it possible to modify a dropdown list (specificially the dropdown
> list I've copied below) so that a user could manually type in a value
> of their own choosing; if they didn't want to select one of the
> options provided. For example 'Lord' or 'Lady'. I've been asked to
> do this in a form I'm setting up, but I cant see how or even if it
> could be done.


Why don't you have an input box where users can fill in their own title?
Wouldn't that be better than all this fuss?
--
Michael Wilcox
mjwilco at yahoo dot com


 
Reply With Quote
 
Colin Steadman
Guest
Posts: n/a
 
      10-27-2003
> >I've had a play but all I end up with is a text field outside the dropdown.
>
> And? What's wrong with that?
>
> Steve



Technically nothing, but its only going to be used every once in a
blue moon and it looks odd on the form (see html below).

I could add it under the title field and make it the same length but
that would give it equal status with the other form elements which it
blatantly shouldn't have.

Colin


<html>
<head>
<title></title>
<style>
table.box {
background-color: #DDDDDD;
}

td.heading {
font-size: 11;
font-family: Verdana, Verdana, Arial, Helvetica, sans-serif;
color: #606060;
}

td.text {
font-size: 11;
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #000000;
}
</style>
</head>
<body>

<table align="center" width="100%" valign="middle" height="80%"
cellspacing="0" cellpadding="0" border="0">
<tr>
<td>
<table align="center" valign="middle" cellspacing="20"
cellpadding="0" border="0" class="box">
<tr>
<td>
<table align="center" border="0" cellpadding="2"
cellspacing="0">
<tr>
<td class="text">Please enter the general details
about this person.</td>
</tr>
<tr>
<td colspan="2">&nbsp;</td>
</tr>
<tr>
<td class="text">Title</td>
<td class="text">&nbsp</td>
<td class="text">
<select name="title" size="1" style="width: 204"
tabindex="1">
<option value="Title">Select Title</option>
<option value="Mr">Mr</option>
<option value="Miss">Miss</option>
<option value="Mrs">Mrs</option>
<option value="Ms">Ms</option>
<option value="Dr">Dr</option>
<option value="Sir">Sir</option>
<option value="Professor">Professor</option>
<option value="Lord">Lord</option>
<option value="Other">Other</option>
</select>
&nbsp;
<input type="text" name="othertitle" size="10">
</td>
</tr>
<tr>
<td class="text">Forenames</td>
<td class="text">&nbsp</td>
<td class="text"><input type="text" name="forenames"
size="30" tabindex="2"></td>
</tr>
<tr>
<td class="text">Preferred Forename</td>
<td class="text">&nbsp</td>
<td class="text"><input type="text"
name="preferred_forename" size="30" tabindex="3"></td>
</tr>
<tr>
<td class="text">Surname</td>
<td class="text">&nbsp</td>
<td class="text"><input type="text" name="surname"
size="30" tabindex="4"></td>
</tr>
<tr>
<td class="text">National Insurance</td>
<td class="text">&nbsp</td>
<td class="text"><input type="text" name="ni" size="30"
tabindex="5"></td>
</tr>
<tr>
<td class="text">Job Title</td>
<td class="text">&nbsp</td>
<td class="text"><input type="text" name="jobtitle"
size="30" tabindex="6"></td>
</tr>
<tr>
<td class="text" colspan="3">&nbsp<input type="hidden"
name="origin" value="1"></td>
</tr>
<tr>
<td align="center" colspan="3"><input class="mini"
type="submit" style="width:48" name="gotopersonal" value="Next"
tabindex="7">&nbsp;<button class="input" type="button"
style="width:48" name="cancel" value="Cancel"
Onclick="window.location.href = 'results.asp';"
tabindex="8">Cancel</button></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
 
Reply With Quote
 
Steve Pugh
Guest
Posts: n/a
 
      10-27-2003
(E-Mail Removed) (Colin Steadman) wrote:

>> >I've had a play but all I end up with is a text field outside the dropdown.

>>
>> And? What's wrong with that?
>>

>Technically nothing, but its only going to be used every once in a
>blue moon and it looks odd on the form (see html below).


It only looks odd because you've forgotten to give it any sort of
label explaining what it is for. How are users to know whether they
should us it or not if you don't label it?

> <tr>
> <td class="text">Title</td>


This cell was 'empty' in every row of your table? Why bother including
it at all in that case? If it's for padding then use CSS.

> <td class="text">&nbsp</td>
> <td class="text">
> <select name="title" size="1" style="width: 204"


204 what? Lengths in CSS must always have a unit unless they are zero.

>tabindex="1">
> <option value="Title">Select Title</option>
> <option value="Mr">Mr</option>
> <option value="Miss">Miss</option>
> <option value="Mrs">Mrs</option>
> <option value="Ms">Ms</option>
> <option value="Dr">Dr</option>
> <option value="Sir">Sir</option>
> <option value="Professor">Professor</option>
> <option value="Lord">Lord</option>
> <option value="Other">Other</option>
> </select>
> &nbsp;
> <input type="text" name="othertitle" size="10">
> </td>
> </tr>



You can of course use Javascript to set/unset the disabled attribute
on that text field when the corresponding option is selected. Just
make sure that this defaults to making the field usble when JS is off.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <(E-Mail Removed)> <http://steve.pugh.net/>
 
Reply With Quote
 
Toby A Inkster
Guest
Posts: n/a
 
      10-27-2003
Colin Steadman wrote:
> <select name="title" size="1" style="width: 204" tabindex="1">
> <option value="Title">Select Title</option>
> <option value="Mr">Mr</option>
> <option value="Miss">Miss</option>
> <option value="Mrs">Mrs</option>
> <option value="Ms">Ms</option>
> <option value="Dr">Dr</option>
> <option value="Sir">Sir</option>
> <option value="Professor">Professor</option>
> <option value="Lord">Lord</option>
> <option value="Other">Other</option>
> </select>
> &nbsp;
> <input type="text" name="othertitle" size="10">


Interesting you have 'Lord', but not 'Rev'. I would have thought there
would be far more Reverands out there than Lords.

A drop down list is probably most appropriate for what you have, but for
some other similar situations, the following is a solution:

<label><input type="radio" name="title" value="Mr">&nbsp;Mr</label>
<label><input type="radio" name="title" value="Miss">&nbsp;Miss</label>
<label><input type="radio" name="title" value="Mrs">&nbsp;Mrs</label>
<label><input type="radio" name="title" value="Ms">&nbsp;Ms</label>
<label><input type="radio" name="title" value="Dr">&nbsp;Dr</label>
<label><input type="radio" name="title" value="Other">&nbsp;Other</label>
<label>(Please specify: <input type="text" name="othertitle">)</label>

with appropriate styling.

--
Toby A Inkster BSc (Hons) ARCS
Contact Me - http://www.goddamn.co.uk/tobyink/?id=132

 
Reply With Quote
 
Colin Steadman
Guest
Posts: n/a
 
      10-27-2003
> >> >I've had a play but all I end up with is a text field outside the dropdown.
> >>
> >> And? What's wrong with that?
> >>

> >Technically nothing, but its only going to be used every once in a
> >blue moon and it looks odd on the form (see html below).

>
> It only looks odd because you've forgotten to give it any sort of
> label explaining what it is for. How are users to know whether they
> should us it or not if you don't label it?



Your right, a label would help. But IMO the text box would still look
hap-hazard stuck on the side, even with a label in place to identify
its purpose.


>
> > <tr>
> > <td class="text">Title</td>

>
> This cell was 'empty' in every row of your table? Why bother including
> it at all in that case? If it's for padding then use CSS.



Good point. It was a quick and dirty fix because of my CSS
inexperience. After I've sent this post I'll research a correct CSS
solution.


>
> > <td class="text">&nbsp</td>
> > <td class="text">
> > <select name="title" size="1" style="width: 204"

>
> 204 what? Lengths in CSS must always have a unit unless they are zero.



I wasn't aware I had to specify. As mentioned above my CSS knowledge
is limited. I also use a text editor to write my HTML so I dont have
the benefit of a validator to pointpoint these types of errors. Trial
and error seems to miss this fine detail )

I think its obvious I could do with a good CSS reference guide, can
you suggest any?


>
> >tabindex="1">
> > <option value="Title">Select Title</option>
> > <option value="Mr">Mr</option>
> > <option value="Miss">Miss</option>
> > <option value="Mrs">Mrs</option>
> > <option value="Ms">Ms</option>
> > <option value="Dr">Dr</option>
> > <option value="Sir">Sir</option>
> > <option value="Professor">Professor</option>
> > <option value="Lord">Lord</option>
> > <option value="Other">Other</option>
> > </select>
> > &nbsp;
> > <input type="text" name="othertitle" size="10">
> > </td>
> > </tr>

>
>
> You can of course use Javascript to set/unset the disabled attribute
> on that text field when the corresponding option is selected. Just
> make sure that this defaults to making the field usble when JS is off.
>



I've decided to speak to the customer and suggest Michaels idea of
getting rid of the drop-down altogether, its obvious I cant do what I
originally wanted. If they insist then I'll come back to your
javascript idea as I quite like it, and to hell with the layout!

Thanks for your help.

Colin
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
retrive preselected value in second drop down list from the first drop down list weiwei ASP .Net 0 01-05-2007 07:29 PM
Auto Drop down a Drop Down List xxbmichae1@supergambler.com Javascript 5 11-23-2005 01:35 AM
possible to allow a user to type directly into a dropdown list to add new item? Dica ASP .Net 4 11-09-2005 02:43 PM
Web User Control Drop Down List does not show selected item stephg ASP .Net Building Controls 3 10-30-2005 01:00 PM
how to include country list in my own drop down list? Wong CS ASP .Net 0 01-30-2005 09:11 AM



Advertisments