How to have a value from DropDownList.selectedItem on the Client Side?

[Julius Fenata]

Dear all,

I have created client-side scripting to trigger event onChange from
code-behind, like this:

DropDownList1.Attributes["onChange"] = "GenerateArticleID()";

At the script on Windows Form, I added this function to have the value of
DropDownList1

<script language="JavaScript">
function GenerateArticleID()
{
javascript:alert(document.getElementById("<%= DropDownList1.ClientID
%>").innerText)
}
</script>

Instead of having only one result selected-value from this DropDownList, the
pop-up messages showing entire data that contained on this DropDownList, how
to have the selected value/item only on onChange event with this client-side
script?

Thx,
Julius F

[Martin Dechev]

Hi,

The problem is that innerText retrieves the text between the start and end
tags of the <select> element. I believe you need to get only the selected
item's value or text. See inline:

"Julius Fenata" <id****@gmx.net> wrote in message
news:es**************@TK2MSFTNGP11.phx.gbl...

Dear all,

I have created client-side scripting to trigger event onChange from
code-behind, like this:

DropDownList1.Attributes["onChange"] = "GenerateArticleID()";
DropDownList1.Attributes["onchange"] =
"javascript:GenerateArticleID(this.options(this.se lectedIndex));";

At the script on Windows Form, I added this function to have the value of
DropDownList1

<script language="JavaScript">
function GenerateArticleID()
{
javascript:alert(document.getElementById("<%= DropDownList1.ClientID
%>").innerText)
}
function GenerateArticleID(SelectedItem)
{
alert("Value: " + SelectedItem.value + "\nText: " + SelectedItem.text);
}
</script>

Instead of having only one result selected-value from this DropDownList, the pop-up messages showing entire data that contained on this DropDownList, how to have the selected value/item only on onChange event with this client-side script?

Thx,
Julius F

Hope this helps
Martin Dechev
ASP.NET MVP

[Eliyahu Goldin]

Julius,

A ddl translates to an html <select>. You should follows the DHTML object
model for <select>:

DropDownList1.Attributes["onChange"] = "GenerateArticleID(this)";

<script language="JavaScript">
function GenerateArticleID(ddl){
javascript:alert(ddl.options(ddl.selectedIndex).va lue)
}
</script>

Eliyahu

"Julius Fenata" <id****@gmx.net> wrote in message
news:es**************@TK2MSFTNGP11.phx.gbl...

Dear all,

I have created client-side scripting to trigger event onChange from
code-behind, like this:

DropDownList1.Attributes["onChange"] = "GenerateArticleID()";

At the script on Windows Form, I added this function to have the value of
DropDownList1

<script language="JavaScript">
function GenerateArticleID()
{
javascript:alert(document.getElementById("<%= DropDownList1.ClientID
%>").innerText)
}
</script>

Instead of having only one result selected-value from this DropDownList, the pop-up messages showing entire data that contained on this DropDownList, how to have the selected value/item only on onChange event with this client-side script?

Thx,
Julius F

[Julius Fenata]

Problem solved,

Thx a lot Martin, for your prompt response & it is a wonderfully help for
me...

Regards,
Julius Fenata
"Martin Dechev" <de*******@hotmail.com> wrote in message
news:eS**************@TK2MSFTNGP12.phx.gbl...

Hi,

The problem is that innerText retrieves the text between the start and end
tags of the <select> element. I believe you need to get only the selected
item's value or text. See inline:

"Julius Fenata" <id****@gmx.net> wrote in message
news:es**************@TK2MSFTNGP11.phx.gbl...

Dear all,

I have created client-side scripting to trigger event onChange from
code-behind, like this:

DropDownList1.Attributes["onChange"] = "GenerateArticleID()";

DropDownList1.Attributes["onchange"] =
"javascript:GenerateArticleID(this.options(this.se lectedIndex));";

At the script on Windows Form, I added this function to have the value of DropDownList1

<script language="JavaScript">
function GenerateArticleID()
{
javascript:alert(document.getElementById("<%= DropDownList1.ClientID %>").innerText)
}

function GenerateArticleID(SelectedItem)
{
alert("Value: " + SelectedItem.value + "\nText: " + SelectedItem.text);
}

</script>

Instead of having only one result selected-value from this DropDownList,

the

pop-up messages showing entire data that contained on this DropDownList,

how

to have the selected value/item only on onChange event with this

client-side

script?

Thx,
Julius F

Hope this helps
Martin Dechev
ASP.NET MVP

[Julius Fenata]

Dear Eliyahu & Martin,

Just recently notice that ASP .Net need some understanding about other
programming languange: DHTML Object Model.., but how do I can get
resources/tutorials about this scripting ability?

I have question from your code, what is ddl for? Is that a container
(variable) to accept passed parameter from (this)? If ddl is a variable why
there isn't available a data type whose define ddl variable?

The problem is solved temporarily, now I have value from DropDownList which
I selected. But requirements is now extend, because actually I have to
generate ID from many DropDownList.

The scenario is here, I have 3 DropDownList, whichever onChange event
triggered on any DropDownList, the GenerateArticleID() function on
client-side collect the values from every DropDownList and concate it into
one ID.

e.g:

DropDownList1 -> If selected, then take value selected from this
DropDownList (DropDownList1), collect value from DropDownList2&3, concate it
into one ID, and assign it into Label.text

This event is applied too to other DropDownList...

DropDownList2 -> If selected, then take value selected from this
DropDownList (DropDownList2), collect value from DropDownList1&3, concate it
into one ID, and assign it into Label.text

DropDownList3 -> If selected, same activity.

Now.., how can I collect the other DropDownList value (passive one), after
I've got value from selected DropDownList? Or, how ASP .Net recognize value
from each server control?

Thx a lot,
Julius F

"Eliyahu Goldin" <re*************@monarchmed.com> wrote in message
news:eW**************@tk2msftngp13.phx.gbl...

Julius,

A ddl translates to an html <select>. You should follows the DHTML object
model for <select>:

DropDownList1.Attributes["onChange"] = "GenerateArticleID(this)";

<script language="JavaScript">
function GenerateArticleID(ddl){
javascript:alert(ddl.options(ddl.selectedIndex).va lue)
}
</script>

Eliyahu

"Julius Fenata" <id****@gmx.net> wrote in message
news:es**************@TK2MSFTNGP11.phx.gbl...

Dear all,

I have created client-side scripting to trigger event onChange from
code-behind, like this:

DropDownList1.Attributes["onChange"] = "GenerateArticleID()";

At the script on Windows Form, I added this function to have the value of DropDownList1

<script language="JavaScript">
function GenerateArticleID()
{
javascript:alert(document.getElementById("<%= DropDownList1.ClientID %>").innerText)
}
</script>

Instead of having only one result selected-value from this DropDownList,

the

pop-up messages showing entire data that contained on this DropDownList,

how

to have the selected value/item only on onChange event with this

client-side

script?

Thx,
Julius F

[Eliyahu Goldin]

> Just recently notice that ASP .Net need some understanding about other

programming languange: DHTML Object Model.., but how do I can get
resources/tutorials about this scripting ability? MSDN Library was good enough for me. You should better ask for
recommendations in a separate thread.
I have question from your code, what is ddl for? Is that a container
(variable) to accept passed parameter from (this)? Yes, it is.
If ddl is a variable why
there isn't available a data type whose define ddl variable? Javascript is a language with no types.

For the rest of your message you can simply use element's id property. If on
server side you declare the ddls as
<asp:DropDownList runat="server" id ="ddl1">
<asp:DropDownList runat="server" id ="ddl2">
<asp:DropDownList runat="server" id ="ddl3">
then on client side you can find corresponding html elements with
getElementById("ddl1");
getElementById("ddl2");
getElementById("ddl3");

You don't really need to pass "this" as parameter since you are going to
access all 3 ddls anyway.

Eliyahu
The problem is solved temporarily, now I have value from DropDownList which I selected. But requirements is now extend, because actually I have to
generate ID from many DropDownList.

The scenario is here, I have 3 DropDownList, whichever onChange event
triggered on any DropDownList, the GenerateArticleID() function on
client-side collect the values from every DropDownList and concate it into
one ID.

e.g:

DropDownList1 -> If selected, then take value selected from this
DropDownList (DropDownList1), collect value from DropDownList2&3, concate it into one ID, and assign it into Label.text

This event is applied too to other DropDownList...

DropDownList2 -> If selected, then take value selected from this
DropDownList (DropDownList2), collect value from DropDownList1&3, concate it into one ID, and assign it into Label.text

DropDownList3 -> If selected, same activity.

Now.., how can I collect the other DropDownList value (passive one), after
I've got value from selected DropDownList? Or, how ASP .Net recognize value from each server control?

Thx a lot,
Julius F

"Eliyahu Goldin" <re*************@monarchmed.com> wrote in message
news:eW**************@tk2msftngp13.phx.gbl...

Julius,

A ddl translates to an html <select>. You should follows the DHTML object

model for <select>:

DropDownList1.Attributes["onChange"] = "GenerateArticleID(this)";

<script language="JavaScript">
function GenerateArticleID(ddl){
javascript:alert(ddl.options(ddl.selectedIndex).va lue)
}
</script>

Eliyahu

"Julius Fenata" <id****@gmx.net> wrote in message
news:es**************@TK2MSFTNGP11.phx.gbl...

Dear all,

I have created client-side scripting to trigger event onChange from
code-behind, like this:

DropDownList1.Attributes["onChange"] = "GenerateArticleID()";

At the script on Windows Form, I added this function to have the value of DropDownList1

<script language="JavaScript">
function GenerateArticleID()
{
javascript:alert(document.getElementById("<%= DropDownList1.ClientID %>").innerText)
}
</script>

Instead of having only one result selected-value from this

DropDownList, the

pop-up messages showing entire data that contained on this

DropDownList, how

to have the selected value/item only on onChange event with this

client-side

script?

Thx,
Julius F

[David Jessee]

One of the best books I have ever bought is the O'Reilly JavaScript book.
It will save your life.
"Julius Fenata" <id****@gmx.net> wrote in message
news:eg**************@TK2MSFTNGP11.phx.gbl...

Dear Eliyahu & Martin,

Just recently notice that ASP .Net need some understanding about other
programming languange: DHTML Object Model.., but how do I can get
resources/tutorials about this scripting ability?

I have question from your code, what is ddl for? Is that a container
(variable) to accept passed parameter from (this)? If ddl is a variable why there isn't available a data type whose define ddl variable?

The problem is solved temporarily, now I have value from DropDownList which I selected. But requirements is now extend, because actually I have to
generate ID from many DropDownList.

The scenario is here, I have 3 DropDownList, whichever onChange event
triggered on any DropDownList, the GenerateArticleID() function on
client-side collect the values from every DropDownList and concate it into
one ID.

e.g:

DropDownList1 -> If selected, then take value selected from this
DropDownList (DropDownList1), collect value from DropDownList2&3, concate it into one ID, and assign it into Label.text

This event is applied too to other DropDownList...

DropDownList2 -> If selected, then take value selected from this
DropDownList (DropDownList2), collect value from DropDownList1&3, concate it into one ID, and assign it into Label.text

DropDownList3 -> If selected, same activity.

Now.., how can I collect the other DropDownList value (passive one), after
I've got value from selected DropDownList? Or, how ASP .Net recognize value from each server control?

Thx a lot,
Julius F

"Eliyahu Goldin" <re*************@monarchmed.com> wrote in message
news:eW**************@tk2msftngp13.phx.gbl...

Julius,

A ddl translates to an html <select>. You should follows the DHTML object

model for <select>:

DropDownList1.Attributes["onChange"] = "GenerateArticleID(this)";

<script language="JavaScript">
function GenerateArticleID(ddl){
javascript:alert(ddl.options(ddl.selectedIndex).va lue)
}
</script>

Eliyahu

"Julius Fenata" <id****@gmx.net> wrote in message
news:es**************@TK2MSFTNGP11.phx.gbl...

Dear all,

I have created client-side scripting to trigger event onChange from
code-behind, like this:

DropDownList1.Attributes["onChange"] = "GenerateArticleID()";

At the script on Windows Form, I added this function to have the value of DropDownList1

<script language="JavaScript">
function GenerateArticleID()
{
javascript:alert(document.getElementById("<%= DropDownList1.ClientID %>").innerText)
}
</script>

Instead of having only one result selected-value from this

DropDownList, the

pop-up messages showing entire data that contained on this

DropDownList, how

to have the selected value/item only on onChange event with this

client-side

script?

Thx,
Julius F