Jan 05, 2011, 7:21 PM
Adding Click Event In Code Behind - Not working
Adding Click Event In Code Behind
I have tried everything almost humanly possible :cool: to try and add a Click Event to a button In Code Behind. The challenge here is to build panels based on server-side conditions based on the current user context. I read that the following AddHandler statement is meantFormDemo.zipFormDemo.zip to achieve this objective:
AddHandler btnNext.Click, AddressOf WizNextClick
I have tried everything almost humanly possible :cool: to try and add a Click Event to a button In Code Behind. The challenge here is to build panels based on server-side conditions based on the current user context. I read that the following AddHandler statement is meantFormDemo.zipFormDemo.zip to achieve this objective:
AddHandler btnNext.Click, AddressOf WizNextClick
Imports Ext.Net
Imports Ext.Net.X
Imports Ext.Net.Utilities
Public Class _Default
Inherits System.Web.UI.Page
Protected btnPrev As New Button
Protected btnNext As New Button
Private Sub Page_Init(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Init
BuildGettingStarted()
End Sub
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
End Sub
Private Sub BuildGettingStarted()
Dim wBegin As New DesktopWindow
With wBegin
.ID = "wBegin"
.Maximizable = False
.Minimizable = False
.Title = "Getting Started"
.Width = 180
.Height = 250
.Border = False
.Resizable = False
Dim pnlWiz As New Panel
With pnlWiz
.ID = "wizStart"
'.Padding = "15"
.Layout = "card"
.ActiveIndex = 0
Dim pStep1 As New Panel
Dim pStep2 As New Panel
Dim pStep3 As New Panel
With pStep1
.ID = "pStep1"
.Html = "<h1>Welcome! Lets get started!</h1><p>Step 1 of 3</p>"
.Border = "false"
.Header = "false"
End With
With pStep2
.ID = "Step2"
.Html = "<h1>Card 2</h1><p>Step 2 of 3</p>"
.Border = False
.Header = False
End With
With pStep3
.ID = "Step3"
.Html = "<h1>Congratulations!</h1><p>Step 3 of 3 - Complete</p>"
.Border = "false"
.Header = "false"
End With
.Items.Add(pStep1)
.Items.Add(pStep2)
.Items.Add(pStep3)
With btnPrev
.ID = "btnPrev"
.Text = "Prev"
.Disabled = True
.Icon = Icon.PreviousGreen
'AddHandler .Click, AddressOf WizPrevClick
'<DirectEvents>
' <Click OnEvent="">
' <ExtraParams>
' <ext:Parameter Name="index" Value="#{WizardPanel}.items.indexOf(#{WizardPanel}.layout.activeItem)" Mode="Raw" />
' </ExtraParams>
' </Click>
'</DirectEvents>
End With
With btnNext
.ID = "btnNext"
.Text = "Next"
.Icon = Icon.NextGreen
'.Listeners.Click.Handler = "{var button = item;Ext.net.DirectMethods.WizNextClick(button,e);}"
'<DirectEvents>
' <Click OnEvent="Next_Click">
' <ExtraParams>
' <ext:Parameter Name="index" Value="#{WizardPanel}.items.indexOf(#{WizardPanel}.layout.activeItem)" Mode="Raw" />
' </ExtraParams>
End With
'.Items.Add(btnNext)
End With
Dim ev As New DirectEvent
With ev
Dim evpara1 As New Parameter
With evpara1
.Name = "index"
.Value = "#{" & pnlWiz.ID & "}.items.indexOf(#{" & pnlWiz.ID & "}.layout.activeItem)"
.Mode = ParameterMode.Raw
End With
.ExtraParams.Add(evpara1)
.EventName = "WizNextClick"
'btnNext.DirectEvents.Click.Event += ev
btnNext.DirectEvents.Click.ExtraParams.Add(evpara1)
End With
AddHandler btnNext.Click, AddressOf WizNextClick
.Items.Add(pnlWiz)
.Buttons.Add(btnPrev)
.Buttons.Add(btnNext)
.Render(MyDesktop)
.Show()
End With
End Sub
<Ext.Net.DirectMethod()> _
Protected Sub WizNextClick(ByVal sender As Object, ByVal e As DirectEventArgs)
Dim index As Int32 = Int32.Parse(e.ExtraParams("index"))
If ((index + 1) < sender.Items.Count) Then
sender.ActiveIndex = index + 1
End If
NextButtonText(index)
End Sub
<Ext.Net.DirectMethod()> _
Protected Sub WizPrevClick(ByVal sender As Object, ByVal e As DirectEventArgs)
Dim index As Int32 = Int32.Parse(e.ExtraParams("index"))
If ((index - 1) >= 0) Then
'wizStart.ActiveIndex = index - 1
End If
NextButtonText(index)
End Sub
Private Sub NextButtonText(ByVal index As Int32)
'If ((index + 1) >= wizStart.Items.Count - 1) Then
' btnNext.Text = "Finish"
'Else
' btnNext.Text = "Next"
'End If
End Sub
Private Sub Page_PreInit(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.PreInit
End Sub
End Class
HTML for form is as follows:<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Default.aspx.vb" Inherits="FormDemo._Default" %>
<%@ Import Namespace="Ext.Net.Utilities" %>
<%@ Register assembly="Ext.Net" namespace="Ext.Net" tagprefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<meta http-equiv="Page-Enter" content="RevealTrans(Duration=0,Transition=0)" />
<title>Demo Desktop</title>
<style type="text/css">
.start-button {
background-image: url(vista_start_button.gif) !important;
}
.shortcut-icon {
width: 48px;
height: 48px;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="window.png", sizingMethod="scale");
}
.icon-grid48 {
background-image: url(grid48x48.png) !important;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="grid48x48.png", sizingMethod="scale");
}
.icon-user48 {
background-image: url(user48x48.png) !important;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="user48x48.png", sizingMethod="scale");
}
.icon-window48 {
background-image: url(window48x48.png) !important;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="window48x48.png", sizingMethod="scale");
}
.icon-quote {
background-image: url(quote.png) !important;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="quote.png", sizingMethod="scale");
}
.desktopEl {
position: absolute !important;
}
</style>
<script src="scripts/jquery.min.js" type="text/javascript"></script>
<script src="scripts/jquery-ui.min.js" type="text/javascript"></script>
<script type="text/javascript">
var alignPanels = function () {
//pnlUser.getEl().alignTo(Ext.getBody(), "tr", [-505, 5], false)
};
var template = '<span style="color:{0};">{1}</span>';
var change = function (value) {
return String.format(template, (value > 0) ? "green" : "red", value);
};
var pctChange = function (value) {
return String.format(template, (value > 0) ? "green" : "red", value + "%");
};
var prepare = function (grid, toolbar, rowIndex, record) {
var firstButton = toolbar.items.get(0);
//you can return false to cancel toolbar for this record
};
var createDynamicWindow = function (app) {
var desk = app.getDesktop();
var w = desk.createWindow({
title: "Dynamic Web Browser",
width: 1000,
height: 600,
maximizable: true,
minimizable: true,
autoLoad: {
url: "http://www.stockmarketnigeria.com/forums",
mode: "iframe",
showMask: true
}
});
w.center();
w.show();
};
function linkClick(recordId) {
alert("Company: " + storeDummyPort.getById(recordId).get("company"));
}
function linkRenderer(value, meta, record) {
return String.format("<a class='company-link' href='#' onclick='linkClick(\"{1}\");'>{0}</a>", value, record.id);
}
</script>
<style type="text/css">
.menu-title
{
background: #ebeadb;
border-bottom: 1px solid #99bbe8;
color: #15428b;
font: bold 10px tahoma,arial,verdana,sans-serif;
display: block;
padding: 3px;
}
</style>
<style type="text/css">
.x-column-padding{
padding: 10px 0px 10px 10px;
}
.x-column-padding1{
padding: 10px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server">
<Listeners>
<DocumentReady Handler="alignPanels();" />
<WindowResize Handler="alignPanels();" />
</Listeners>
</ext:ResourceManager>
<div>
<ext:Desktop
ID="MyDesktop"
runat="server"
BackgroundColor="Gray"
ShortcutTextColor="White">
<StartButton Text="Start" IconCls="start-button" />
<%-- NOTE: Body Controls must be added to a container with position:absolute --%>
<Content>
</Content>
<Modules>
</Modules>
<Shortcuts>
<ext:DesktopShortcut ShortcutID="scTile" Text="Tile windows" IconCls="shortcut-icon icon-window48" X="{DX}-90" Y="{DY}-90" />
<ext:DesktopShortcut ShortcutID="scCascade" Text="Cascade windows" IconCls="shortcut-icon icon-window48" X="{DX}-90" Y="{DY}-170" />
</Shortcuts>
<Listeners>
</Listeners>
<StartMenu Width="400" Height="400" ToolsWidth="227" Title="Start Menu">
<Items>
<ext:MenuItem ID="MenuItem1" runat="server" Text="All" Icon="Folder" HideOnClick="false">
<Menu>
<ext:Menu ID="Menu1" runat="server">
<Items>
<ext:MenuItem Text="Web Browser" Icon="World" ID="ctl146">
<Listeners>
</Listeners>
</ext:MenuItem>
</Items>
</ext:Menu>
</Menu>
</ext:MenuItem>
</Items>
</StartMenu>
</ext:Desktop>
</div>
</form>
</body>
</html>
Last edited by Yemo; Jan 05, 2011 at 7:50 PM.