I have a div and I want to show it when the user selects a specific radio button. Also, I need to hide the div when the user selects another radio button.
I tried this;
$("#RdbToday").click(function () {
$("#dateSelectorSpan").hide();
});
$("#RdbDateRange").click(function () {
$("#dateSelectorSpan").show();
});
For some reasons the .click
is not working. I tried to make alert
inside each function but the alert didn't fired.
I also tried to user .change
but the same results.
Edit
I already included the jquery library and I have alot of jquery functions working.
here the all code:
$(document).ready(function () {
//LoadCallsPerCampign();
//showTotalCallsStatuses();
//showInboundCalls();
//LoadServiceLevel();
$("#RdbToday").change(function () {
$("#dateSelectorSpan").hide();
});
$("#RdbDateRange").change(function () {
$("#dateSelectorSpan").show();
});
})
edit 2
this is the html
<asp:RadioButton runat="server" ID="RdbToday" Text="Today" Font-Names="Calibri" GroupName="foo"/>
<asp:RadioButton runat="server" ID="RdbDateRange" Text="Date Range:" Font-Names="Calibri" GroupName="foo"/>
<span id="dateSelectorSpan">
<input type="text" id="CldrFrom" runat="server" clientidmode="Static" placeholder="From" style="width:15%" />
<input type="text" id="CldrTo" runat="server" clientidmode="Static" placeholder="To" style="width:15%"/>
</span>
edit 3
for who needs the actual html. this is it
<span style="font-family:Calibri;"><input id="RdbToday" type="radio" name="foo" value="RdbToday"><label for="RdbToday">Today</label></span>
<span style="font-family:Calibri;"><input id="RdbDateRange" type="radio" name="foo" value="RdbDateRange"><label for="RdbDateRange">Date Range:</label></span>
<span id="dateSelectorSpan">
<input name="CldrFrom" type="text" id="CldrFrom" placeholder="From" style="width:15%">
<input name="CldrTo" type="text" id="CldrTo" placeholder="To" style="width:15%">
</span>