Ayuda Mercury TWeb y TWebBrowse

mod_harbour es un módulo para Apache que permite correr tus PRGs directamente en la web!!!

Ayuda Mercury TWeb y TWebBrowse

Postby RSalazarU » Wed Apr 14, 2021 8:51 pm

Para Carles,

Carles, estimado amigo.

En base al ejemplo, con bootstrap, de mercury estoy armando mi aplicacion. Pero no logro mostrar el Browse.

El ejemplo de tweb:

http://localhost/tweb/browse

funciona perfecto.

Ahora bien, copie "practicamente" todo el codigo del ejemplo (browse.prg) y tengo un archivo .view:

Code: Select all  Expand view  RUN

<!-- Page Content  -->
<div id="content">

    {{ View( 'content_btn.view' ) }}

    <h2>Users</h2>

    <?prg
    #include {{ TWebInclude() }}
    //#include {% TWebInclude() %}

    //function main()
        local o, oCol, oBrw
        local aRows := {}
       
        Aadd( aRows, { 'id' => 1, 'name' => 'Charly Aubia', 'abr' => 'CA' } )
        Aadd( aRows, { 'id' => 2, 'name' => 'Maria de la O', 'abr' => 'MO'  } )
        Aadd( aRows, { 'id' => 3, 'name' => 'John Kocinsky', 'abr' => 'JK'  } ) 
   
        DEFINE WEB oWeb TITLE 'Basic Browse' TABLES INIT
       
        DEFINE FORM o
   
            HTML o INLINE '<h3>Basic Browse</h3><hr>'
           
        INIT FORM o            
   
            DEFINE BROWSE oBrw ID 'ringo' HEIGHT 400 OF o
   
                ADD oCol TO oBrw ID 'id'    HEADER 'Id.'
                ADD oCol TO oBrw ID 'name'  HEADER 'Name'                  
                //ADD oCol TO oBrw ID 'abr' HEADER 'abr'                   
   
            INIT BROWSE oBrw DATA aRows 
   
    END FORM o RETURN   
    //retu nil
    ?>
</div>
 


y no muestra el browse.

en la pestaña consola del impector de la pagina web me muestra:
tweb.js:900 Uncaught TypeError: oBrowse.bootstrapTable is not a function
at new TWebBrowse (tweb.js:900)
at usrbrowse:249


tambien tengo el resultado de tweb:
<script>
var _ringo = new TWebBrowse( "ringo", null, false );
_ringo.SetCfgCols( JSON.parse( '{"id":{"id":"id","head":"Id.","width":"","sortable":false,"align":"","formatter":"","class":"","edit":false,"edit_type":"C","edit_with":"","edit_escape":false,"class_event":""},"name":{"id":"name","head":"Name","width":"","sortable":false,"align":"","formatter":"","class":"","edit":false,"edit_type":"C","edit_with":"","edit_escape":false,"class_event":""}}' ) );$(document).ready(function () {
_ringo.Set( 'edit', false );
_ringo.Init();
var aRows = JSON.parse( '[{"id":1,"name":"Charly Aubia","abr":"CA"},{"id":2,"name":"Maria de la O","abr":"MO"},{"id":3,"name":"John Kocinsky","abr":"JK"}]' );
_ringo.SetData( aRows );
})
</script>


y dice que hubo un error aca:
//console.trace()

if ( lInit ) {
this.Init( aData )
} else { // Instancia
oBrowse = $('#' + this.cId )
oBrowse.bootstrapTable( { ignoreClickToSelectOn: TWebBrowseIgnoreClickToSelectOn } )
}

}


Carles, de antemano, muchas gracias por la ayuda.

Rolando
Cochabamba, Bolivia.
RSalazarU
 
Posts: 211
Joined: Wed Jul 16, 2008 12:59 pm
Location: Cochabamba-Bolivia

Re: Ayuda Mercury TWeb y TWebBrowse

Postby Carles » Thu Apr 15, 2021 8:46 am

Rolando,

1.- Definicion de Ruta en el index.prg

