[RESOLVED]Clientside event for Dropdownlist

Hi Friends,

I have 2 drop down lists ddl1 and ddl2. After selecting an item from the list for ddl1,i select an item from the list ddl2. If the item selected for ddl2 is not the same as the item selected for ddl1,an OK/CANCEL alert box should appear showing "Location
Name and Charged To Location are not the same. Do you want to proceed?".If clicked OK then nothing happens and return to the same page. If clicked CANCEL, ddl2 is cleared and return to the same page with focus on ddl2. Is there any clientside event to do this?
I tried writing it in the SelectionChangedEvent of ddl2 in the server side, but the alert box does’nt appear in the same page and it appears in another blank page.Below is the code.

Protected Sub ddl2_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles ddl2.SelectedIndexChanged
If ddl2.Text <> ddl1.SelectedItem.Text Then
Dim CSM As ClientScriptManager = Page.ClientScript
If Not ReturnValue() Then
Dim strconfirm As String = "<script>if(!window.confirm(‘Location Name and Charged To Location are not the same. Do you want to proceed?’)){window.location.href=’Presences.aspx’}</script>"
CSM.RegisterClientScriptBlock(Me.[GetType](), "Confirm", strconfirm, False)
ddlLocName.Focus()
End If
End If

Private Function ReturnValue() As Boolean
Return False
End Function

Can someone help me with a client side event for dropdownlist.

Thanks.

You can achive it using simple js like below:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <title>Uploader Demo</title>
    <script language="javascript" type="text/javascript">
        function OnChange(dropdown) {
            var myindex = dropdown.selectedIndex;
            var SelValue = dropdown.options[myindex].value;
            var objFirstDDL = document.getElementById('<%= DropDownList1.ClientID %>');
            var oldidx = objFirstDDL.selectedIndex;
            var FirstValue = objFirstDDL.options[oldidx].value;
            if (SelValue != FirstValue) {
                var blnResult = confirm("Location Name and Charged To Location are not the same. Do you want to proceed?");
                if (blnResult) {
                    return false;
                }
                else {
                    dropdown.selectedIndex = 4;
                    return false;
                }
            }
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:DropDownList runat="server" ID="DropDownList1" AutoPostBack="false">
            <asp:ListItem Text="Text1" Value="Value1"></asp:ListItem>
            <asp:ListItem Text="Text2" Value="Value2"></asp:ListItem>
            <asp:ListItem Text="Text3" Value="Value3"></asp:ListItem>
        </asp:DropDownList>
        <asp:DropDownList runat="server" ID="DropDownList2" AutoPostBack="false" onchange='return OnChange(this);'>
            <asp:ListItem Text="Text1" Value="Value1"></asp:ListItem>
            <asp:ListItem Text="Text2" Value="Value2"></asp:ListItem>
            <asp:ListItem Text="Text3" Value="Value3"></asp:ListItem>
            <asp:ListItem Text="" Value=""></asp:ListItem>
        </asp:DropDownList>
        <asp:DropDownList runat="server" ID="DropDownList3">
        </asp:DropDownList>
        <asp:DropDownList runat="server" ID="DropDownList4">
        </asp:DropDownList>
    </div>
    </form>
</body>
</html>

Thanks Friend..It worked perfectly.

I need 1 more similar help from you. I have 2 textboxes to enter the dates and a checkbox next to it. Dates are entered through calender control in JS.If the entered dates are greater than the present date,the checkbox should be disabled else the checkbox
should be enabled. Should I use javascript for this purpose? Through which event can I do this. Below are my code for textboxes.

<asp:TextBox ID="txtFromDate" runat="server" CssClass="txtbox" Width="80px"
onfocus="showCalendarControl(this)" AutoPostBack="True"></asp:TextBox>

<asp:TextBox ID="txtToDate" runat="server" CssClass="txtbox" Width="80px"
onfocus="showCalendarControl(this)" AutoPostBack="True"></asp:TextBox>

I Tried to write a server side code like this, but didnt work.

If CDate(txtFromDate.Text) > Date.Now.Date Or CDate(txtToDate.Text) > Date.Now.Date Then
chkCon.Enabled = False
Else
chkCon.Enabled = True
End If

Hope you can help me.

Thanks.

Leave a Reply