Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

Retrieve Value from Radiobuttons within a Datalist

Posted on 2010-08-26
19
Medium Priority
?
574 Views
Last Modified: 2012-08-13
Hi,

The usual problem here would be how to select just one radiobutton in a datalist, this I have solved with Javascript and a bit of code, but my problem is how to change a label or show a panel after a radiobutton is selected rather than postback, a good example can be found here - http://carteblanchegreetings.com/shop/me-to-you/tatty-teddy-blue-plush-pencil-case.html - in there gift wrapping bit.

Any help would be appreciatted.

Kind Regards
Karl
0
Comment
Question by:karlblackburn
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 9
  • 9
19 Comments
 

Author Comment

by:karlblackburn
ID: 33529464
The below posts are good in some ways, but is there anyway to do it without a postback or button i.e. it detects the radiobutton and updates the labels, shows the panel
0
 
LVL 5

Accepted Solution

by:
Akin Delu earned 2000 total points
ID: 33529471
inside your radiobutton tag add the javascript onclick event to it
the call this simple javascript function

function CallMe()
{
     x = document.getElementById("<%= PanelID.ClientID%>");
     x.style.display="";
     x = document.getElementById("<%= LabelID.ClientID%>");
     x.innerHTML="New Content Goes Here";
}
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 5

Expert Comment

by:Akin Delu
ID: 33529482
addition to my previous post.
Your panel tag should have the style="display:none" in it
note don't set it the Visible = "false" leave it as "true"
0
 

Author Comment

by:karlblackburn
ID: 33529563
Hi,

This looks great, excuse my naiveness

function CallMe()
{
     x = document.getElementById("<%= PanelID.ClientID%>"); - Do I have to edit the <% %> to my names or is this being called dynamically

     x.style.display="";
     x = document.getElementById("<%= LabelID.ClientID%>");
     x.innerHTML="New Content Goes Here";
}

and would you have an example of a onClick Command to fire this?

Many Thanks
0
 
LVL 5

Expert Comment

by:Akin Delu
ID: 33529606
x = document.getElementById("<%= PanelID.ClientID%>");
PanelID -- should be the id of your asp panel control, if for instance the panel id is panel1 the code will look like this
x = document.getElementById("<%= panel1.ClientID%>");
0
 

Author Comment

by:karlblackburn
ID: 33529670
Cheers, the code I have implemented is below

function CallMe()
{
    x = document.getElementById("<%= PanelTest.ClientID%>");
     x.style.display="";
     x = document.getElementById("<%= Label1.ClientID%>");
     x.innerHTML = "New Content Goes Here";
}
</script>
_________________________________________________

<asp:Panel ID="PanelTest" runat="server" BackColor="Black" Font-Underline="True" Width="100%" Height="200px" CssClass="panelhide"></asp:Panel>
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
_________________________________________________

<asp:RadioButton ID="rdbEE" Runat="server" Text="" GroupName="EE" onClick="CallMe"></asp:RadioButton>
_________________________________________________

with css to hide the DIV in the ouset, it isnt doing anything currently, but I think this is due to the onClick Event... Any ideas?

Apologies for being slightly thick on this one.
0
 
LVL 5

Expert Comment

by:Akin Delu
ID: 33529749
put the javascript after the closing html tag.
0
 

Author Comment

by:karlblackburn
ID: 33530007
To do this I have to put it in the master pafe and this errors with

BC30451: 'PanelTest' is not declared. It may be inaccessible due to its protection level.
0
 
LVL 5

Expert Comment

by:Akin Delu
ID: 33530225
no no no, put it inside the page where the control is create.
i never knew you when using a Master Page.
I guess you are making use of Web User Control
0
 

Author Comment

by:karlblackburn
ID: 33530808
I have done a test using Javascript Alert, it seems because the radiobutton is inside a datalist the onClick Event won't fire. If I put it outside it fires fine.

0
 
LVL 5

Expert Comment

by:Akin Delu
ID: 33531465
try put parenthesis "()" in the method call

<asp:RadioButton ID="rdbEE" Runat="server" Text="" GroupName="EE" onclick="CallMe()"></asp:RadioButton>
that could be the problem.
0
 

Author Comment

by:karlblackburn
ID: 33540571
I have done this, no javascript calls from inside the datalist seem to work, but anything outside works fine.
0
 
LVL 5

Expert Comment

by:Akin Delu
ID: 33541154
hmmmmm, strange post the html code generate by the browser.
0
 

Author Comment

by:karlblackburn
ID: 33541701
I shall just clean it up, but the radiobutton html looks like this - <input id="ctl00_MainContent_DataList10_ctl01_rdbEE" type="radio" name="ctl00$MainContent$DataList10$ctl01$EE" value="rdbEE" onclick="javascript:checkOne(&#39;ctl00_MainContent_DataList10_ctl01_rdbEE&#39;);" /> - with the onClick very different
0
 
LVL 5

Expert Comment

by:Akin Delu
ID: 33542327
from this, it seems you were trying to pass the radiobutton as a parameter to the function "checkOne",
hope your code is like this

<asp:RadioButton ID="rdbEE" Runat="server" Text="" GroupName="EE" onclick="javascript:checkOne(this)"></asp:RadioButton>
if not change it to that, then try again.
0
 

Author Comment

by:karlblackburn
ID: 33542798
I think I have made progress as such, when i get ' out the line below

        If e.Item.ItemType = ListItemType.AlternatingItem OrElse e.Item.ItemType = ListItemType.Item Then
            Dim rdbEE As RadioButton
            rdbEE = CType(e.Item.FindControl("rdbEE"), RadioButton)

            'rdbEE.Attributes.Add("onClick", "javascript:checkOne('" & e.Item.ClientID & "_rdbEE')")

        End If

in the javascript code and add onClick="CallMe()" to the Radio Button it fires the javascript, BUT then it allows you to click all the radiobuttons??
0
 

Author Comment

by:karlblackburn
ID: 33542835
This solved the problem, it now fires aswell

            rdbEE.Attributes.Add("onClick", "javascript:checkOne('" & e.Item.ClientID & "_rdbEE');CallMe()")
0
 
LVL 5

Expert Comment

by:Akin Delu
ID: 33542874
wooo, nice its good you solved it, thanks for sharing

happy coding
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

The ECB site provides FX rates for major currencies since its inception in 1999 in the form of an XML feed. The files have the following format (reducted for brevity) (CODE) There are three files available HERE (http://www.ecb.europa.eu/stats/exch…
The article shows the basic steps of integrating an HTML theme template into an ASP.NET MVC project
Video by: ITPro.TV
In this episode Don builds upon the troubleshooting techniques by demonstrating how to properly monitor a vSphere deployment to detect problems before they occur. He begins the show using tools found within the vSphere suite as ends the show demonst…
Want to learn how to record your desktop screen without having to use an outside camera. Click on this video and learn how to use the cool google extension called "Screencastify"! Step 1: Open a new google tab Step 2: Go to the left hand upper corn…

705 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question