[dev] [commits] [Wiki] changed: Doc/Dev/HordeAjaxApplications/Example

[Jan Schneider]

Shouldn't we put this as an example right into Skeleton?

Zitat von Ralf Lang (B1 Systems GmbH) <lang at b1-systems.de>:

> rlang  Wed, 23 May 2018 06:24:59 +0000
>
> Modified page: https://wiki.horde.org/Doc/Dev/HordeAjaxApplications/Example
> New Revision:  5
> Change log:  Marc Unger's new howto
>
> @@ -1,4 +1,97 @@
> +++ Ajax Example using the skeleton App:
> +
> +This example uses the skeleton app to create an ajax function  
> "helloAjax". This function takes a string as argument and returns a  
> new string saying "Hello $string".
> +
> +1. Create the Ajax Handler Class:
> +- Create the Application folder:
> +# cd skeleton/lib/Ajax
> +# mkdir Application
> +
> +- Create a new file named "Handler.php" inside the  
> skeleton/lib/Ajax/Application folder.
> +The Handler.php will contain the Skeleton_Ajax_Application_Handler Class.
> +Add the following content to this file:
> +------
> +<code>
> +<?php
> +
> +class Skeleton_Ajax_Application_Handler extends  
> Horde_Core_Ajax_Application_Handler {
> +
> +    public function helloAjax() {
> +        $data = $this->vars->name;
> +        $answer = 'Hello ' . $data;
> +        return $answer;
> +    }
> +}
> +------
> +</code>
> +The argument of the helloAjax function is called "name".
> +To access the arguments you have to call  
> "$this->vars->NAME_OF_THE_ARGUMENT".
> +In this example we store the value of "name" in a variable $data:
> +$data = $this->vars->name;
> +Then we create a new string saying "Hello $data" and return this new string.
> +
> +2. Load the Skeleton_Ajax_Application_Handler Class:
> +Open the skeleton/lib/Ajax/Application.php file and add the  
> following line to the _init() function:
> +------
> +$this->addHandler('Skeleton_Ajax_Application_Handler');
> +------
> +
> +
> +3. Call the helloAjax function via javascript:
> +- Create the skeleton/js folder:
> +# cd skeleton
> +# mkdir js
> +
> +- Create the skeleton/js/skeleton.js file with the following content:
> +------
> +SkeletonCore = {
> +
> +    onDomLoad: function()
> +    {
> +        var myName = 'Foobar';
> +        HordeCore.doAction('helloAjax', {name:  
> Object.toJSON(myName)}, {callback: function(result) {
> +            console.log('Ajax answer: ' + result);
> +        }});
> +    }
> +
> +}
> +document.observe('dom:loaded', SkeletonCore.onDomLoad.bind(SkeletonCore));
> +------
> +
> +The "myName" variable holds the string we want to send to the  
> helloAjax funtion.
> +The helloAjax function is called by "HordeCore.doAction".
> +HordeCore.doAction takes three arguments:
> +1). Name of the Ajax function:
> +the helloAjax function we created in step 1.
> +
> +2). Argument list (in json format) of the Ajax function:
> +the "name" argument we accessed in step 1 via "$this->vars->name".
> +
> +3). A callback function to access the returned data of the Ajax function:
> +the "result" variable holds the "Hello $data" string we returned in step 1.
> +
> +Inside the callback we print the content of the "result" variable  
> (Hello foobar) to the browser console.
> +
> +
> +4. Load the skeleton.js file.
> +Open the skeleton/list.php file and add the following line after  
> "$page_output->addScriptFile('tables.js', 'horde');":
> +------
> +<code>
> +$page_output->addScriptFile('skeleton.js');
> +</code>
> +------
> +
> +5. Test if everything works:
> +Access the skeleton app in your browser and open the console. If  
> everything worked you'll see the following message: Ajax answer:  
> Hello Foobar
> +
> +
> +
> +++ Pre git split
> +
> +*This below is outdated information. Use the horde git-tool command  
> to create a new module*
> +
> +
>  Boneyard - an example of a dynamic "skeleton".
>
>  In this article, I will show you some minimal setup for a "horde5  
> dynamic view" application as demonstrated by hermes time tracking  
> and kronolith calendar



-- 
Jan Schneider
The Horde Project
https://www.horde.org/