Passing jQuery "OK" button click to code behind

Passing jQuery "OK" button click to code behind

Hi There!

I have created a jQuery "confirm" type dialog which is called from a button click event in VB code behind. So far, so good. However, I now need to be able to do something (in VB) when the "OK" button is clicked by the user.

So, to put in context, I will have a page with some textbox controls to gather information, then the user clicks a "Submit" (asp:button) to save the information to an SQL table. When the user clicks the asp:button, the VB code behind launchs a nice jQuery "Are you sure?" - Ok/Cancel dialog box. If the user clicks "Cancel", nothing happens. Fine. However if the user clicks "Ok" then i need the VB OnClick event sub routine to then run the code to update the SQL table. Hope that's clear so far.

Here is the code framework as it is now (minus the database update stuff which is not needed right now): 

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


    <!doctype html>
    <html lang="en">
    <head>
    <meta charset="utf-8" />
    <title>jQuery UI Dialog</title>

        

    <link href="css/jquery-ui-1.10.2.custom.css" rel="stylesheet" />
        
    <script src="js/jquery-1.9.1.js"></script>
        
    <script src="js/jquery-ui-1.10.2.custom.js"></script>
        
    <script type="text/javascript" src="js/apprise-1.5.full.js"></script>
        
    <link rel="stylesheet" href="css/apprise.css" type="text/css" />
        
    <link rel="stylesheet" href="/resources/demos/style.css" />
        
    <script type="text/javascript">
            $
    (document).ready(function () {
                $
    ("#myDialog").dialog({
                    autoOpen
    : false,
                    resizable
    : false,
                    width
    : 400,
                    height
    : 250,
                    modal
    : false,
                    buttons
    : {
                        
    "Ok": function () {
                            $
    (this).dialog("close");
                        
    },
                        
    Cancel: function () {
                            $
    (this).dialog("close");
                        
    }
                    
    }
                
    });
            
    });
            
    //$('#yourPanel').dialog({
            
    //    //options
            
    //}).parent().appendTo("form");
        
    </script>
    </head>
    <body>
        
    <form id="form1" runat="server">
            
    <asp:Button ID="btnOpenMe" runat="server" Text="Click Me to open Dialog box" />
                
    <div id="myDialog" title="Alert!">
                    
    <p>Are you sure you want to save this record?</p>
                
    </div>
        
    </form>
    </body>
  2. </html>
And here is the VB 

  1. Partial Class TheBigOne_OpenDialogFromVB
        
    Inherits System.Web.UI.Page

        

    Protected Sub btnOpenMe_Click(sender As Object, e As EventArgs) Handles btnOpenMe.Click
            
    Page.ClientScript.RegisterStartupScript(Me.GetType(), "openDialog", "$(function(){$('#myDialog').dialog();$('#myDialog').dialog('open');});", True)
            
    'If [button in dialog]="ok" then
            '
        Update the SQL table
            
    'End If
        End Sub
    End Class

It all sounds pretty simple, and it is. I'm not looking to pass any values of the textboxes back to VB because I'm assuming that the values in the textboxes will be available to VB. I just want to passback the result of the button click to code behind - if "Ok" then do something.

Please note that I really need to do the main server-side processing in VB. All I need is to be able to
tragger the data table update (or any action for that matter) after the button "OK" is clicked. I tried "if IsPostback" in the onclick event in code behind but the page processes that as soon as the "Submit button" is triggered, not after the jQuery confirm dialog.

if this all sounds a bit complex for such a simple task, its because I am trying to establish the principle of capturing web page info into code behind after a jQuery event.

Any suggestions most appreciated.