confirm message box on dropdown list selected index changed

I want to pop-up confirm message (with yes/no question) after I change selected value of dropdown list. After user click yes I want to call function for sending LN mail ComposeNotesMail(), if user click on No button mail should not be sent.
LVL 1
kahvedzicAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Deepak LakkadCommented:
Hi

You need a javascript like given below

 <script language ="javascript">
        function test() {
            confirm("Are you sure");
        }
    </script>

Open in new window


This will be called from DropDown. Code for Dropdown is given below:

<asp:DropDownList ID="DropDownList1" runat="server" OnChange="test();">
        <asp:ListItem>Value - 1</asp:ListItem>
        <asp:ListItem>Value - 2</asp:ListItem>
    </asp:DropDownList>

Open in new window


OnChange="test();" is important part of the dropdown code

- Deepak Lakkad
Kumaraswamy RCommented:
Rajar AhmedConsultantCommented:

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="dropdownselectconfirm.aspx.vb" Inherits="dropdownselectconfirm" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Dropdown Select Confirm</title>
    <SCRIPT language="JavaScript">

function go_there()
{
 var where_to= confirm("Do you want to Email??");
 if (where_to == true) {
     document.getElementById("form1").submit()
     
 }
 else {
     alert("notthing happend");
     return false; 
   }
}
</SCRIPT>    
</select>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:DropDownList ID="DropDownList1" runat="server" onchange="return go_there()">
    <asp:ListItem>Notify1</asp:ListItem>
    <asp:ListItem>Notify2</asp:ListItem>
    <asp:ListItem>Notify3</asp:ListItem>
    </asp:DropDownList>

    </div>
    </form>
</body>
</html>


'**************************Codebehind**************'

Partial Class dropdownselectconfirm
    Inherits System.Web.UI.Page


    Protected Sub DropDownList1_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles DropDownList1.SelectedIndexChanged
        Response.Write(DropDownList1.SelectedValue & " You Selected") 'use dis place to send email according to ur logic

    End Sub
End Class

Open in new window

Become a Certified Penetration Testing Engineer

This CPTE Certified Penetration Testing Engineer course covers everything you need to know about becoming a Certified Penetration Testing Engineer. Career Path: Professional roles include Ethical Hackers, Security Consultants, System Administrators, and Chief Security Officers.

Rajar AhmedConsultantCommented:
try my code .. its deals wat u need ..hope it helps..
same code as above...just provided some hints
Meeran03
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="dropdownselectconfirm.aspx.vb" Inherits="dropdownselectconfirm" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Dropdown Select Confirm</title>
    <SCRIPT language="JavaScript">

function go_there()
{
 var where_to= confirm("Do you want to Email??");
 if (where_to == true) {
     document.getElementById("form1").submit() //In order to post,so it will reach the selection change event
     
 }
 else {
     alert("notthing happend");
     return false; 
   }
}
</SCRIPT>    
</select>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:DropDownList ID="DropDownList1" runat="server" onchange="return go_there()">
    <asp:ListItem>Notify1</asp:ListItem>
    <asp:ListItem>Notify2</asp:ListItem>
    <asp:ListItem>Notify3</asp:ListItem>
    </asp:DropDownList>

    </div>
    </form>
</body>
</html>


'**************************Codebehind**************'

Partial Class dropdownselectconfirm
    Inherits System.Web.UI.Page


    Protected Sub DropDownList1_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles DropDownList1.SelectedIndexChanged
        Response.Write(DropDownList1.SelectedValue & " You Selected") 'use dis place to send email according to ur logic

    End Sub
End Class

Open in new window

kahvedzicAuthor Commented:
I try all of this and still nothing, I use VS 2010 and Framework 4, use all of those suggestions and still nothing. Once more, I have DDL with values 1, 2, 3. When changing from 1 to 2 I want confirmation msg box where on yes button click call ComposeNotesMail(), and on No button click msg box will close. I need this only when changing from 1 to 2 and not from 2 to 3.
Rajar AhmedConsultantCommented:


Did u test my code in a new file before integrating to ur code .  coz it works pretty well. !

can u post ur code ?

Meeran03
dropconfirm.txt
Greg GambleProgrammerCommented:
In visual studio, double click on the dropdown.  This will create an event handler for the on change event.  Add your code there.  If you have the Ajax toolkit installed, use the modal popup.

http://www.asp.net/ajaxlibrary/act_ModalPopup.ashx



kahvedzicAuthor Commented:
@meeran03 I have problem with code behind:

Response.Write(DropDownList1.SelectedValue & " You Selected") 'use dis place to send email according to ur logic

I need to call function ComposeNotesMail() when DropDownList1.SelectedValue = P

@bmxer, I never used AJAX before, can you help me with some code, how to add modal pop-up window and use the way I need to?
Rajar AhmedConsultantCommented:
ya d attached code will perfform dat task
Protected Sub DropDownList1_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles DropDownList1.SelectedIndexChanged
        'use dis place to send email according to ur logic
        If DropDownList1.SelectedValue = "p" Then
            Response.Write(" You Selected = " & DropDownList1.SelectedValue)
            ComposeNotesMail() 'use dis place to send email according to ur logic
        Else
            Response.Write("Emaill Option only For Selection p and for " & DropDownList1.SelectedValue)
        End If

    End Sub