Code: Select all  Expand view  RUN
DEFINE ROUTE 'twebbrowse'       URL 'twebbrowse'        CONTROLLER 'browse@test_tweb.prg'   OF oApp


Como puede observar definimos la ruta "twebbrowse" que mercury enrutará hacia el controlador test_tweb.prg y ejecutará el método browse :D


2.- Definimos el controlador \controller\test_tweb.prg y el metodo browse()

Code: Select all  Expand view  RUN
//  {% LoadHRB( '/lib/tweb/tweb.hrb' ) %}

CLASS Test_TWeb

    METHOD New()    CONSTRUCTOR
   
    METHOD Browse() 
   
ENDCLASS

METHOD New( oController ) CLASS Test_TWeb   

RETU SELF

METHOD Browse( oController ) CLASS Test_TWeb

    local aRows := {}
   
    Aadd( aRows, { 'id' => 1, 'name' => 'Charly Aubia', 'abr' => 'CA' } )
    Aadd( aRows, { 'id' => 2, 'name' => 'Maria de la O', 'abr' => 'MO'  } )
    Aadd( aRows, { 'id' => 3, 'name' => 'John Kocinsky', 'abr' => 'JK'  } )

    oController:View( 'tweb/browse.view', aRows )
   
RETU NIL


Puntos a comentar:

a) Podemos tener varios controladores que dispararan views que podran o no usar TWeb. En este caso, yo cargo la libreria desde este controlador, pero se puede cargar directamente desde el index.prg. En cualquier caso, para cargar la libreria:

Code: Select all  Expand view  RUN
//  {% LoadHRB( '/lib/tweb/tweb.hrb' ) %}


b) Despues definimos el metodo Browse() y el método realiza la tarea que ha de hacer un controllador: recuperar parametros, abrir modelos de datos, manejar datos, ... En este caso simplemente cargamos un array

c) Una vez finaliza el proceso de datos, ejecutamos una salida: repuesta json, xml, una view. En este caso le deciemos al controlador que ejecute la view "tweb/browse.view" y le pasa de parámetro los datos, en este caso el array aRows

Code: Select all  Expand view  RUN
oController:View( 'tweb/browse.view', aRows )



3.- Definimos la vista view\tweb\browse.view

Code: Select all  Expand view  RUN
<h3>Test View with browse</h3><hr>

<?prg
    #include {{ TWebInclude() }}
   
    local aRows := pvalue(1)
   
    DEFINE WEB oWeb TITLE 'MyBrowse' TABLES INIT

    DEFINE FORM o          

    INIT FORM o  

        ROWGROUP o
            DEFINE BROWSE oBrw ID 'ringo' SEARCH HEIGHT 400 OF o

                ADD oCol TO oBrw ID 'id'    HEADER 'Id.'
                ADD oCol TO oBrw ID 'name'  HEADER 'Name'                  
                ADD oCol TO oBrw ID 'abr'   HEADER 'Abr.'                  

            INIT BROWSE oBrw DATA aRows 
        END o              
                   
    END FORM o RETURN   
?>


Aqui solo recalcar que la view ejecuta por defecto codigo html puro y duro. Cualquier codigo harbour lo tenemos de poner entre las etiquetas <?prg ... ?>

Observad que:

a) Hacemos un include del tweb.ch para poder preprocesar los comandos tweb

Code: Select all  Expand view  RUN
#include {{ TWebInclude() }}


b) Recuperamos los parametros del controlador

local aRows := pvalue(1)


c) El resto es código TWeb puro y duro


Si ejecutamos ahora --> localhost/master/mercury/twebbrowse obtenemos el siguiente resultado

Image

Como veis el proceso es fácil: definir un camino->un proceso->una pantalla o lo que es lo mismo: router->controller->view . Hecho uno, hechos todos...(casi :D )
Salutacions, saludos, regards

"...programar es fácil, hacer programas es difícil..."

UT Page -> https://carles9000.github.io/
Forum UT -> https://discord.gg/bq8a9yGMWh
Skype -> https://join.skype.com/cnzQg3Kr1dnk
User avatar
Carles
 
Posts: 1141
Joined: Fri Feb 10, 2006 2:34 pm
Location: Barcelona

