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

J

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
 
M

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 said:
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.selectedIndex));";
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
 
J

Julius Fenata

Problem solved,

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

Regards,
Julius Fenata


Martin Dechev said:
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 said:
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.selectedIndex));";
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
 
E

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).value)
}
</script>

Eliyahu
 
J

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 said:
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).value)
}
</script>

Eliyahu

Julius Fenata said:
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
 
E

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 said:
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).value)
}
</script>

Eliyahu

Julius Fenata said:
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
 
D

David Jessee

One of the best books I have ever bought is the O'Reilly JavaScript book.
It will save your life.


Julius Fenata said:
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 said:
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).value)
}
</script>

Eliyahu

Julius Fenata said:
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
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,731
Messages
2,569,432
Members
44,836
Latest member
BuyBlissBitesCBD

Latest Threads

Top