FiveTech Software tech support forums

Posted: **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


<!-- 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.

Posted: **Thu Apr 15, 2021 8:46 am**

Rolando,

1.- Definicion de Ruta en el index.prg

Code: Select all | Expand

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

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

Code: Select all | Expand

//  {% 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

//  {% 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

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

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

Code: Select all | Expand

<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

#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

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

)

Posted: **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


//  {% 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


<!-- 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

Posted: **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

FiveTech Software tech support forums

Ayuda Mercury TWeb y TWebBrowse

Ayuda Mercury TWeb y TWebBrowse

Re: Ayuda Mercury TWeb y TWebBrowse

Re: Ayuda Mercury TWeb y TWebBrowse

Re: Ayuda Mercury TWeb y TWebBrowse