Solved

Retrieve Value from Radiobuttons within a Datalist

Posted on 2010-08-26
19
550 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
  • 9
  • 9
19 Comments
 
LVL 14

Expert Comment

by:raja_ind82
ID: 33529413
0
 

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 500 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
Gigs: Get Your Project Delivered by an Expert

Select from freelancers specializing in everything from database administration to programming, who have proven themselves as experts in their field. Hire the best, collaborate easily, pay securely and get projects done right.

 
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

Gigs: Get Your Project Delivered by an Expert

Select from freelancers specializing in everything from database administration to programming, who have proven themselves as experts in their field. Hire the best, collaborate easily, pay securely and get projects done right.

Question has a verified solution.

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

Parsing a CSV file is a task that we are confronted with regularly, and although there are a vast number of means to do this, as a newbie, the field can be confusing and the tools can seem complex. A simple solution to parsing a customized CSV fi…
Deploying a Microsoft Access application in a Citrix environment is not difficult but takes a few steps. However, Citrix system people are often of little help, as they typically know next to nothing about Access. The script provided here will take …
Microsoft Active Directory, the widely used IT infrastructure, is known for its high risk of credential theft. The best way to test your Active Directory’s vulnerabilities to pass-the-ticket, pass-the-hash, privilege escalation, and malware attacks …
Established in 1997, Technology Architects has become one of the most reputable technology solutions companies in the country. TA have been providing businesses with cost effective state-of-the-art solutions and unparalleled service that is designed…

816 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

Need Help in Real-Time?

Connect with top rated Experts

9 Experts available now in Live!

Get 1:1 Help Now