Subversion-Projekte lars-tiefland.prado

<com:TContent ID="body">

<!-- $Id: ActiveButton.page 1817 2007-03-31 23:36:00Z wei $ -->

<h1 id="122026">TActiveButton</h1>

<com:DocLink ClassPath="System.Web.UI.ActiveControls.TActiveButton" />

<p id="610410" class="block-content"><tt>TActiveButton</tt> is the active control counter part to

<a href="?page=Controls.Button">TButton</a>.

When a <tt>TActiveButton</tt> is clicked, rather than a normal post back request a

callback request is initiated. The <tt>OnCallback</tt> event is raised

during a callback request and it is raise <strong>after</strong>

the <tt>OnClick</tt> event.

</p>

<p id="610411" class="block-content">When the <tt>ActiveControl.EnableUpdate</tt> property is true,

changing the <tt>Text</tt> property during a callback request will update

the button's caption on the client-side.</p>

<p id="610412" class="block-content">Since the <tt>OnCallback</tt> event is raised only during a callback request,

the <tt>OnCallback</tt> event handler can be used to handle logic specifically

related to callback requests. The <tt>OnClick</tt> event handler is raised

when ever the button is clicked, even if javascript is disabled.</p>

<p id="610413" class="block-content">The following example the use of both the <tt>OnClick</tt> and <tt>OnCallback</tt>

events of an <tt>TActiveButton</tt>.</p>

<com:RunBar PagePath="ActiveControls.Samples.TActiveButton.Home" />

<h2 id="122027">TActiveButton Class Diagram</h2>

<p id="610414" class="block-content">The class diagram for <tt>TActiveButton</tt> is illustrated in the figure below.

Most active control that can perform callback request have a similar structure.

</p>

<img src=<%~ TActiveButtonClass.png %> class="figure"

	alt="TActiveButton class diagram" title="TActiveButton class diagram" />

<p id="610415" class="block-content"><tt>TActiveButton</tt> is an extension of <a href="?page=Controls.Button">TButton</a>

and implements two additional interfaces <tt>ICallbackEventHandler</tt> and

<tt>IActiveControl</tt>. The <tt>TActiveButton</tt> contains an instance of

<a href="?page=ActiveControls.BaseActiveControl">TBaseActiveCallbackControl</a>

available through the <tt>ActiveControl</tt> property of <tt>TActiveButton</tt>.

The following example set the callback parameter of the <tt>TActiveButton</tt> when

a callback request is dispatched.

</p>

<com:TTextHighlighter Language="prado" CssClass="source block-content" id="code1">

<com:TActiveButton

	Text="Click Me"

	OnCallback="button_callback"

	ActiveControl.CallbackParameter="value" />

</com:TTextHighlighter>

<p id="610416" class="block-content">In the <tt>OnCallback</tt> event handler method, the <tt>CallbackParameter</tt>

is available in the <tt>$param</tt> object.</p>

<com:TTextHighlighter Language="php" CssClass="source block-content" id="code2">

public function button_callback($sender, $param)

{

	echo $param->CallbackParameter; //outputs "value"

}

</com:TTextHighlighter>

<h2 id="122028">Adding Client Side Behaviour</h2>

<p id="610417" class="block-content">With in the <tt>ActiveControl</tt> property is an instance of

<a href="?page=ActiveControls.CallbackClientSide">TCallbackClientSide</a> available

as a property <tt>ClientSide</tt> of <tt>TActiveButton</tt>.

The <tt>ClientSide</tt> property contains sub-properties, such as <tt>RequestTimeOut</tt>,

and client-side javascript event handler, such as <tt>OnLoading</tt>,

that are used by the client-side when making a callback request.

The following example demonstrates the toggling of a "loading" indicator

when the client-side is making a callback request.

</p>

<com:TTextHighlighter Language="prado" CssClass="source block-content" id="code3">

<com:TClientScript PradoScripts="effects" />

<span id="callback_status">Loading...</span>

<com:TActiveButton

	Text="Click Me"

	OnCallback="button_callback"

	ActiveControl.CallbackParameter="value" >

	<prop:ClientSide

		OnLoading="Element.show('callback_status')"

		OnComplete="Element.hide('callback_status')" />

</com:TActiveButton>

</com:TTextHighlighter>

<p id="610418" class="block-content">The example loads the "effects" javascript library using the

<a href="?page=Controls.ClientScript">TClientScript</a> component.

The <tt>ClientSide.OnLoading</tt> property value contains

javascript statement that uses the "effects" library to show the "Loading..."

span tag. Similarly, <tt>ClientSide.OnComplete</tt> property

value contains the javascript statement that hides the "Loading..." span tag.

See <a href="?page=ActiveControls.CallbackClientSide">TCallbackClientSide</a> for

further details on client-side property details.

</p>

<div class="last-modified">$Id: ActiveButton.page 1817 2007-03-31 23:36:00Z wei $</div></com:TContent>