So far this is what i have tried and cant get it to work. I had formatted slightly different earlier and the code worked but would only hide/show the the dropdownlist I wanted when i made another selection on my form. I am looking for a way to write this code so that dropdownlist is made visible or non visible as soon as the checkbox changes from false to true and vice versa
<asp:DropDownList ID="ddlcars" runat="server" AutoPostBack="True" Visible="False">
<asp:ListItem>Please select a model</asp:ListItem>
<asp:ListItem Value="18295">Impreza</asp:ListItem>
<asp:ListItem Value="26595">WRX</asp:ListItem>
<asp:ListItem Value="21595">Crosstrek</asp:ListItem>
</asp:DropDownList>
<asp:DropDownList ID="ddlpromocars" runat="server" AutoPostBack="True" Visible="False">
<asp:ListItem>Please select a model</asp:ListItem>
<asp:ListItem Value="25395">BRZ</asp:ListItem>
<asp:ListItem Value="24995">Outback</asp:ListItem>
Spring Promotion
Protected Sub chkpromo_CheckedChanged(sender As Object, e As EventArgs) Handles chkpromo.CheckedChanged
If chkpromo.Checked = True Then
ddlcars.Visible = False & ddlpromocars.Visible = True
Exit Sub
End If
If chkpromo.Checked = False Then
ddlcars.Visible = True & ddlpromocars.Visible False
Exit Sub
End If
End Sub
Remove Autopostback="True" for chkpromo, ddlcars and ddlpromocars to avoid postbacks
Remove Visible="False" for ddlcars and ddlpromocars to write html but hide it with css class.
Remove OnCheckedChanged="chkpromo_CheckedChanged" for chkpromo to avoid postbacks
And try
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>YOUR TITLE</title>
<script type="text/javascript">
function SetDdls(isChecked) {
if (isChecked) {
document.getElementsByName('ddlcars')[0].style.display = 'none';
document.getElementsByName('ddlpromocars')[0].style.display = 'block';
} else {
document.getElementsByName('ddlcars')[0].style.display = 'block';
document.getElementsByName('ddlpromocars')[0].style.display = 'none';
}
}
</script>
<style>
/*only for hide some element */
.hide {
display: none;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:CheckBox runat="server" ID="chkpromo" OnClick="SetDdls(this.checked);" Text="Click Me" /> <%--OnClick fires javascript function "SetDdls"--%>
<hr />
<asp:DropDownList ID="ddlcars" runat="server" >
<asp:ListItem>Please select a model</asp:ListItem>
<asp:ListItem Value="18295">Impreza</asp:ListItem>
<asp:ListItem Value="26595">WRX</asp:ListItem>
<asp:ListItem Value="21595">Crosstrek</asp:ListItem>
</asp:DropDownList>
<asp:DropDownList ID="ddlpromocars" runat="server" CssClass="hide"> <%--Hide by default unchecked--%>
<asp:ListItem>Please select a model</asp:ListItem>
<asp:ListItem Value="25395">BRZ</asp:ListItem>
<asp:ListItem Value="24995">Outback</asp:ListItem>
</asp:DropDownList>
</div>
</form>
</body>
</html>
And finally delete from code behind Sub "chkpromo_CheckedChanged".
So i changed my code to this and it works but the dropdownlist wont update until i change another control on my web form. Is there a way that I can make the ddl change upon me clicking on the checkbox
Protected Sub chkPromo_CheckedChanged(sender As Object, e As EventArgs) Handles chkPromo.CheckedChanged
If chkPromo.Checked = True Then
ddlpromocars.visible = True
ddlcars.Visible = False
End If
If chkPromo.Checked = False Then
ddlpromocars.Visible = False
ddlcars.Visible = True
End If
End Sub
Related
When I select on a radiobutton with AutPostBack true, google recaptcha goes. how can i solve this?
radiobutton with autopostback="true" attr. like this;
<asp:RadioButtonList runat="server" ID="kvkk" CssClass="radioButton" OnSelectedIndexChanged="kvkkSelectedIndexChanged" AutoPostBack="true">
<asp:ListItem Value="0">Kabul Ediyorum</asp:ListItem>
<asp:ListItem Value="1">Kabul Etmiyorum</asp:ListItem>
</asp:RadioButtonList>
div for reCAPTCHA;
<div class="captcha">
<div class="g-recaptcha" data-sitekey="***************************"></div>
</div>
When i select on a item from radiobutton, reCAPTCHA is going.
Try placing the Radio button in a update panel.
so, drag in the script manager, and then say this:
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:RadioButtonList runat="server" ID="kvkk" CssClass="radioButton" OnSelectedIndexChanged="kvkkSelectedIndexChanged" AutoPostBack="true">
<asp:ListItem Value="0">Kabul Ediyorum</asp:ListItem>
<asp:ListItem Value="1">Kabul Etmiyorum</asp:ListItem>
</asp:RadioButtonList>
</ContentTemplate>
</asp:UpdatePanel>
So, give the above a try. This does fire what we call a "partial" post-back, and your page load event will fire. And if you have any setup code, or loading of data or controls in the page load event, then make sure you test for first page postback like this:
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
If Not IsPostBack Then
' my setup and loading of controls data goes here
End If
End Sub
I am trying to get an "onchange" (not sure still new to asp) event to enter the select value text into a text box . I can seem to call the function.
here is my code:
<asp:DropDownList ID="ownerdpdnlst" runat="server" ontextChanged="execvalchanged" >
<asp:ListItem Value="(Choose One)">Choose one...</asp:ListItem>
<asp:ListItem Value="name1">name1</asp:ListItem>
<asp:ListItem Value="name2">name2</asp:ListItem>
<asp:ListItem Value="name3">name3</asp:ListItem>
<asp:ListItem Value="name4">name4</asp:ListItem>
<asp:ListItem Value="name5">name5</asp:ListItem>
</asp:DropDownList>
</asp:TableCell>
here is my vb.net code
<script runat=server>
Public Sub execvalchanged(Sender As Object, e As EventArgs) Handles ownerdpdnlst.SelectedIndexChanged
executortxtbx.Text = ownerdpdnlst.SelectedValue
MsgBox(ownerdpdnlst.SelectedValue)
End Sub
</SCRIPT>
any ideas?
In aspx You define OnTextChanged but in code behind SelectedIndexChanged. In aspx, Instead ontextChanged="execvalchanged" use OnSelectedIndexChanged="execvalchanged"– nelekSep 12 at 6:32
<td>Type:
</td>
<td>
<asp:DropDownList ID="ddltype" runat="server">
<asp:ListItem>---select---</asp:ListItem>
<asp:ListItem Text="Setter" Value="1">
</asp:ListItem>
<asp:ListItem Text="Getter" Value="2"></asp:ListItem>
</asp:DropDownList>
</td>
For this dropdownlist, I put validation like this
var ddltype = document.getElementById('<%=ddltype.ClientID%>');
var type = ddltype.options[ddltype.selectedValue].value;
if (type == 0) {
alert("Please Select setter/getter type.");
return false;
}
but it is not firing. How can I write this?
You should really get familiar with ASP.NET validators. Javascript can be disabled.
<asp:DropDownList ID="ddltype" runat="server" AutoPostBack="true">
<asp:ListItem>---select---</asp:ListItem>
<asp:ListItem Text="Setter" Value="1"></asp:ListItem>
<asp:ListItem Text="Getter" Value="2"></asp:ListItem>
</asp:DropDownList><br />
<asp:RequiredFieldValidator ID="reqType" runat="server"
InitialValue="---select---"
ControlToValidate="ddltype"
ErrorMessage="Required: Please select a Type"
Display="Dynamic"
CssClass="blah">
</asp:RequiredFieldValidator>
The InitialValue is important. Otherwise ---select--- would be a valid selection.
Note that i've also added AutoPostBack="true" to the DropDownList, maybe you want to postback immediately as soon as the user has selected an item.
Side-note: use a ValidationSummary with ShowMessageBox="true" and EnableClientScript="true" if you want to show the messages in a javascript alert.
Try this
var ddltype = document.getElementById('<%=ddltype.ClientID%>').text;
if (type == "---select---") {
alert("Please Select setter/getter type.");
return false;
}
Try this way ! but you can use asp.net validation control .
Any way ,my solution will validate two type ,for the dropdown selected vale or dropdown selected item
function Validate()
{
var e = document.getElementById('<%=ddltype.ClientID%>');
//if you need value to be compared then use
var strUser = e.options[e.selectedIndex].value;
//if you need text to be compared then use
var strUser1 = e.options[e.selectedIndex].text;
if(strUser==0) **//for text use if(strUser1=="---Select---")**
{
alert("Please Select setter/getter type.");
return false;
}
}
The below code has change your some code and working good for me
<%# Page Language="C#" AutoEventWireup="true" CodeFile="Home.aspx.cs" Inherits="Home" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript">
function validation() {
debugger;
var e = document.getElementById('<%=ddltype.ClientID%>');
var strUser1 = e.options[e.selectedIndex].value;
if (strUser1 == 0) {
alert("Please Select setter/getter type.");
return false;
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<table>
<tr>
<td>
<asp:Button ID="btnSave" runat="server" Text="Save" OnClientClick="validation();" OnClick="btnSave_Click" />
<asp:DropDownList ID="ddltype" runat="server">
<asp:ListItem Text="--Select--" Value="0"></asp:ListItem>
<asp:ListItem Text="Setter" Value="1">
</asp:ListItem>
<asp:ListItem Text="Getter" Value="2"></asp:ListItem>
</asp:DropDownList>
</td>
</tr>
</table>
<div>
</div>
</form>
</body>
</html>
and see this line
<asp:ListItem Text="--Select--" Value="0"></asp:ListItem>
But you missed set value in that item , So it's get error, Now set value 0 in that line , and now your code working (See my sample code), Or you need to use .text and check the condition for
if(strUser1=="---Select---")
{
//alert
}
I have a repeater with a dropdownlist in it. When a user changes its index, I would like a label to change its value. (the ddlSizes values come from a MySQL DB)
Sizes.aspx
<asp:DropDownList ID="ddlSizes" runat="server" AutoPostBack="True" DataSourceID="objdsSizes" DataTextField="SizeName" DataValueField="SizeID" />
<asp:Label ID="lbldummy" runat="server" Text=""></asp:Label>
Sizes.aspx.vb
Protected Sub ddlSizes_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles ddlSizes.SelectedIndexChanged
lbldummy = ddlSizes.value
End Sub
But the ddlSizes.SelectedIndexChanged isn't recognized. So the value of lbldummy won't change.
Any suggestions? Thank you.
You will want to create the handler for the DropDownList, within this you need to have code which will convert the sender into a DropDownList then get the parent control and convert it into the RepeaterItem. From this you can then reference any other controls within the RepeaterItem
Public Sub ddlSizes_SelectedIndexChanged(sender As Object, e As EventArgs)
Dim ddlSizes As DropDownList = DirectCast(sender, DropDownList)
Dim ri As RepeaterItem = DirectCast(ddlSizes.Parent, RepeaterItem)
Dim lbldummy As Label = DirectCast(ri.FindControl("lbldummy"), Label)
lbldummy.Text = ddlSizes.SelectedValue
End Sub
Then on your ddlSizes DropDownList add OnSelectedIndexChanged="ddlSizes_SelectedIndexChanged" and make sure it has AutoPostBack="True" set
Text is probably the default property, but I'd still specify it:
lbldummy.Text = ddlSizes.value
but for this, you really don't need to do a postback, you can accomplish this through Javascript as well. doing something like this:
<asp:DropDownList ID="ddlSizes" runat="server" onchange="return ddlSizes_change(this);" DataSourceID="objdsSizes" DataTextField="SizeName" DataValueField="SizeID" />
function ddlSizes_change(dropdown)
{
document.getElementById('<%= lbldummy.ClientID %>').innerHTML =
dropdown.options[myindex].value
return true;
}
Here's an example (C# but easily adaptable to VB.NET). Notice how inside the DdlSizes_SelectedIndexChanged I use FindControl to find the corresponding label:
<%# Page Language="C#" %>
<script type="text/c#" runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
rep.DataSource = Enumerable.Range(1, 5);
rep.DataBind();
}
}
protected void DdlSizes_SelectedIndexChanged(object sender, EventArgs e)
{
var ddl = (DropDownList)sender;
var lbl = (Label)ddl.FindControl("lbldummy");
lbl.Text = ddl.SelectedValue;
}
</script>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<title></title>
</head>
<body>
<form id="Form1" runat="server">
<asp:Repeater ID="rep" runat="server">
<ItemTemplate>
<asp:DropDownList ID="ddlSizes" runat="server" AutoPostBack="True" OnSelectedIndexChanged="DdlSizes_SelectedIndexChanged">
<asp:ListItem Value="1" Text="item 1" />
<asp:ListItem Value="2" Text="item 2" />
<asp:ListItem Value="3" Text="item 3" />
</asp:DropDownList>
<asp:Label ID="lbldummy" runat="server" />
</ItemTemplate>
</asp:Repeater>
</form>
</body>
</html>
I want to access drop down menu's variable in java script on change event, here is my code
<asp:DropDownList ID="DropDownList1" runat="server" onchange="document.location.href = url_Lookbook;" >
<asp:ListItem Value="0">hello</asp:ListItem>
<asp:ListItem Value="1">world</asp:ListItem>
</asp:DropDownList>
here is the script coding:
<script type="text/javascript">
var url_Lookbook = "http://microsoft.com";
</script>
My question is how do I pass down value=0 or value = 1 to different page, any help is appreciated.
If you wrote it as a javascript function, it would be simpler
<asp:DropDownList ID="DropDownList1" runat="server" onchange="navFromList(this.value);" >
<asp:ListItem Value="0">hello</asp:ListItem>
<asp:ListItem Value="1">world</asp:ListItem>
</asp:DropDownList>
<script type="text/javascript">
function navFromList( qsParam )
{
document.location.href = "http://microsoft.com?arg=" + qsParam;
return false;
}
</script>
This is how I do it, completely in server side code. You don't have to use javascript (if you aren't required to)
<asp:DropDownList ID="ddlGlobalDestinations" runat="server" OnSelectedIndexChanged="ddlGlobalDestinations_SelectedIndexChanged" AutoPostBack="true">
<asp:ListItem Text="StackOverflow" Value="http://www.stackoverflow.com"></asp:ListItem>
<asp:ListItem Text="Google" Value="http://www.google.com/"></asp:ListItem>
<asp:ListItem Text="Microsoft" Value="http://www.microsoft.com/"></asp:ListItem>
</asp:DropDownList>
here is the c# code-behind
protected void ddlGlobalDestinations_SelectedIndexChanged(object sender, EventArgs e)
{
Response.Redirect(ddlGlobalDestinations.SelectedValue, true);
}
onchange="document.location.href = url_Lookbook + '?param=' + this.value;" appears to work in FF3 and IE7.