AJAX and Tables in Database

[Suzi167]

Hello All AJAX Gurus,

I have the following issue:

I have an AJAX ModalPopUpExtender control which brings up a panel which has a field to enter User Name and Password. The panel also contins an OK and Cancel Buttons.Here is the code for the panel and the ModalPopUpExtender.

<div id="PanelInfo">
<asp:Button ID="Button1" runat="server" Text="Click here"/>&nbsp;
 <asp:Panel ID="Panel1" runat="server" Style="display: none" CssClass="modalPopup">
    <table>
       <tr>
         <td><asp:Label runat="server" ID="lblUserName" Text="User Name:"/></td>
         <td><asp:TextBox runat="server" ID="txtUserName" /></td>
       </tr> 
       <tr>
         <td><asp:Label runat="server" ID="lblPassword" Text="Password:"/></td>
         <td><asp:TextBox runat="server" ID="txtPassword" /></td>
       </tr>
       <tr>     
         <td><asp:Button ID="OkButton" runat="server" Text="OK" OnClick="OkButton_Click"/></td>
         <td><asp:Button ID="CancelButton" runat="server" Text="Cancel" /></td>
       </tr>
    </table>       
 </asp:Panel>

<cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server"
            TargetControlID="Button1"
            PopupControlID="Panel1" 
            BackgroundCssClass="modalBackground" 
            OkControlID="OkButton"
            CancelControlID="CancelButton" 
            DropShadow="true"/>

</div>

and in my .cs file I have

protected void Page_Load(object sender, EventArgs e)
    {
        ModalPopupExtender1.Show(); //show the dialog box in which trhe user needs to enter their user name and password
     }

I want to take the information entered by the user and use it to query a Database table.


I know how to do all that in a regular environment but the problem I am having with AJAX controls is that the program execution never gets to the OK button's click Event and I partially understand that this can be becausee the page never reloads and since the CLick event occurs after the Load event, the click event never happens. So I don't know where to place my code to access the DataBase and query the table.

Does anyone know how to handle the above scenario?

Thanks Very much in advance

Susan

[PeejAvery]

Any querying of the database would have to be on the server-side script itself. Since a query can be a variable, just take what the user enters and call the query.

[Suzi167]

Thanks for the quick reply.

I understand how to do the query but the question is in which event should I place the query code.
The CLick event of the button never executes since the page never re-loads.

Thanks

Susan

[Suzi167]

In other words the main question here is:

What server side event happens when I click on the OK button of the ModalPopUpExtender.

Thanks

[PeejAvery]

The server-side does not have events. Events are triggered on the client-side. Are you using C# as your server-side language? If so, then the query must be put there. If you are using ASP, then the query can be put there.

[Suzi167]

I am a little confused.
When you say "there" wher in the program code are you refering?
In the Button1_Click function, in the Page_Load function?

Thanks very much for trying to help

Susan

[PeejAvery]

Click functions are client-side. You cannot run server-side code from the client-side. You will need to edit the server-side code directly.

Now, if the Page_Load function is server-side, then you could put it there.

In order to query the server-side database, you must be using the server-side code. So what is your server-side code?

[Suzi167]

On the server side ( in my default.cs file) all I have is the following code

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        ModalPopupExtender1.Show(); //show the dialog box in which trhe   
        user needs to enter their user name and password
   
    }

          
    protected void OkButton_Click(object sender, EventArgs e)
    {
       //Here is where I am plannign to place the Database code but the 
       problem is that the code execution never comes to that point
    }
  
    
}

In my ASP code I have

<div id="PanelInfo">
  <asp:Panel ID="Panel1" runat="server" Style="display: none"
    CssClass="modalPopup">
    <table>
       <tr>
         <td><asp:Label runat="server" ID="lblUserName" Text="User 
                 Name:"/>
         </td>
         <td><asp:TextBox runat="server" ID="txtUserName" /></td>
       </tr> 
       <tr>
         <td><asp:Label runat="server" ID="lblPassword" 
                  Text="Password:"/>
         </td>
         <td><asp:TextBox runat="server" ID="txtPassword" /></td>
       </tr>
       <tr>     
         <td><asp:Button ID="OkButton" runat="server" Text="OK" /></td>
         <td><asp:Button ID="CancelButton" runat="server" 
                 Text="Cancel" />
          </td>
       </tr>
    </table>       
 </asp:Panel>

<cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server"
            PopupControlID="Panel1" 
            TargetControlID="Button1"
            BackgroundCssClass="modalBackground" 
            OkControlID="OkButton"
            CancelControlID="CancelButton" 
            DropShadow="true"/>

</div>

This is basically the code.

When My page loads I get the Log In Modal Box and when I click on the OK button the Box disappears.

So my question is - If I need to do some Database or any other processing for that matter which needs to occur when the user clicks on the OK button where in my code should I place the processing piece.

One thing that I noticed is that I have Button1 as the TargetCOntrolID but I use the .show method from the page load event.I don't think it matters but I thought I'd mention it.

Thanks very much.

Susan

[PeejAvery]

Exactly where you are planning to put the code is where it should go. So does the Ok button not register any click on the client-side?

[Suzi167]

Unfortunately no.
I had a break point at that function just to test it before I starteed writing code and the code execution nevers gets to that point.
However if I put some code on in a Javascript fucntion then it executes. For example I tried the following:

<script type="text/javascript">
   function onOk()
      {
        alert("Test");
      }
     
</script>

and then further down I added

<cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server"
            PopupControlID="Panel1" 
            TargetControlID="Button1"
            BackgroundCssClass="modalBackground" 
            OkControlID="OkButton"
            OnOkScript="onOk()"
            CancelControlID="CancelButton" 
            DropShadow="true"/>

That executes well and I see the test dialog coming up but undofrtunately the program never makes it to the C# function

Susan

[PeejAvery]

Back we go again. C# is on the server-side. You will need to make this login section a form. Then the C# can process the form. There you put your query.