Question

In my previous web development experience I have used LAMP setups. I am trying to learn the Microsoft way as I develop a project using the following tools:

• ASP.NET 3.5
• C#
• MS Visual Studio 2008

Here is my question: How can I tell when code gets executed on the server versus code that is exectued as javascript?

I have added AJAX functionality to my aspx file using tutorials I found online. I have something like:

ASP:

<asp:ScriptManager />
<asp:UpdatePanel>
    <ContentTemplate>
        <input id="inputItem" type="text" runat="server" />
        <asp:Button id="submitButton" runat="server"
                    OnClick="submitButton_clicked"/>
    </ContentTemplate>
</asp:UpdatePanel>

C#:

protected void submitButton_clicked (object sender, EventArgs e)
{
    // Do dynamic stuff on page.
}

I have been able to successfully update elements on the page without requiring a refresh. It is my understanding that the C# function submitButton_clicked() is automatically converted to javascript by Visual Studio when the web application is built (as well as any functions called by it).

I need to be able to submit the user-supplied data in this form to the server so that I can add it to a database. What I do not understand is how to differentiate between code that is automatically converted to javascript and code that is not. I want to be able to call functions from submitButton_clicked() which use LINQ to perform database operations, and have that code executed server-side.

I have been trying to find some online tutorials which explain this distinction cleary but have had no luck so far. Any help is appreciated.

Answer 1

Your code in the submitButton_clicked function is not converted to javascript, it executes on the server side. The use of the UpdatePanel allows your page to refresh the content of the UpdatePanel via javascript (AJAX) calls to the server, so that the user doesn’t experience a full page reload. The server-side code all still runs.

You should insert some breakpoints in your code (the Page_Load, your submitButton_clicked, other places), and watch what happens when the UpdatePanel refreshes. The page will go through its entire life-cycle on the server-side, and the new state will be passed via AJAX to the controls in the UpdatePanel.