How do I create a pop up Yes/No message box called from and return the result to C# code? Javascript? Something else?

RD 40 Reputation points
2023-03-12T04:16:00.4333333+00:00

This is what I have. It seems to pass the false value and go into the else area. I need the pop up box to appear, let the user select confirm or cancel then pass that value back to the C# code.

Any thoughts?

Thanks in advance!

`<script type="text/javascript">`

function confirm_closing()

{

var confirmValue = document.createElement("INPUT");

//confirm_closingValue.type = "hidden";

confirm_closingValue.name = "confirm_closingValue";

if (confirm_closing("Do you want to accept the closing?")) {

confirm_closingValue.value = "CONFIRM";

}

else

{

confirm_closingValue.value = "CANCEL";

}

document.forms[0].appendChild(confirm_closingValue);

}

</script>

          C# Code
              ScriptManager.RegisterStartupScript(this.Page, Page.GetType(), "text", "confirm_closing()", false);

string confirm_closingValue = Request.Form["confirmValue"];
                        if (confirm_closingValue == "CONFIRM")
                        {

                            //Do Something
                        }
                        else   
                        {
                            //Do Something Else
                        }

ASP.NET
ASP.NET
A set of technologies in the .NET Framework for building web applications and XML web services.
3,358 questions
JavaScript API
JavaScript API
An Office service that supports add-ins to interact with objects in Office client applications.
909 questions
0 comments No comments
{count} votes

Accepted answer
  1. Lan Huang-MSFT 27,716 Reputation points Microsoft Vendor
    2023-03-13T06:53:49.3833333+00:00

    Hi @RD,

    Based on your code, are you passing confirm_closingValue to c#?

    But the naming of your "input" is messy, named confirmValue, and the next line becomes confirm_closingValue.

    I think you should unify, you can refer to the code below.

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title></title>
        <script type = "text/javascript">
            function confirm_closing() {
                var confirm_closingValue = document.createElement("INPUT");
    
                confirm_closingValue.name = "confirm_closingValue";
                if (confirm("Do you want to accept the closing?")) {
                    confirm_closingValue.value = "CONFIRM";
                } else {
                    confirm_closingValue.value = "CANCEL";
                }
                document.forms[0].appendChild(confirm_closingValue);
            }     
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
          <asp:Button ID="btnConfirm" runat="server" OnClick="OnConfirm" Text="Confirm" OnClientClick="confirm_closing()"/>
        </form>
    </body>
    </html>
    
    public void OnConfirm(object sender, EventArgs e)
            {
    
                string confirmValue = Request.Form["confirm_closingValue"];
                if (confirmValue == "CONFIRM")
                {
                    this.Page.ClientScript.RegisterStartupScript(this.GetType(), "alert", "alert('You clicked CONFIRM!')", true);
                }
                else
                {
                    this.Page.ClientScript.RegisterStartupScript(this.GetType(), "alert", "alert('You clicked CANCEL!')", true);
                }
    
            }
    

    Best regards,
    Lan Huang


    If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
    Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.


3 additional answers

Sort by: Most helpful
  1. Karen Payne MVP 35,286 Reputation points
    2023-03-12T12:15:53.0666667+00:00

    Unsure if this will work for you, have an example which works on a button click, ask a question, assigns result to a Model property and performs a post.

    Uses sweetalert2.

    Post

    0 comments No comments

  2. Bruce (SqlWork.com) 59,021 Reputation points
    2023-03-12T16:34:39.4533333+00:00

    RegisterStartupScript Does not run the script. It adds the script text to a collection. When the page html is generated, the script text is added to the html. Then the browser loads the html, sees the script and executes it.

    to tell the server the yes/no the script will need to update a hidden field with the answer and do a postback so the server can process the answer.


  3. Albert Kallal 5,141 Reputation points
    2023-08-06T15:10:48.3533333+00:00

    Well, the standard in asp.net webforms is this behavour:

    You drop into the web form a standard asp.net button.

    You then attach BOTH a client side JavaScript event, and a server side even to that button.

    If the JavaScript code returns true, then the server side code will run. If the JavaScript code returns false, then the server side button code will not run.

    Of course the above is simple if you use JavaScript confirm, since it halts code. However, the built in confirm dialog does not look all that great.

    I could Segway in this post and point out that the HTML5 standards about 8 years ago added a new modal dialog option, and they are REALLY nice, easy, and don't require any 3rd party library code. And as about January of this year, near all browsers now support the new dialogs and modal options.

    However, I use jQuery.UI dialogs, and I adopted them for a bunch of reasons, but one really nice reason is they support "position" on the screen, and I thus like having my dialog boxs pop up right beside where the button click occured.

    So, in the most simple way, let's pop a jQuery.UI dialog, and pass true, or false to the button click.

    The advantages of above are many:

    Such as, you can add dialogs to EXISTING buttons, and not have to add any hidden fields.

    You don't need to add extra code to post-back the page, but you "continue" to enjoy a simple plain jane button click on those web pages.

    So, lets drop in a standard asp.net button and add the server side event.

    So, this markup and code:

        <h3>Button test</h3>
        <asp:Button ID="Button1" runat="server" 
            Text="My button test"
            OnClick="Button1_Click"
            CssClass="btn btn-info"
            OnClientClick="return mydialog(this)"
            />
        <br />
        <asp:Label ID="Label1" runat="server" Text="">
        </asp:Label>
    
        <div id="mypopdiv" style="display:none">
            <h3>Delete this record</h3>
            <h4>(This can't be un-done)</h4>
        </div>
    
        <script>
            var myok = false
            function mydialog(btn) {
    
                if (myok)
                    return true
    
                var mydiv = $("#mypopdiv")
                mydiv.dialog({
                    modal: true, appendTo: "form",
                    title: "Test Button", closeText: "",
                    dialogClass: "dialogWithDropShadow",
                    position: { my: 'left top', at: 'right bottom', of: btn },
                    buttons: {
                        Ok: function () {
                            mydiv.dialog('close')
                            myok = true
                            btn.click()
                        },
                        cancel: function () {
                            mydiv.dialog('close')
                        }
                    }
                });
    
                return false
            }
        </script>
    
    
    

    And code behind for this button is this:

            protected void Button1_Click(object sender, EventArgs e)
            {
                Label1.Text = "this is server side code";
            }
    
    

    And now the result of above is this:

    ndialog

    So, the only "trick" in above is that most JavaScript routines are asynacrours, and don't wait. However, as above shows, we get around this issue by adding a "flag" variable to above and passing the btn control. This means that no hidden controls, or even fancy js await commands are required. And besides, by passing the btn, then we can position the dialog to the lower right of the button click, and I often use this for grid buttons, or anything else on a page, since when a user clicks a button, their eyes are focused on that spot, and hence display of a dialog in the same area as to where the user clicked makes much sense from a UI point of view.

    As noted, the other big bonus of above is we can with ease add dialogs to existing buttons, and don't have to change the server side code, don't have to introduce addtional fields or controls on the client side. So, the long time simple apporach of having the routine return a true (to run the server side code), or false (to not run server side code) can be used with the above approach.

    In fact, this means then one can build a user control, and thus to have dialogs then you simple drag + drop in your UC, and specify the button for that user control to operate against, and you have a re-usable drag + drop dialog control, and one that you can drop into any web page without having to write additional code.

    0 comments No comments