javascript function to return selected item value from drop-down

[pardesiya]

Friends,

I need to write a javascript function (which will be called on
clicking a button) to return the currently selected item from a drop-
down list whose rendered html is below.

<select name="ddlQuery"
onchange="javas cript:setTimeou t('__doPostBack (\'ddlQuery\',\ '\')', 0)"
id="ddlQuery" style="width:27 3px;">
<option value="Munich"> Munich</option>
<option selected="selec ted" value="London"> London</option>
<option value="Paris">P aris</option>
<option value="Tokyo">T okyo</option>
</select>

So in the above case, the javascript should return the string 'London'
which is the selected item.

Can you please advice?

Thanks,
PD

[VK]

Re: javascript function to return selected item value from drop-down

On May 21, 2:19 pm, pardesiya <zenst...@gmail .comwrote:

Friends,
>
I need to write a javascript function (which will be called on
clicking a button) to return the currently selected item from a drop-
down list whose rendered html is below.
>
<select name="ddlQuery"
onchange="javas cript:setTimeou t('__doPostBack (\'ddlQuery\',\ '\')', 0)"
id="ddlQuery" style="width:27 3px;">
<option value="Munich"> Munich</option>
<option selected="selec ted" value="London"> London</option>
<option value="Paris">P aris</option>
<option value="Tokyo">T okyo</option>
</select>
>
So in the above case, the javascript should return the string 'London'
which is the selected item.

<script type="text/javascript">
function __doPostBack(el m) {
var val = elm.options[elm.selectedInd ex].value;
window.alert(va l);
}
</script>


<select name="ddlQuery" id="ddlQuery" onchange="__doP ostBack(this)">
<option value="Munich"> Munich</option>
<option selected="selec ted" value="London"> London</option>
<option value="Paris">P aris</option>
<option value="Tokyo">T okyo</option>
</select>

P.S. The intrinsic onchange handler gets a reference to Javascript
function, it has nothing to do with a link to javascript: pseudo-
protocol, thus onchange="javas cript:something ()" is a non-sense.

[pardesiya]

Re: javascript function to return selected item value from drop-down

Thanks a lot VK. Sorry I wasnt very clear. We can ignore
onchange="javas cript:....". If it's of any interest, that's just the
generated html from my asp.net aspx page. What I needed was the
required function to be called on click of a button.

Your solution has pointed me to the right direction and I am able to
achieve this as below:

<script type="text/javascript">
function fShowCity(elm)
{
var val = elm.options[elm.selectedInd ex].value;
window.alert(va l);
}
</script>

<select name="ddlQuery" id="ddlQuery" style="width:27 3px;">
<option value="Munich"> Munich</option>
<option selected="selec ted" value="London"> London</option>
<option value="Paris">P aris</option>
<option value="Tokyo">T okyo</option>
</select>

<input type="submit" name="cmdShow" value="Customiz e Fields"
onclick="fShowC ity(ddlQuery);" id="cmdShow" />

[Evertjan.]

Re: javascript function to return selected item value from drop-down

pardesiya wrote on 21 mei 2007 in comp.lang.javas cript:

Thanks a lot VK. Sorry I wasnt very clear.

You are not very clear now, as you do not quote!!!!!!!!!!
This is usenet, not email.

We can ignore
onchange="javas cript:....". If it's of any interest, that's just the
generated html from my asp.net aspx page. What I needed was the
required function to be called on click of a button.
>
Your solution has pointed me to the right direction and I am able to
achieve this as below:
>
<script type="text/javascript">
function fShowCity(elm)

elm is a local variable containing the litteral string 'ddlQuery',
and only under IE this is convered to an object pointer to your select.

to make it cross browser compatible write:

function fShowCity(elm2) {
var elm = document.getEle mentById('elm2' );
alert(elm.optio ns[elm.selectedInd ex].value);
};