Re: Ayuda Mercury TWeb y TWebBrowse

Postby RSalazarU » Thu Apr 15, 2021 2:47 pm

Carles,

Muchas gracias por responder y por tu dedicacion, gran TRABAJOOO!!!

Respecto a la consulta, mirando el ejemplo 'boot' que viene con mercury:

1.Copie la carpeta: tweb\lib\tweb a la carpeta mercury\lib\

2. Modifique el archivo mercury\index.prg, para añadirle:
Code: Select all  Expand view  RUN

//  {% LoadHrb( 'lib/tweb/tweb.hrb' ) %}        //Loading TWEB lib
 


3. Modifique el archivo mercury\src\view\boot\content_test1.view, añadiendo/copiando el codigo de tweb\browse.prg con algunos comentarios
Code: Select all  Expand view  RUN

<!-- Page Content  -->
<div id="content">

    {{ View( 'boot/content_btn.view' ) }}

    <h2>Test 1</h2>

    <div class="line"></div>

    <?prg
        #include {{ TWebInclude() }}
        //#include {% TWebInclude() %}
        //function main()
       
            local o, oCol, oBrw
            local aRows := {}
           
            Aadd( aRows, { 'id' => 1, 'name' => 'Charly Aubia', 'abr' => 'CA' } )
            Aadd( aRows, { 'id' => 2, 'name' => 'Maria de la O', 'abr' => 'MO'  } )
            Aadd( aRows, { 'id' => 3, 'name' => 'John Kocinsky', 'abr' => 'JK'  } ) 
       
            //DEFINE WEB oWeb TITLE 'Basic Browse' TABLES INIT
           
            DEFINE FORM o
       
            //  HTML o INLINE '<h3>Basic Browse</h3><hr>'
               
            INIT FORM o            
       
                DEFINE BROWSE oBrw ID 'ringo' HEIGHT 400 OF o
       
                    ADD oCol TO oBrw ID 'id'    HEADER 'Id.'
                    ADD oCol TO oBrw ID 'name'  HEADER 'Name'                  
                    //ADD oCol TO oBrw ID 'abr' HEADER 'abr'                   
       
                INIT BROWSE oBrw DATA aRows 
       
           
            END FORM o 
           
        //retu nil         
        END FORM o RETURN   
    ?>

</div>
 



Lo ejecute

http://localhost/master/mercury/boot/test1

...y no muestra el Browse.

Carles, disculpa la molestia.

De antemano, gracias por la ayuda.

Rolando
RSalazarU
 
Posts: 211
Joined: Wed Jul 16, 2008 12:59 pm
Location: Cochabamba-Bolivia

Re: Ayuda Mercury TWeb y TWebBrowse

Postby Carles » Thu Apr 15, 2021 4:41 pm

Rolando,

Lo que quieres es complicadillo, por el simple hecho de que el proyecto boot es un proyecto ajeno a TWeb y el se carga sus propias librerias de bootstrap, con sus correspondientes versiones y usa pluggins como el del menu que funcionan exclusivamente para estas versiones de librerias ya cargadas.

TWeb se carga su propio entorno de librerias y versiones necesarias para usar, pero tu quieres mezcla todo en un pote y no funcionará. Se habria de tracear que se carga en un lado, que no carga en el otro, o que molesta en un lado que no molesta en el otro...

El ejemplo detallado que he puesto anteriormente se describe como usar la lógica de Mercury para la arquitectura del programa y como poder usar TWeb para crear pantallas. En boot tu quieres usar toda una funcionalidad que funciona con unas librerias que seguro colisionan con las de TWeb
Salutacions, saludos, regards

"...programar es fácil, hacer programas es difícil..."

UT Page -> https://carles9000.github.io/
Forum UT -> https://discord.gg/bq8a9yGMWh
Skype -> https://join.skype.com/cnzQg3Kr1dnk
User avatar
Carles
 
Posts: 1141
Joined: Fri Feb 10, 2006 2:34 pm
Location: Barcelona


Return to mod_harbour

Who is online

Users browsing this forum: No registered users and 5 guests