diff options
Diffstat (limited to 'demos/quickstart/protected/pages/ActiveControls')
17 files changed, 428 insertions, 189 deletions
diff --git a/demos/quickstart/protected/pages/ActiveControls/ActiveButton.page b/demos/quickstart/protected/pages/ActiveControls/ActiveButton.page index d4167f6e..6385b658 100755 --- a/demos/quickstart/protected/pages/ActiveControls/ActiveButton.page +++ b/demos/quickstart/protected/pages/ActiveControls/ActiveButton.page @@ -24,70 +24,4 @@ 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>
</com:TContent>
diff --git a/demos/quickstart/protected/pages/ActiveControls/ActiveRatingList.page b/demos/quickstart/protected/pages/ActiveControls/ActiveRatingList.page new file mode 100644 index 00000000..7b6fb83d --- /dev/null +++ b/demos/quickstart/protected/pages/ActiveControls/ActiveRatingList.page @@ -0,0 +1,32 @@ +<com:TContent ID="body" > + +<h1>TActiveRatingList</h1> +<com:DocLink ClassPath="System.Web.UI.ActiveControls.TActiveRatingList" /> + +<p class="block-content"> +<tt>TActiveRatingList</tt> is the active counterpart to the original <tt>TRatingList</tt> control. +</p> + +<p class="block-content"> +The <tt>AutoPostBack</tt> property is set to true by default. +Thus, when a radio button is clicked a <tt>OnCallback</tt> event is +raised after <tt>OnSelectedIndexChanged</tt> event. +</p> + +<p class="block-content"> +With <tt>ActiveControl.EnableUpdate</tt> +set to true (default is true), changes to the selection will be updated +on the client side. +</p> + +<p class="block-content"> +List items can <b>not</b> be changed dynamically during a callback request. +</p> + +<p class="block-content"> +Please refer to the original documentation of <a href="?page=Controls.List">TRatingList</a> for usage. +</p> + +<com:RunBar PagePath="ActiveControls.Samples.TActiveRatingList.Home" /> + +</com:TContent> diff --git a/demos/quickstart/protected/pages/ActiveControls/Home.page b/demos/quickstart/protected/pages/ActiveControls/Home.page index 9586f421..25590089 100755 --- a/demos/quickstart/protected/pages/ActiveControls/Home.page +++ b/demos/quickstart/protected/pages/ActiveControls/Home.page @@ -1,15 +1,8 @@ <com:TContent ID="body" >
<h1 id="128031">Active Controls (AJAX enabled Controls)</h1>
-<p id="640423" class="block-content">See the <a href="?page=ActiveControls.Introduction">Introduction</a>
+<p id="640423" class="block-content">
+Active controls extends standard PRADO controls adding the ability to automatically update themselves on callbacks without the need of ad-hoc javascript calls. See the <a href="?page=ActiveControls.Introduction">Introduction</a>
for a quick overview of the concept behind active controls (AJAX enabled controls).
-Most active controls have a property of
-<a href="?page=ActiveControls.BaseActiveControl">ActiveControl</a> and
-a sub-property <a href="?page=ActiveControls.CallbackClientSide">ClientSide</a>
-that provides many properties to customize the controls. The
-<a href="?page=TCallbackClientScript">CallbackClient</a> property of the
-<tt>TPage</tt> class provides many methods to update and alter the client-side content
-during a callback request. Active controls is reliant on a collection
-of <a href="?page=ActiveControl.ClientSideJavascript">javascript classes</a>.
</p>
<p id="640424" class="block-content">For a quick demo of active controls, try the <a href="?page=ActiveControls.ActiveButton">
@@ -104,11 +97,6 @@ TActiveButton</a> control. See also the later part of the <a href="?page=Tutoria </li>
<li>
- <a href="">TActiveRatingList</a>
- is an EXPERIMENTAL class that displays clickable images that represent a TRadioButtonList.
- </li>
-
- <li>
<a href="?page=ActiveControls.ActiveTextBox">TActiveTextBox</a>
represents a text input field on a Web page.
It can collect single-line, multi-line or password text input from users.
@@ -144,6 +132,11 @@ TActiveButton</a> control. See also the later part of the <a href="?page=Tutoria TActiveRadioButtonList displays a group of radiobuttons. Each radio button
can perform a callback request.
</li>
+
+ <li>
+ <a href="?page=ActiveControls.ActiveRatingList">TActiveRatingList</a>
+ is an EXPERIMENTAL class that displays clickable images that represent a TRadioButtonList.
+ </li>
</ul>
<h2 id="134001">Active Data Controls</h2>
@@ -201,9 +194,9 @@ TActiveButton</a> control. See also the later part of the <a href="?page=Tutoria monitors (using a timer) an attribute of an HTML element and triggers a callback request
when the attribute value changes.
</li>
-
+
<li>
- <a href="?page=ActiveControls.DragDrop">TDropContainer & TDraggable</a> represents drag and drop containers.
+ <a href="?page=ActiveControls.DragDrop">TDropContainer & TDraggable</a> represents drag and drop containers.
The former will make its child controls "draggable" while the latter will raise a callback when a draggable
control is dropped on it.
</li>
@@ -357,7 +350,7 @@ if Javascript was disabled on the client's browser.</p> </td>
<td>Yes</td><td>No</td>
</tr>
-
+
<tr><td>
<a href="?page=ActiveControls.DragDrop">TDropContainer</a>
</td>
@@ -370,95 +363,7 @@ if Javascript was disabled on the client's browser.</p> <td>No</td><td>No</td>
</tr>
-
-</table>
-
-<h2 id="128036">Active Control Basic Infrastructure Classes</h2>
-<p id="640427" class="block-content">The following classes provide the basic infrastructure classes required to
-realize the active controls. They can be useful to develop new active controls, but Prado users tipically don't need
-to use them.</p>
-<ul id="u4" class="block-content">
- <li>
- <h3 id="190038">TActiveControlAdapter</h3>
- <com:DocLink ClassPath="System.Web.UI.ActiveControls.TActiveControlAdapter" />
- <p class="block-content">
- <tt>TActiveControlAdapter</tt> customizes the parent TControl class for active control classes.
- It tracks changes in the viewstate values of the control and update
- differences of the client-side HTML element attributes.
- </p>
- </li>
-
- <li>
- <h3 id="190039">TActiveListControlAdapter</h3>
- <com:DocLink ClassPath="System.Web.UI.ActiveControls.TActiveListControlAdapter" />
- <p class="block-content">
- <tt>TActiveListControlAdapter</tt> allows the adapted list controls to change the selections
- on the client-side during a callback request.
- </p>
- </li>
-
- <li>
- <h3 id="190040">TActivePageAdapter</h3>
- <com:DocLink ClassPath="System.Web.UI.ActiveControls.TActivePageAdapter" />
- <p class="block-content">
- <tt>TActivePageAdapter</tt> process the page life-cycle for callback requests.
- </p>
- </li>
-
- <li>
- <h3 id="190041">TBaseActiveControl</h3>
- <com:DocLink ClassPath="System.Web.UI.ActiveControls.TBaseActiveControl" />
- <p class="block-content">
- <tt>TBaseActiveControl</tt> class provided additional basic properties common for every
- active control. An instance of <tt>TBaseActiveControl</tt> or its decendent
- <tt>TBaseActiveCallbackControl</tt> is created by <tt>TActiveControlAdapter::getBaseActiveControl()</tt>
- method.
- The <tt>EnableUpdate</tt> property determines wether the active
- control is allowed to update the contents of the client-side when the callback
- response returns.
- </p>
- </li>
-
- <li>
- <h3 id="190042">TCallbackResponseAdapter</h3>
- <com:DocLink ClassPath="System.Web.UI.ActiveControls.TCallbackResponseAdapter" />
- <p class="block-content">
- <tt>TCallbackResponseAdapter</tt> alters the <tt>THttpResponse</tt>'s outputs.
- A <tt>TCallbackResponseWriter</tt> is used instead of the <tt>TTextWrite</tt> when
- <tt>createHtmlWriter</tt> is called. Each call to createHtmlWriter will create
- a new <tt>TCallbackResponseWriter</tt>. When <tt>flushContent()</tt> is called each
- instance of <tt>TCallbackResponseWriter</tt>'s content is flushed.
- The callback response data can be set using the <tt>ResponseData</tt> property.
- </p>
- </li>
-
-</ul>
-
-<h2 id="190037">Active Control Infrastructure Advanced Classes</h2>
-<p class="block-content">The following classes provide advanced properties and events needed to realize the active controls.
-A Prado user can use them to customize active controls behaviour and interact directly with the client side during a callback.
-</p>
-<ul class="block-content">
- <li>
- <a href="?page=ActiveControls.CallbackClientScript">TCallbackClientScript</a>
- methods to manipulate the client-side HTML elements, also includes methods
- to invoke javascript Effects on HTML elements.
- </li>
- <li>
- <a href="?page=ActiveControls.CallbackClientSide">TCallbackClientSide</a>
- is used to specify client-side callback request options and client-side event handlers.
- </li>
-
- <li>
- <a href="?page=ActiveControls.CallbackEventParameter">TCallbackEventParameter</a>
- provides the parameter passed during the callback request.
- </li>
-
- <li>
- <a href="?page=ActiveControls.CallbackOptions">TCallbackOptions</a>
- allows a common set of callback client-side options to be attached to one or more active controls.
- </li>
-</ul>
+</table>
</com:TContent>
diff --git a/demos/quickstart/protected/pages/ActiveControls/Introduction.page b/demos/quickstart/protected/pages/ActiveControls/Introduction.page index 70cb9cbf..edc0b5bc 100755 --- a/demos/quickstart/protected/pages/ActiveControls/Introduction.page +++ b/demos/quickstart/protected/pages/ActiveControls/Introduction.page @@ -1,7 +1,204 @@ <com:TContent ID="body">
-<h1 id="130037">Overview of Active Controls</h1>
-
-TODO:
+<h1 id="130037">AJAX: Introduction</h1>
+<p class="block-content">
+A classic webpage can only transfer data back to the server using an http postback request that requires a full page reload. This is a problem for web applications, since a synchronous page reload breaks the user interaction: the user must wait for the response to arrive and the page will lose its current status (the scrolling position, the currently focused control, etc..).
+</p>
<img src=<%~ postback-callback.png %> class="figure" />
+<p class="block-content">
+A common solution to this problem is the use of AJAX (Asynchronous JavaScript and XML) callbacks. After the first full page load, the web application can make subsequents requests using javascript. The callback requests are asynchronous, so the user can continue to interact with the page while the response is loading. The response contains a list of changes that will be applied to the page "on the fly", like replacing existing elements with new content or add some css style to an existing element.
+</p>
+
+<h2>Interacting with a page on callback</h2>
+
+<p class="block-content">
+PRADO has builtin support for AJAX callbacks in the form of <i>Active Controls</i>. These controls can trigger a callback request and have their properties (value, css style, attributes, ..) updated during a callback.
+Before digging inside the list of Active Controls, it's good to have a look to how a page can be aware if the current request is a callback and how to interact with the page rendered on the client browser.
+<br/>
+The <tt>IsCallBack</tt> property of the <tt>TPage</tt> class exposes whether the current request being handled is the consequence of a callback, and the <a href="?page=ActiveControls.CallbackClientScript">CallbackClient</a> property provides many methods to update and alter the client-side content during a callback request.
+</p>
+
+<com:TTextHighlighter CssClass="source block-content">
+public function onClick($sender, $param)
+{
+ if($this->IsCallback)
+ {
+ $this->getCallbackClient()->hide($this->TextBox1);
+ }
+}
+</com:TTextHighlighter>
+
+<h1>Active Controls (AJAX enabled Controls)</h1>
+<p class="block-content">
+Active controls extends standard PRADO controls adding the ability to automatically update themselves on callbacks without the need of ad-hoc javascript calls. Active controls are reliant on a collection of javascript classes that gets added to the page automatically when needed.
+</p>
+
+<p class="block-content">
+Most active controls have a <tt>ActiveControl.EnableUpdate</tt> property that determines whether the active control is allowed to update the contents of the client-side when the callback response returns. Depending on the control different properties can be updated.
+</p>
+
+<p class="block-content">
+Some active controls can trigger a callback as a consequence of a clientside event (a button click, a checkbox being checked, a DOM event). The callback will first raise the normal serverside event associated to the control (eg: OnClick for a <tt>TButton</tt> or OnSelectedIndexChanged for a <tt>TRadioButtonList</tt>) and then the <tt>OnCallBack</tt> event.
+The <tt>AutoPostBack</tt> property typically defaults to true for these controls.
+</p>
+</p>
+
+<p class="block-content">
+Active controls have a <a href="?page=ActiveControls.CallbackClientSide">ClientSide</a> property that provides many subproperties to customize the controls and to hook some javascript code to the callback lifecycle, like showing a "Loading" logo at the start of a callback and hide it at the end.
+</p>
+
+<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>
+
+<h2 id="128036">Active Control Basic Infrastructure Classes</h2>
+<p id="640427" class="block-content">The following classes provide the basic infrastructure classes required to
+realize the active controls. They can be useful to develop new active controls, but Prado users tipically don't need
+to use them.</p>
+<ul id="u4" class="block-content">
+ <li>
+ <h3 id="190038">TActiveControlAdapter</h3>
+ <com:DocLink ClassPath="System.Web.UI.ActiveControls.TActiveControlAdapter" />
+ <p class="block-content">
+ <tt>TActiveControlAdapter</tt> customizes the parent TControl class for active control classes.
+ It tracks changes in the viewstate values of the control and update
+ differences of the client-side HTML element attributes.
+ </p>
+ </li>
+
+ <li>
+ <h3 id="190039">TActiveListControlAdapter</h3>
+ <com:DocLink ClassPath="System.Web.UI.ActiveControls.TActiveListControlAdapter" />
+ <p class="block-content">
+ <tt>TActiveListControlAdapter</tt> allows the adapted list controls to change the selections
+ on the client-side during a callback request.
+ </p>
+ </li>
+
+ <li>
+ <h3 id="190040">TActivePageAdapter</h3>
+ <com:DocLink ClassPath="System.Web.UI.ActiveControls.TActivePageAdapter" />
+ <p class="block-content">
+ <tt>TActivePageAdapter</tt> process the page life-cycle for callback requests.
+ </p>
+ </li>
+
+ <li>
+ <h3 id="190041">TBaseActiveControl</h3>
+ <com:DocLink ClassPath="System.Web.UI.ActiveControls.TBaseActiveControl" />
+ <p class="block-content">
+ <tt>TBaseActiveControl</tt> class provided additional basic properties common for every
+ active control. An instance of <tt>TBaseActiveControl</tt> or its decendent
+ <tt>TBaseActiveCallbackControl</tt> is created by <tt>TActiveControlAdapter::getBaseActiveControl()</tt>
+ method.
+ The <tt>EnableUpdate</tt> property determines wether the active
+ control is allowed to update the contents of the client-side when the callback
+ response returns.
+ </p>
+ </li>
+
+ <li>
+ <h3 id="190042">TCallbackResponseAdapter</h3>
+ <com:DocLink ClassPath="System.Web.UI.ActiveControls.TCallbackResponseAdapter" />
+ <p class="block-content">
+ <tt>TCallbackResponseAdapter</tt> alters the <tt>THttpResponse</tt>'s outputs.
+ A <tt>TCallbackResponseWriter</tt> is used instead of the <tt>TTextWrite</tt> when
+ <tt>createHtmlWriter</tt> is called. Each call to createHtmlWriter will create
+ a new <tt>TCallbackResponseWriter</tt>. When <tt>flushContent()</tt> is called each
+ instance of <tt>TCallbackResponseWriter</tt>'s content is flushed.
+ The callback response data can be set using the <tt>ResponseData</tt> property.
+ </p>
+ </li>
+
+</ul>
+
+<h2 id="190037">Active Control Infrastructure Advanced Classes</h2>
+<p class="block-content">The following classes provide advanced properties and events needed to realize the active controls.
+A Prado user can use them to customize active controls behaviour and interact directly with the client side during a callback.
+</p>
+<ul class="block-content">
+ <li>
+ <a href="?page=ActiveControls.CallbackClientScript">TCallbackClientScript</a>
+ methods to manipulate the client-side HTML elements, also includes methods
+ to invoke javascript Effects on HTML elements.
+ </li>
+
+ <li>
+ <a href="?page=ActiveControls.CallbackClientSide">TCallbackClientSide</a>
+ is used to specify client-side callback request options and client-side event handlers.
+ </li>
+
+ <li>
+ <a href="?page=ActiveControls.CallbackEventParameter">TCallbackEventParameter</a>
+ provides the parameter passed during the callback request.
+ </li>
+
+ <li>
+ <a href="?page=ActiveControls.CallbackOptions">TCallbackOptions</a>
+ allows a common set of callback client-side options to be attached to one or more active controls.
+ </li>
+</ul>
</com:TContent>
diff --git a/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveButton/Home.page b/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveButton/Home.page index 1e030102..8482ae14 100755 --- a/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveButton/Home.page +++ b/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveButton/Home.page @@ -43,5 +43,4 @@ A button causing validation with <tt>OnCallback</tt>: </table>
-<com:TJavascriptLogger />
</com:TContent>
diff --git a/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveCheckBox/Home.page b/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveCheckBox/Home.page index 139306f6..89543ef0 100755 --- a/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveCheckBox/Home.page +++ b/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveCheckBox/Home.page @@ -71,6 +71,5 @@ A checkbox validated by a required field validator: </table>
-<com:TJavascriptLogger />
</com:TContent>
diff --git a/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveCustomValidator/Home.page b/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveCustomValidator/Home.page index 8ef69a9a..1d16235e 100755 --- a/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveCustomValidator/Home.page +++ b/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveCustomValidator/Home.page @@ -16,6 +16,5 @@ Custom validator using callbacks: </td></tr>
</table>
-<com:TJavascriptLogger />
</com:TContent>
diff --git a/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveHyperLink/Home.page b/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveHyperLink/Home.page index a3f10613..a7767e2d 100755 --- a/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveHyperLink/Home.page +++ b/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveHyperLink/Home.page @@ -66,5 +66,4 @@ Body contents </tr>
</table>
-<com:TJavascriptLogger />
</com:TContent>
diff --git a/demos/quickstart/protected/pages/ActiveControls/Samples/TActivePager/Home.page b/demos/quickstart/protected/pages/ActiveControls/Samples/TActivePager/Home.page index 79a4f540..57e08e1c 100755 --- a/demos/quickstart/protected/pages/ActiveControls/Samples/TActivePager/Home.page +++ b/demos/quickstart/protected/pages/ActiveControls/Samples/TActivePager/Home.page @@ -99,5 +99,4 @@ Choose page: jQuery('#wait').hide() </prop:ClientSide.OnComplete> </com:TActivePager> -<com:TJavascriptLogger/> </com:TContent> diff --git a/demos/quickstart/protected/pages/ActiveControls/Samples/TActivePanel/Home.page b/demos/quickstart/protected/pages/ActiveControls/Samples/TActivePanel/Home.page index 360b6b0f..f3bfe843 100755 --- a/demos/quickstart/protected/pages/ActiveControls/Samples/TActivePanel/Home.page +++ b/demos/quickstart/protected/pages/ActiveControls/Samples/TActivePanel/Home.page @@ -20,5 +20,4 @@ anyway since they are placed inside the active panel. </com:TActivePanel>
</td></tr>
</table>
-<com:TJavascriptLogger />
</com:TContent>
diff --git a/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveRatingList/Home.page b/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveRatingList/Home.page new file mode 100644 index 00000000..332ccb63 --- /dev/null +++ b/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveRatingList/Home.page @@ -0,0 +1,71 @@ +<com:TContent ID="body"> +<h1>TActiveRatingList Samples</h1> + +<table class="sampletable"> + +<tr><td class="samplenote"> +A simple TActiveRatingList and its caption: +</td><td class="sampleaction"> + +<com:TLabel ID="label1" Text="Rate it:" /> +<com:TActiveRatingList CaptionID="label1"> + <com:TListItem Text="Fair" /> + <com:TListItem Text="Average" /> + <com:TListItem Text="Good" /> + <com:TListItem Text="Excellent" /> +</com:TActiveRatingList> + +</td></tr> + +<tr><td class="samplenote"> +TActiveRatingList in vertical mode, SelectedIndex=2 +</td><td class="sampleaction"> + +<com:TLabel ID="label2" Text="Rate it:" /> +<com:TActiveRatingList CaptionID="label2" SelectedIndex="2" RepeatDirection="Vertical" Style="caption-side: right;"> + <com:TListItem Text="Poor" /> + <com:TListItem Text="Fair" /> + <com:TListItem Text="Average" /> + <com:TListItem Text="Good" /> + <com:TListItem Text="Excellent" /> + <com:TListItem Text="Super" /> +</com:TActiveRatingList> + +</td></tr> + +<tr><td class="samplenote"> +TActiveRatingList with RatingStyle=blocks, AutoPostback=true, SelectedValue=Good +</td><td class="sampleaction"> + +<com:TLabel ID="label3" Text="Rate it:" /> +<com:TActiveRatingList ID="Rating3" CaptionID="label3" RatingStyle="blocks" SelectedValue="Good" AutoPostBack="true" OnSelectedIndexChanged="rating3_selectionChanged"> + <com:TListItem Text="Poor" /> + <com:TListItem Text="Fair" /> + <com:TListItem Text="Average" /> + <com:TListItem Text="Good" /> + <com:TListItem Text="Excellent" /> + <com:TListItem Text="Super" /> +</com:TActiveRatingList> +<br/> +A label to check callback results: <com:TActiveLabel ID="labelResult3" /> + +</td></tr> + +<tr><td class="samplenote"> +TActiveRatingList with AllowInput=false, Rating=4.6 +</td><td class="sampleaction"> + +<com:TLabel ID="label4" Text="Rate it:" /> +<com:TActiveRatingList CaptionID="label4" AllowInput="false" Rating="4.6"> + <com:TListItem Text="Poor" /> + <com:TListItem Text="Fair" /> + <com:TListItem Text="Average" /> + <com:TListItem Text="Good" /> + <com:TListItem Text="Excellent" /> + <com:TListItem Text="Super" /> +</com:TActiveRatingList> + +</td></tr> + +</table> +</com:TContent>
\ No newline at end of file diff --git a/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveRatingList/Home.php b/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveRatingList/Home.php new file mode 100644 index 00000000..5e8ed1bd --- /dev/null +++ b/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveRatingList/Home.php @@ -0,0 +1,9 @@ +<?php + +class Home extends TPage +{ + protected function rating3_selectionChanged($sender, $param) + { + $this->labelResult3->Text=$this->Rating3->SelectedValue; + } +}
\ No newline at end of file diff --git a/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveTableRow/Home.page b/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveTableRow/Home.page index 0b3f84fb..49b5bcb6 100755 --- a/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveTableRow/Home.page +++ b/demos/quickstart/protected/pages/ActiveControls/Samples/TActiveTableRow/Home.page @@ -14,6 +14,5 @@ </com:TTable>
<com:TActiveLabel id="lblResult"/>
-<com:TJavascriptLogger />
</com:TContent>
diff --git a/demos/quickstart/protected/pages/ActiveControls/Samples/TCallbackClientScript/Home.page b/demos/quickstart/protected/pages/ActiveControls/Samples/TCallbackClientScript/Home.page index 539909a9..84521acb 100755 --- a/demos/quickstart/protected/pages/ActiveControls/Samples/TCallbackClientScript/Home.page +++ b/demos/quickstart/protected/pages/ActiveControls/Samples/TCallbackClientScript/Home.page @@ -7,12 +7,37 @@ </p>
<h2>Actions</h2>
-<com:TRadioButtonList ID="radio1">
+<com:TClientScript PradoScripts="jqueryui" />
+<com:TStyleSheet>
+ .red_background {
+ background-color: red;
+ }
+</com:TStyleSheet>
+
+<com:TRadioButtonList ID="radio1" RepeatColumns="2">
<com:TListItem Value="1" Text="alert() me of something" />
<com:TListItem Value="2" Text="toggle Checkbox 1" />
<com:TListItem Value="3" Text="hide Label 1" />
<com:TListItem Value="4" Text="show Label 1" />
- <com:TListItem Value="5" Text="focus TextBox 1" />
+ <com:TListItem Value="5" Text="toggle Label 1 visibility" />
+ <com:TListItem Value="6" Text="toggle Label 1 (fade)" />
+ <com:TListItem Value="7" Text="toggle Label 1 (slide)" />
+ <com:TListItem Value="8" Text="highlight Label 1 (requires jQuery UI)" />
+ <com:TListItem Value="9" Text="focus TextBox 1" />
+ <com:TListItem Value="10" Text="scroll to CheckBox 1" />
+ <com:TListItem Value="11" Text="add red_background class to TextBox 1" />
+ <com:TListItem Value="12" Text="remove red_background class from TextBox 1" />
+ <com:TListItem Value="13" Text="animated resize TextBox 1" />
+ <com:TListItem Value="14" Text="set the 'disable' attribute on TextBox 1" />
+ <com:TListItem Value="15" Text="change the background color of Panel 1" />
+ <com:TListItem Value="16" Text="prepend and append some content inside Panel 1" />
+ <com:TListItem Value="17" Text="prepend and append some content outside Panel 1" />
+ <com:TListItem Value="18" Text="replace Panel 1 with some plain text" />
+ <com:TListItem Value="19" Text="remove TextBox 1" />
+ <com:TListItem Value="20" Text="fade out TextBox 1" />
+ <com:TListItem Value="21" Text="fade in TextBox 1" />
+ <com:TListItem Value="22" Text="trigger a click event on Panel 1" />
+ <com:TListItem Value="23" Text="call a specific effect on TextBox 1 (toggle)" />
</com:TRadioButtonList>
<br/><com:TActiveButton ID="button1" OnCallback="buttonCallback" Text="callback!" />
@@ -32,8 +57,17 @@ <td>TextBox 1:</td>
<td><com:TTextBox ID="txt1" Text="Sample text" /></td>
</tr>
+ <tr>
+ <td>Panel 1:</td>
+ <td>
+ <com:TPanel ID="pan1" Style="width:100px;height:100px;background:green" Attributes.OnClick="alert('clicked on Panel1')" >
+ Panel contents
+ </com:TPanel>
+ </td>
+ </tr>
</table>
-<com:TJavascriptLogger />
-
+<div style="height:900px">
+Thw following space is intentionally left blank for the scrolling test
+</div>
</com:TContent>
diff --git a/demos/quickstart/protected/pages/ActiveControls/Samples/TCallbackClientScript/Home.php b/demos/quickstart/protected/pages/ActiveControls/Samples/TCallbackClientScript/Home.php index eeacb660..50a69911 100755 --- a/demos/quickstart/protected/pages/ActiveControls/Samples/TCallbackClientScript/Home.php +++ b/demos/quickstart/protected/pages/ActiveControls/Samples/TCallbackClientScript/Home.php @@ -8,7 +8,7 @@ class Home extends TPage switch($this->radio1->SelectedValue) { case 1: - $this->getCallbackClient()->evaluateScript("<script> alert('something'); </script>"); + $this->getCallbackClient()->evaluateScript("alert('something');"); break; case 2: $this->getCallbackClient()->check($this->check1, !$this->check1->Checked); @@ -20,8 +20,74 @@ class Home extends TPage $this->getCallbackClient()->show($this->label1); break; case 5: + $this->getCallbackClient()->toggle($this->label1); + break; + case 6: + $this->getCallbackClient()->toggle($this->label1, 'fade'); + break; + case 7: + $this->getCallbackClient()->toggle($this->label1, 'slide'); + break; + case 8: + $this->getCallbackClient()->highlight($this->label1); + break; + case 9: $this->getCallbackClient()->focus($this->txt1); break; + case 10: + $this->getCallbackClient()->scrollTo($this->check1, array('duration' => 1000, 'offset' => 10)); + break; + case 11: + $this->getCallbackClient()->addCssClass($this->txt1, 'red_background'); + break; + case 12: + $this->getCallbackClient()->removeCssClass($this->txt1, 'red_background'); + break; + case 13: + $this->getCallbackClient()->jQuery($this->txt1, 'animate', array( + array( 'width' => '+=100', + 'height' => '+=50' + ), + array( + 'duration' => 1000, + ) + )); + break; + case 14: + $this->getCallbackClient()->setAttribute($this->txt1, 'disabled', true); + break; + case 15: + $this->getCallbackClient()->setStyle($this->pan1, array('background-color' => 'blue')); + break; + case 16: + $this->getCallbackClient()->prependContent($this->pan1, 'prepend<br/>'); + $this->getCallbackClient()->appendContent($this->pan1, '<br/>append'); + break; + case 17: + $this->getCallbackClient()->insertContentBefore($this->pan1, 'before'); + $this->getCallbackClient()->insertContentAfter($this->pan1, 'after'); + break; + case 18: + $this->getCallbackClient()->replaceContent($this->pan1, 'No more Panel 1'); + break; + case 19: + $this->getCallbackClient()->remove($this->txt1); + break; + case 20: + $this->getCallbackClient()->fadeOut($this->txt1); + break; + case 21: + $this->getCallbackClient()->fadeIn($this->txt1); + break; + case 22: + $this->getCallbackClient()->click($this->pan1); + // alternative + // $this->getCallbackClient()->raiseClientEvent($this->pan1, 'click'); + break; + case 23: + $this->getCallbackClient()->jQuery($this->txt1, 'toggle'); + break; + } } } diff --git a/demos/quickstart/protected/pages/ActiveControls/Samples/TCallbackClientSide/Home.page b/demos/quickstart/protected/pages/ActiveControls/Samples/TCallbackClientSide/Home.page index 0d13bb90..0f94fd79 100755 --- a/demos/quickstart/protected/pages/ActiveControls/Samples/TCallbackClientSide/Home.page +++ b/demos/quickstart/protected/pages/ActiveControls/Samples/TCallbackClientSide/Home.page @@ -68,6 +68,5 @@ connection error has occured. </table>
-<com:TJavascriptLogger />
</com:TContent>
diff --git a/demos/quickstart/protected/pages/ActiveControls/Samples/TCallbackOptions/Home.page b/demos/quickstart/protected/pages/ActiveControls/Samples/TCallbackOptions/Home.page index cfb041ea..8c6ccd02 100755 --- a/demos/quickstart/protected/pages/ActiveControls/Samples/TCallbackOptions/Home.page +++ b/demos/quickstart/protected/pages/ActiveControls/Samples/TCallbackOptions/Home.page @@ -72,6 +72,5 @@ The same TCallbackOptions can be shared among different controls, even of differ </td></tr>
</table>
-<com:TJavascriptLogger />
</com:TContent>
|