asp.net - execute serverside code on div click

Question

ASPX CODE

<div id="c" runat="server" onclick="loadContentFamily" onmousedown="loadContentFamily" rel="divUpdatePanel" >Family</div>

ServerSide Code

Public Sub loadContentFamily(ByVal PageName As String)
        MsgBox("")
        PageName = "Family"
        Dim _con As New SqlConnection(ConfigurationManager.ConnectionStrings("LeaveDBConnectionString").ConnectionString)
        Dim _da As New SqlDataAdapter("SELECT PageHeader,PageContent FROM PageKeeper WHERE PageName='" & PageName & "'", _con)
        Dim _table As New DataTable

        Try
            _con.Open()
            _da.Fill(_table)
            _con.Close()
            _con.Dispose()
            With _table.Rows(0)
                h4header.InnerText = .Item(0)
                divUpdatePanel.InnerHtml = .Item(1)
                Me.Title = .Item(0)
            End With

        Catch ex As Exception
            MsgBox(ex.Message)
            divUpdatePanel.InnerText = "No Data Found"
        Finally
            _con.Close()
            _con.Dispose()
        End Try
    End Sub

PROBLEM:

When i click on the div it does not execute the ServerSide Code ...why??Any help appreciated.

Answer 1

You need to raise a server event, not client event (and it looks like you want to do that asynchronously).

This article explains how to attach a snippet of code to a client element (like a DIV) and cause an asynchronous postback.

Another quick and dirty way of accomplishing this is to use a hidden server button. The button can be located wherever desired (such as inside an UpdatePanel) and it allows proper usage of the ASP page lifecycle.

<asp:Button runat="server" id="btnPostback" style="display:none" onclick="serverEventHandler" />

<div onclick="document.getElementById('<%= btnPostback.ClientID %>').click()">Clickable DIV</div>