Open in new window

dropconfirm.txt
kahvedzicAuthor Commented:
now I have error on this line

document.getElementById("form1").submit()

Microsoft JScript runtime error: 'document.getElementById(...)' is null or not an object

probably because my .aspx page looks like this:

<%@ Page Title="" Language="VB" MasterPageFile="~/Site.master" AutoEventWireup="false" CodeFile="Default2.aspx.vb" Inherits="Default2" %>

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" Runat="Server">
    <script language="JavaScript">

    function go_there() {
        var where_to = confirm("Do you Email??");
        if (where_to == true) {
            document.getElementById("form1").submit()

        }
        else {
            alert("notthing happend");
            return false;
        }
    }
</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" Runat="Server">
    <div>
    <asp:DropDownList ID="DropDownList1" runat="server" onchange="return go_there()">
    <asp:ListItem>Notify1</asp:ListItem>
    <asp:ListItem>Notify2</asp:ListItem>
    <asp:ListItem>Notify3</asp:ListItem>
    </asp:DropDownList>
    </div>
</asp:Content>

script cant point to control because of master page, but I dont know how to point to dropdown list
kahvedzicAuthor Commented:
And Happy New Year to all you people :)
Rajar AhmedConsultantCommented:
check the view source then give the id of form attribut
once u used master page , the id differs it ll b mostly aspnetForm
function go_there() {
        var where_to = confirm("Do you want to Email??");
        if (where_to == true) {
            document.getElementById("aspnetForm").submit()

        }
        else {
            alert("notthing happend");
            return false;
        }
    }

Open in new window

Rajar AhmedConsultantCommented:
happy new year mate..
kahvedzicAuthor Commented:
It is working now, I need to change to ("ctl01").submit(), but now I have problem that this is working on every index change of dropdownlist (I have 1-2-3 values and want this pop up on change from 1-2 not also on 2-3).
Rajar AhmedConsultantCommented:
pass the value in the condition
onchange="return go_there(this.value)"

and put those condition on
if condition u need  to allow the confirm buttom

Meeran03




function go_there(value) {
if (value=="p"){
 var where_to= confirm("Do you want to Email??");
 if (where_to == true) {
     document.getElementById("form1").submit()
     
 }
 else {
     alert("notthing happend");
     return false; 
   }
}
}

<asp:DropDownList ID="DropDownList1" runat="server" onchange="return go_there(this.value)">
    <asp:ListItem Value="n">m</asp:ListItem>
    <asp:ListItem Value="o">n</asp:ListItem>
    <asp:ListItem Value="p">p</asp:ListItem>
    </asp:DropDownList>

Open in new window

kahvedzicAuthor Commented:
this is my code:

    <script language="JavaScript" type="text/javascript">

        function go_there(value) {
        if (value=="P "){
            var where_to = confirm("Do you Email??");
            if (where_to == true) {
                document.getElementById("ctl01").submit()

            }
        }
    </script>

<asp:DropDownList ID="DropDownList4" runat="server" AutoPostBack="True"
                                            ondatabound="DropDownList4_DataBound"
                                            onselectedindexchanged="DropDownList4_SelectedIndexChanged" onchange="return go_there(this.value)"
                                            SelectedValue='<%# Bind("Status") %>'>
                                            <asp:ListItem>Z </asp:ListItem>
                                            <asp:ListItem>P </asp:ListItem>
                                            <asp:ListItem>I </asp:ListItem>
                                            <asp:ListItem>O </asp:ListItem>
                                            <asp:ListItem>D </asp:ListItem>
                                            <asp:ListItem>X </asp:ListItem>
                                            <asp:ListItem>M </asp:ListItem>
                                        </asp:DropDownList>

and I got this message:

Microsoft JScript runtime error: Object expected

Sorry but I dont use JavaScript that often
Rajar AhmedConsultantCommented:
can u put ur viewsoure of this page
ctrl+u in FF/Chrome
rt+clk in i.e
kahvedzicAuthor Commented:
this is it
source.htm
Rajar AhmedConsultantCommented:
you missed one braces at end of the fn ..
<script language="JavaScript" type="text/javascript">

        function go_there(value) {
		  if (value=="P "){
            var where_to = confirm("Do you want to Email??");
            if (where_to == true) {
                document.getElementById("ctl01").submit()

            }
        }
		}
    </script>

Open in new window

kahvedzicAuthor Commented:
it happens :)  Now it is working when changing from status Z to status P like it is suppose to work.

But problem is when I after changing DDL selected value to I or X postback is not working and it must because on postback of DDL there is some code to execute.
Rajar AhmedConsultantCommented:
here the solution...

meeran03.
function go_there(value) {
             if (value == "P") {
                var where_to = confirm("Do you want to Email??");
                if (where_to == true) {
                    document.getElementById("ctl01").submit()
                }
            }
            else {
                document.getElementById("ctl01").submit()
            }
 }

Open in new window

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
kahvedzicAuthor Commented:
I am very very grateful for your help. Realy appreciate all your effort. This is working just as I need to.

Thanks mate. Cheers.
Rajar AhmedConsultantCommented:
welcome . :) ve a good day.
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
ASP.NET

From novice to tech pro — start learning today.