Si puedes poner un pequeño ejemplo que lo reproduzca, lo revisamos

Agregando un Tab se ve de esta manera.

Aparte existe el evento OnChange de manera de poner controles dinamicos en cada Tabs o de que manera se puede hacer?

Para quitar la barra de scroll horizontal que te sale, puedes poner

:oStyle:cOverflow := "hidden"

justo después de haber instanciado el wTabs()

dmillas creo que el problema puede estar al mostrar los tabs dentro de un Wpanel, prueba dentro de Wbevel, y define los tabs como se indica en este fichero.

Sustituye el codigo del ejemplo de Nefele samples (formulario 6), por este, y veras que funciona correctamente. (abajo tienes unas capturas de pantalla, para verlo)

PROCEDURE Formulario6()

// Comenzamos instanciando la Página Web que queremos crear
with object TWebPage():New()
:cClrPane := "pink lighten-5"
:aBreadCrumbs := {{GetEnv("SCRIPT_NAME"),"🏠"},{GetEnv("SCRIPT_NAME") + "?mainforms","📋"},"Máscaras"}
AppMenu( :WO, "Formularios" )

// Instanciamos un Panel para que sea el contenedor del formulario, permite poner un titulo y tiene un efecto sombra
With Object WPanel():New(:WO)
:cTitle := "FICHA DE VEHÍCULO"
:aWidth[xc_M] := 8 // Apartir del tamaño (Tablet) solo ocupara 8/12 partes de la pantalla
:aOffset[xc_M] := 2 // Y la centramos desplzandola 2/12 desde la izquierda

// Instanciamos el Formulario propiamente dicho
with object WForm():New(:WO)
:cId := "formulario"
:cFunction := "VisParam"

WITH OBJECT wTabs():New( :WO )
:cId := "tabs_captura"

:additem("primero" , "bevel_uno")
:additem("segundo" , "bevel_dos")
:additem("tercero" , "bevel_tres")

:Create()

end with

// Nombre y apellidos del usuario
with object WBevel():New(:WO)
:cId := "bevel_uno"
:nStyle := xc_Row

with object WEdit():New( :WO )

// Modificamos la máscara del control
with object :oMask
:lUpperCase := .t. // En mayúsculas
:lAutoComplete := .f. // Al ponerlo a .f. evita que se muestre la selección de los datos previamente introducidos
:cPicture := "A" // Admite los caracteres indicados en cValidatorA
end with

:cId := "Nombre y apellidos"
:cTitle := "Primer Apellido"
:cIcon := "group"
:nLength := 30

:SetRequired()
:Create()
end with

with object WEdit():New( :WO )

with object :oMask
:lAutoComplete := .f.
:cPicture := "B" // Aplica en formato que hemos redefinido a cValidatorB
end with

:cId := "direccion"
:cTitle := "Dirección"
:cIcon := "store"
:nLength := 40

:SetRequired()
:Create()
end with

with object WEdit():New(:WO)

with object :oMask
:cPicture := "+9{1,3} (999) 99 99 99"
// :cPicture := "| a{1,10} |"
:lShowMask := .f. // Si el dato está vacío, oculta la máscara
end with

:oStyle:cColor := "red" //Color del icono

:cId := "telefono"
:cTitle := "Teléfono"
:cIcon := "phone"

:aWidth[xc_M] := 6

:Create()
end with

with object WEdit():New(:WO)

:oMask:cPicture := "currency" // Tipo moneda
:oMask:nDecimalPlaces := 2 // Con dos decimales
:oMask:lMinus := .f. // Solo valores positivos

:oStyle:cColor := "blue"

:cValue := 10.555 //Valor inicial. Como nuestra máscara tiene solo admite 2 decimales, lo redondea automáticamente
:nMaxValue := 300 // Valor máximo
:nMinValue := 10 // Valor mínimo

:cId := "importe"
:cTitle := "Importe"
:cIcon := "payment"