{
var val = elm.options[elm.selectedInd ex].value;
window.alert(va l);
}
</script>
>
<select name="ddlQuery" id="ddlQuery" style="width:27 3px;">
<option value="Munich"> Munich</option>
<option selected="selec ted" value="London"> London</option>
<option value="Paris">P aris</option>
<option value="Tokyo">T okyo</option>
</select>
>
<input type="submit" name="cmdShow" value="Customiz e Fields"
onclick="fShowC ity(ddlQuery);" id="cmdShow" />

ddlQuery is not a variable name but a string so it should be quoted.

onclick="fShowC ity('ddlQuery') ;"


--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[VK]

Re: javascript function to return selected item value from drop-down

On May 21, 2:58 pm, pardesiya <zenst...@gmail .comwrote:

<input type="submit" name="cmdShow" value="Customiz e Fields"
onclick="fShowC ity(ddlQuery);" id="cmdShow" />

This way of calling function relies on IE-proprietary extension with
ID'ed element automatically reflected as global JScript variables:

http://www.jibbering.com/faq/index.html#FAQ4_41

While Gecko browsers in quirk mode do support this feature now as
well, you should not rely on it on a wide run. Use the fully universal
DOM 0 methods - the best - instead or the conventional DOM 1 methods:

<input type="button" name="cmdShow" value="Customiz e Fields"
onclick="fShowC ity(this.form.e lements['ddlQuery']);" id="cmdShow" />

or

<input type="button" name="cmdShow" value="Customiz e Fields"
onclick="fShowC ity(document.ge tElementById('d dlQuery'));"
id="cmdShow" />

[scripts.contact]

Re: javascript function to return selected item value from drop-down

On May 21, 5:26 am, "Evertjan." <exjxw.hannivo. ..@interxnl.net wrote:

to make it cross browser compatible write:
>
function fShowCity(elm2) {
var elm = document.getEle mentById('elm2' );
alert(elm.optio ns[elm.selectedInd ex].value);
>
};

function fShowCity(elm2) {
var elm = document.getEle mentById(elm2);
alert(elm.optio ns[elm.selectedInd ex].value);

};

[Evertjan.]

Re: javascript function to return selected item value from drop-down

scripts.contact wrote on 21 mei 2007 in comp.lang.javas cript:

On May 21, 5:26 am, "Evertjan." <exjxw.hannivo. ..@interxnl.net wrote:

>to make it cross browser compatible write:
>>
>function fShowCity(elm2) {
> var elm = document.getEle mentById('elm2' );
> alert(elm.optio ns[elm.selectedInd ex].value);
>>
>};

>
function fShowCity(elm2) {
var elm = document.getEle mentById(elm2);
alert(elm.optio ns[elm.selectedInd ex].value);
>
>};

Yes!


--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[pardesiya]

Re: javascript function to return selected item value from drop-down

On May 21, 5:26 am, "Evertjan." <exjxw.hannivo. ..@interxnl.net >
wrote:

You are not very clear now, as you do not quote!!!!!!!!!!
This is usenet, not email.

Apologies again. I am a newbie in usenet. Will henceforth quote.

to make it cross browser compatible write:
>
function fShowCity(elm2) {
var elm = document.getEle mentById(elm2);
alert(elm.optio ns[elm.selectedInd ex].value);
};

Thanks for the cross browser compatible tip.


On May 21, 8:27 am, VK <schools_r...@y ahoo.comwrote:

This way of calling function relies on IE-proprietary extension with
ID'ed element automatically reflected as global JScript variables:http://www.jibbering.com/faq/index.html#FAQ4_41
>
While Gecko browsers in quirk mode do support this feature now as
well, you should not rely on it on a wide run. Use the fully universal
DOM 0 methods - the best - instead or the conventional DOM 1 methods:
>
<input type="button" name="cmdShow" value="Customiz e Fields"
onclick="fShowC ity(this.form.e lements['ddlQuery']);" id="cmdShow" />
>
or
>
<input type="button" name="cmdShow" value="Customiz e Fields"
onclick="fShowC ity(document.ge tElementById('d dlQuery'));"

Thanks VK.