Link to home
Start Free TrialLog in
Avatar of karlblackburn
karlblackburnFlag for United Kingdom of Great Britain and Northern Ireland

asked on

Retrieve Value from Radiobuttons within a Datalist

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
Avatar of raja_ind82
raja_ind82
Flag of India image

Avatar of karlblackburn

ASKER

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
ASKER CERTIFIED SOLUTION
Avatar of Akin Delu
Akin Delu
Flag of Nigeria image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
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"
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
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%>");
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.
put the javascript after the closing html tag.
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.
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
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.

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.
I have done this, no javascript calls from inside the datalist seem to work, but anything outside works fine.
hmmmmm, strange post the html code generate by the browser.
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
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.
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??
This solved the problem, it now fires aswell

            rdbEE.Attributes.Add("onClick", "javascript:checkOne('" & e.Item.ClientID & "_rdbEE');CallMe()")
wooo, nice its good you solved it, thanks for sharing

happy coding