:aWidth[xc_M] := 6 // En pantallas Tablet o superior queremos que la Fecha y la Hora compartan el ancho
:Create()
end with

:Create()
end with

with object WBevel():New(:WO)
:cId := "bevel_dos"
:nStyle := xc_Row

with object WEdit():New(:WO)

:oMask:cPicture := "9999-AAA" // 4 números, un guión y 3 letras de tipo ValidatorA

:cId := "Matricula"
:cTitle := "Matrícula"
:cIcon := "directions_car"
:aWidth[xc_M] := 6 // En pantallas Tablet o superior queremos que la Fecha y la Hora compartan el ancho

:Create()

end with

with object WEdit():New(:WO)

:oMask:cPicture := "date" // Tipo fecha

:cId := "Fecha"
:cTitle := "Fecha matriculación"
:cIcon := "date_range"

:aWidth[xc_M] := 6

:Create()

end with
with object WRadioMenu():New( :WO )
:cId := "RMenu1"
:cClrTitle := "blue"
:aItems := { "UNO",;
"DOS",;
"TRES",;
"CUATRO"}
:nIndex := 1
:lGap := .F.
:Create()
END with

with OBJECT WComboBox():New(:WO)
:cId := "mesvisita"
:aWidth[xc_M] := 12 // En pantallas Tablet o superior queremos los dos wcombobox en la misma linea
// Hay varias maneras de alimentar un wComboBox, en el wiki estan explicados
:aItems := {{-1, "1er Trimestre"},{1,"Enero"},{2,"Febrero"},{3,"Marzo"},;
{-1, "2o Trimestre"}, {4,"Abril"},{5,"Mayo"},{6,"Junio"},;
{-1, "3er Trimestre"}, {7,"Julio"},{8,"Agosto"},{7,"Septiembre"},;
{-1, "4o Trimestre"}, {10,"Octubre"},{11,"Noviembre"},{12,"Diciembre"}}
:cText := "Seleccione el mes de visita"
:cIcon := "event_available"
:cTitle := "Mes de visita"
:cHelp := "Este es el Mes que prefiere que le hagamos la visita periodica"
:Create()
end with

with object WSeparator():New(:WO)
:lBR := .T.
:Create()
end with

:Create()

end with
with object WBevel():New(:WO)
:cId := "bevel_TRES"
:nStyle := xc_Row

WITH OBJECT WDataTable():New(:wo)
:cId := "Table1"
WITH OBJECT :Configure()
:SetColumns({"Nombre", "Puesto"})
:data := {{"JOSE","1001"},{"ANDRES","1004"},{"MANOLO","1005"}}
END
:Create()

END
:create()
:Create()

end with
with object WSeparator():New(:WO)
:lLine := .T.
:lBR := .T.
:Create()
end with

with object WButton():New(:WO)
:cId := "submit"
:cText := "Aceptar"
:lSubmit := .T.
:lLarge := .T.
:lCenter := .T.
:Create()
end with

// Ya tenemos creados todos los controles dentro del wForm por lo que procedemos a crearlo
:Create()

end with

:Create()

end with

oCGI:SendPage(:Create())

end with

RETURN

• Esta respuesta fue modificada 11 meses, 4 semanas por Vicente Ardines.
• Esta respuesta fue modificada 11 meses, 4 semanas por Vicente Ardines.
• Esta respuesta fue modificada 11 meses, 4 semanas por Vicente Ardines.

Buenas;

Precisamente para la nueva versión del samples hemos añadido al ejemplo Tabs un pestaña con un DataTable.

Habría que ver el error, que seguro esta dando el navegador, en la consola de depuración.
Cuando se produce un error JavaScript la mayoría de las veces el navegador para la ejecución de la maquina virtual por lo que no se ejecuta nada más.

Pd: Aunque no lo parezca el ejemplo esta realizado con DataTable, pero es, a su vez, un ejemplo de como personalizar el DataTable.