[crevilla]

Hola,

Estoy intentando hacer una página con WebForms. Deseo importar ciertas librerias (CSS y JavaScript) en la WebForm para poder utilizar otros widgets no incluidos en gambas (graficos, tablas de gannt, etc., para ver datos en forma gráfica). Según la wiki de gambas, existe la función AddHeader que supuestamente agrega una cadena a los headers de la WebForm:

Código:

Webform1.AddHeader("<link href=\"http-url-to-stylesheet" rel=\"stylesheet\" />")

Sin embargo, al ejecutar la página, mi header no aparece ser incluido (ni siquiera en el código de la página, al revisar el codigo fuente html generado)

Tiene alguien experiencia con esta función o podría decirme alguien cómo se puede incluir una librería externa (css, javascript, angular, etc..) a una página WebForm? Cualquier ayuda será muy agradecida.

CR

[jguardon]

Hola crevilla

Según la ayuda de gambas, los métodos para añadir clases CSS y JavaScript son AddClass y AddJavascriptFile, respectivamente para el componente gb.web.form.

Aparentemente el método que intentas utilizar sólo está disponible en el componente gb.web.gui, que es más actual que gb.web.form. Dependiendo de la versión de Gambas que estés utilizando podría darse el caso de que uno de los dos componentes no esté disponible o bien que ambos lo estén y hayas importado el antiguo.

En mi opinión la ayuda es bastante confusa al respecto, ya que ambos componentes disponen de métodos, propiedades y eventos iguales o muy similares, sin embargo se puede dar el caso de que exista uno o el otro o ambos.

Revisa esto y comenta la versión de gambas que estés utilizando para saber qué está pasando.

Saludos

[crevilla]

Hola,

Muchas gracias por la respuesta. Estoy utilizando el componente gb.web.gui, el más reciente.
Intenté utilizar las funciones que mencionas, mas tampoco hubo resultados.
Según tengo entendido, AddClass sirve para asignar una clase del css que ya está cargado o vinculado. De hecho, ya utilicé esa función en otro proyecto para cambiar la apariencia de mis botones "on the fly". Pero esa es otra historia.
Para evitar hacer este post más largo, incluyo el proyecto de gambas.
En el archivo comprimido incluyo el "index.html" que debe cargarse al presionar el botón en la webform. Dicho archivo debe ser colocado en algun lugar de tu /var/www/ y ser accesible a través de tu "http://localhost/index.html" (o cualquier otra dirección que le asignes en tu equipo).
Si accesas directamente a este archivo mendiate tu navegador, verás un bonito calendario.
Al intentar cargarlo desde gambas, el archivo "index.html" se carga bien, mas no se ve el bonito calendario, sino un campo de texto feo.

¡Quiero mi bonito calendario!

Gracias,
CR

[omoreno]

Saludos crevilla.
Para agregar (Css o Js) de algún Framework ciertamente utilizo AddHeader("...")
Te he adjuntado un ejemplo con otro Framework (Materializecss).

Espero te sirva de ayuda.

[crevilla]

Saludos,

Muchas gracias por el proyecto. Me apuntó en la dirección correcta.
Mis encabezados ya se cargan bien, sin embargo tengo otro problema.
Si abren el proyecto adjunto, y ejecutan la Webform, aparecerá el campo de texto.
Dentro del proyecto, añadi 2 WebPages; "res2" es el código html generado por gambas, copiado-pasteado desde firefox tal cual, sin modificaciones; "res1" es el mismo código, pero con una pequeña diferencia que modifiqué manualmente.

Para comenzar, dentro de mi proyecto en Gambas, agregué:

Código:

 
  jScript1 = "$(function () { "
  jScript1 &= "  $(\"#startDate\").ejDatePicker();"
  jScript1 &= " })"
  
  Me.Exec(jScript1)

Esto resulta en el siguiente código en la página, generada por Gambas en el web browser:
 

Código:

 
<script type="text/javascript">
gw.form = 'Webform1';
gw.version = '0.0.1';
gw.debug = false;
gw.addTimer('@1.WebTimer1',1000);
$(function () {   $("#startDate").ejDatePicker(); });
</script>

La última linea es el codigo que debería inicializar el objeto calendario. Sin embargo, no llega a ejecutarse.

Pero, si manualmente modifico el código a:
 

Código:

 
<script type="text/javascript">
    $(function () {   $("#startDate").ejDatePicker(); });
</script>

<script type="text/javascript">
gw.form = 'Webform1';
gw.version = '0.0.1';
gw.debug = false;
gw.addTimer('@1.WebTimer1',1000);
</script>

Entonces el objeto calendario se inicializa bien. De alguna forma, si el código para inicializar se pone al final (como en el primer ejemplo) no funciona. Sin embargo al modificarlo (segundo ejemplo) sí se muestra bien. Dentro del proyecto estan ambas páginas para que puedan ver por si mismos.
¿De qué forma puedo lograr que mi código javascript se ejecute, así como en el segundo ejemplo que sí funciona?

Gracias,
CR