Filter on Xbrowse

[karinha]

https://imgur.com/Dumi0PA

[karinha]

https://imgur.com/wHP1NB7

[karinha]

https://imgur.com/xBIjGwm

[Marc Venken]

Good Morning Master Otto, later I will learn MOD_HARBOUR, this name is very bad, it should have a more commercial name. Master Otto, how do I change the MARRIED FIELD .T., .F., for SI ó NO? Yes or No?

Buenos días Maestro Otto, más tarde aprenderé MOD_HARBOUR, este nombre es muy malo, debería tener un nombre más comercial. Maestro Otto, ¿cómo cambio el CAMPO CASADO .T., .F., por SI ó NO? ¿Yes o No?

Tks, gracias.

Regards, saludos.

Code: Select all  Expand view  RUN

   aBmp := { "c:\marc32\bitmaps\16x16\yes.bmp","c:\marc32\bitmaps\16x16\stop.bmp","c:\marc32\bitmaps\32x32\copy.bmp","c:\marc32\bitmaps\32x32\view.bmp" }
    WITH OBJECT :Act
         :AddBitmap( aBmp )
         :bBmpData   := { || if( ( oBrw:cAlias )->aktief = 1,1,2) }  // any condition :  1 = 1st item of array 2 = second .....
    END


   // or coded ...
   oCol:AddResource("GREEN")  //  If you want to use bitmaps
   oCol:AddResource("RED")
   oCol:cHeader  := "Married"
   oCol:bBmpData   := { || iif( _FIELD->Married, 1, 2) }  //  Showing the bitmaps

   oCol:bStrData   := { || iif( _FIELD->Married, "Yes", "No ")}  // showing text
   oCol:bEditValue := { || _FIELD->Married }
   oCol:nDataStyle := oCol:DefStyle( AL_RIGHT, .T.)
   oCol:nEditType := EDIT_LISTBOX
   oCol:aEditListTxt   := { "Yes", "No"}  //  Select text for field
   oCol:aEditListBound := { .t., .f. }


 

[karinha]

New version. Now using INDEX TEMPORARY and HIDE() and SHOW() on the RADIOS BUTTONS. Master OTTO, I challenge you to do better! hahahahahaha.

Nueva versión. Ahora usando INDEX TEMPORARY y HIDE() y SHOW() en los BOTONES DE RADIOS. Maestro OTTO, ¡te desafío a hacerlo mejor! jajajajajaja.

Code: Select all  Expand view  RUN

// C:\SILVXBRW\TESTXBR7.PRG  - Simples teste de xBrowse com indices.
// MODIFICADO EM: 04/05/2024 - INDEX ON TEMPORARY - kapiabafwh@gmail.com
//                             WITH: HIDE() / SHOW()

#Include 'Fivewin.ch'
#Include 'xBrowse.ch'

ANNOUNCE RDDSYS
REQUEST OrdKeyNo, OrdKeyCount, OrdCreate, OrdKeyGoto
REQUEST DBFCDX, DBFFPT

STATIC nOpcRad := 3, oMarried, lMarried := .F., oAge, lAge := .F.
STATIC oRadmenu, oRadMenu2, oSayRad

FUNCTION Main()

   FIELD FIRST, LAST, STREET, CITY, STATE, ZIP, HIREDATE, MARRIED, AGE, ;
         SALARY, NOTES

   LOCAL oDlg, oBrw, oFont, oFnt, ovFont, oSaida, cTitle, aGrad, cAlias

   hb_gcAll( .F. )

   RDDSETDEFAULT("DBFCDX")
   RDDREGISTER( "DBFCDX", 1 )

   SET CENTURY ON
   SET DATE BRITISH
   SET TIME FORMAT TO "HH:MM:SS"
   SET EPOCH TO YEAR( DATE() ) - 30
   SET SOFTSEEK OFF
   SET WRAP ON
   SETCANCEL( .F. )
   SET CONFIRM OFF
   SET DELETED ON
   SET _3DLOOK ON
   SET UNIQUE OFF
   SET ESCAPE OFF
   SET EXACT ON
   SET EXCLUSIVE OFF
   SET MULTIPLE OFF
   SET OPTIMIZE ON

   SetBalloon( .T. )
   SkinButtons()

   IF FILE( "CUSTOMER.CDX" )

      FErase( "CUSTOMER.CDX" )

   ENDIF

   USE CUSTOMER NEW EXCLUSIVE ALIAS CUSTOMER

   INDEX ON STREET  TAG 01 TO CUSTOMER FOR .NOT. DELETED()

   INDEX ON MARRIED TAG 02 TO CUSTOMER FOR .NOT. DELETED()

   INDEX ON AGE     TAG 03 TO CUSTOMER FOR .NOT. DELETED()

   CLOSE DATABASES

   USE CUSTOMER INDEX CUSTOMER NEW SHARED
   SET ORDER TO 01 // STREET
   GO TOP

   cAlias := ALIAS()

   cTitle := "xBrowse Filter Advanced 5.0 Model by Silvio Falconi With Hide()"

   DEFINE FONT oFont  NAME 'TAHOMA' SIZE 0, - 14 BOLD
   DEFINE FONT oFnt   NAME 'TAHOMA' SIZE 0, - 12 BOLD
   DEFINE FONT oVfont NAME 'TAHOMA' SIZE 0, - 12 NESCAPEMENT 900 BOLD

   aGrad := { { 0.30, nRGB( 221, 245, 255 ), nRGB( 192, 221, 255 ) }, ;
              { 0.50, nRGB( 192, 221, 255 ), nRGB( 221, 245, 255 ) } }

                       // LARG  ALT
   DEFINE DIALOG oDlg SIZE 570, 500 PIXEL TRUEPIXEL FONT oFont ;
      TITLE cTitle GRADIENT aGrad
     
   oDlg:lHelpIcon := .F.

   @ 4.5, 010  SAY "Principiantes y aficionados son los que más me enseñan. " ;
     SIZE 400, 20 OF oDlg PIXEL UPDATE COLORS METRO_GREEN, CLR_WHITE          ;
     FONT oFnt TRANSPARENT

   @ 20, 10 XBROWSE oBrw SIZE 550, 380 PIXEL OF oDlg FONT oFnt ;
      COLUMNS "First", "Last", "Street", "Married", "Age"      ;
      ALIAS 'CUSTOMER' LINES CELL

   xBrwColors( oBrw, .T. )

   oBrw:nColSel := 3

   oBrw:aCols[ 1 ]:nWidth :=  80  // First
   oBrw:aCols[ 1 ]:nDataStrAlign := AL_CENTER

   oBrw:aCols[ 2 ]:nWidth :=  80  // Last

   oBrw:aCols[ 2 ]:nDataStrAlign := AL_CENTER
   oBrw:aCols[ 3 ]:nWidth := 190  // Street

   oBrw:aCols[ 3 ]:bClrStd := { || { CLR_BLACK, RGB( 255, 255, 200 ) } }

   oBrw:aCols[ 4 ]:nWidth :=  60  // Married
   oBrw:aCols[ 4 ]:nDataStrAlign := AL_CENTER

   oBrw:aCols[ 5 ]:nWidth :=  40  // Age
   oBrw:aCols[ 5 ]:nDataStrAlign := AL_CENTER

   oBrw:nColDividerStyle := LINESTYLE_LIGHTGRAY
   oBrw:nRowDividerStyle := LINESTYLE_LIGHTGRAY
   oBrw:nStretchCol      := STRETCHCOL_WIDEST // Ajusta as colunas do xBrowse.

   oBrw:lDrawBorder := .T.
   oBrw:nClrBorder  := Rgb( 195, 195, 185 )

   WITH OBJECT oBrw:oCol( "First" )
      :oHeaderFont := oVFont
      :cHeader := "Primero"
   END

   WITH OBJECT oBrw:oCol( "Last" )
      :oHeaderFont := oVFont
      :cHeader := "Último"
   END

   WITH OBJECT oBrw:oCol( "Street" )
      :oHeaderFont := oVFont
      :cHeader := "Calle"
   END

   WITH OBJECT oBrw:oCol( "Married" )

      oCol := oBrw:AddCol()
      oCol:bStrData   := { || IIF( _FIELD->Married, "SI", "NO")}

      :oHeaderFont := oVFont
      :cHeader := "Casado"

   END

   WITH OBJECT oBrw:oCol( "Age" )
      :oHeaderFont := oVFont
      :cHeader := "Edad"
   END

   oBrw:CreateFromCode()
   oDlg:oClient := oBrw

   @ 415, 075  SAY "Filtrar por: " SIZE 150, 20 OF oDlg PIXEL UPDATE   ;
     COLORS METRO_ORANGE, CLR_WHITE FONT oFnt TRANSPARENT

   @ 438, 050 SAY oSayRad PROMPT "Elija la opción: " SIZE 150, 20 OF oDlg ;
      PIXEL UPDATE COLORS METRO_INDIGO, CLR_WHITE FONT oFnt TRANSPARENT

   @ 415, 150 CHECKBOX oMarried VAR lMarried PROMPT "&Casados" OF oDlg ;
      SIZE 100, 15 PIXEL UPDATE                                        ;
      ON CHANGE( ENCENDER_RADIOS_MARRIED( oRadMenu, oRadMenu2 ) )

   // ON CHANGE( MENU_SILVIO_FILTRO_MARRIED( cAlias, oBrw, oMarried ) ) // con dialog.

   oMarried:cToolTip := OemToAnsi( "Búsqueda de casados(Married)" )

   @ 415, 250 CHECKBOX oAge     VAR lAge     PROMPT "&Edad" OF oDlg    ;
      SIZE 100, 15 PIXEL UPDATE                                        ;
      ON CHANGE( ENCENDER_RADIOS_EDAD( oRadMenu, oRadMenu2 ) )

   // ON CHANGE( MENU_SILVIO_FILTRO_EDAD( cAlias, oBrw, oAge ) ) // con dialog.

   oAge:cToolTip := OemToAnsi( "Búsqueda por Edad(Age)" )

   // Menu Casados con Hide()/Show() - New Funcion by Silvio Falconi(Model)

   @ 440, 147 RADIO oRadMenu VAR nOpcRad ITEMS "Casados" OF oDlg  ;
      SIZE 100, 16 PIXEL UPDATE                                   ;
      ON CHANGE( CHANGE_INDICES_CASADO( nOpcRad, cAlias, oBrw ),  ;
                 oBrw:Refresh(), oBrw:SetFocus() )

   @ 440, 247 RADIOITEM "No Casados" RADIOMENU oRadMenu OF oDlg SIZE 100, 16 ;
      PIXEL UPDATE

   // Menu Anos con Hide()/Show()

   @ 440, 147 RADIO oRadMenu2 VAR nOpcRad ITEMS "Hasta 20 años" OF oDlg ;
      SIZE 130, 16 PIXEL UPDATE                                         ;
      ON CHANGE( CHANGE_INDICES_EDAD( nOpcRad, cAlias, oBrw ),          ;
                 oBrw:Refresh(), oBrw:SetFocus() )

   @ 440, 280 RADIOITEM "Más de 50 años" RADIOMENU oRadMenu2 OF oDlg    ;
      SIZE 130, 16 PIXEL UPDATE

   @ 470, 005  SAY "kapiabafwh@gmail.com" SIZE 200, 20 OF oDlg PIXEL UPDATE ;
     COLORS METRO_COBALT, CLR_WHITE FONT oFnt TRANSPARENT

   @ 470, 230 SAY "Edición profesional" SIZE 150, 20 OF oDlg ;
      PIXEL UPDATE COLORS METRO_LIME, CLR_WHITE FONT oFnt TRANSPARENT

   @ 440, 450 BUTTONBMP oSaida PROMPT "  &Salida" OF oDlg TEXTRIGHT PIXEL  ;
      BITMAP ".\EXIT.BMP" SIZE 100, 40 ACTION( oDlg:End(), LIBERA_TUDO() ) ;
      FONT oFont CANCEL

   oSaida:cToolTip := "Saida - Exit - Cancelar"

   ACTIVATE DIALOG oDlg CENTERED                                             ;
      ON INIT( CTRLS_COLORS( oDlg ), oRadMenu:Hide(), oRadMenu2:Hide(),      ;
                                     oSayRad:Hide() )

   oFont:End()
   ovFont:End()

   dbCloseAll() // CLOSE DATABASES

   // seguridad
   lMarried := .F.
   lAge     := .F.

RETURN NIL
// 04/05/2024 - new function
FUNCTION ENCENDER_RADIOS_MARRIED( oRadMenu, oRadMenu2 )

   nOpcRad := 3

   lAge := .F.

   oAge:Refresh()

   oSayRad:Show()

   oRadMenu2:Hide()

   oRadMenu:Show()

RETURN( .T. )

FUNCTION ENCENDER_RADIOS_EDAD( oRadMenu, oRadMenu2 )

   nOpcRad := 3

   lMarried := .F.

   oMarried:Refresh()

   oSayRad:Show()

   oRadMenu:Hide()

   oRadMenu2:Show()

RETURN( .T. )

FUNCTION MENU_SILVIO_FILTRO_MARRIED( cAlias, oBrw, oMarried )

   LOCAL oDlg, oFont, oFnt, ovFont, oSaida, cTitle, aGrad, oSay, oRadmenu

   nOpcRad := 3

   oMarried:Disable()
   oMarried:Refresh()

   cTitle := "xBrowse: Filtrar: Elija una opción:"

   DEFINE FONT oFont  NAME 'TAHOMA' SIZE 0, - 14 BOLD
   DEFINE FONT oFnt   NAME 'TAHOMA' SIZE 0, - 12 BOLD
   DEFINE FONT oVfont NAME 'TAHOMA' SIZE 0, - 12 NESCAPEMENT 900 BOLD

   aGrad := { { 0.30, nRGB( 221, 245, 255 ), nRGB( 192, 221, 255 ) }, ;
              { 0.50, nRGB( 192, 221, 255 ), nRGB( 221, 245, 255 ) } }

   DEFINE DIALOG oDlg SIZE 250, 200 PIXEL TRUEPIXEL FONT oFont ;
      TITLE cTitle GRADIENT aGrad
     
   oDlg:lHelpIcon := .F.

   @ 12, 090 SAY oSay PROMPT "Filtrar Por: " SIZE 100, 24 PIXEL OF oDlg ;
      FONT oFont COLORS METRO_COBALT, CLR_WHITE TRANSPARENT

   @ 50.5, 070 RADIO oRadMenu VAR nOpcRad ITEMS "Casados" OF oDlg ;
      SIZE 100, 16 PIXEL UPDATE                                   ;
      ON CHANGE( CHANGE_INDICES_CASADO( nOpcRad, cAlias, oBrw ),  ;
                 oBrw:Refresh(), oBrw:SetFocus() )

   @ 80.5, 070 RADIOITEM "No Casados" RADIOMENU oRadMenu OF oDlg  ;
      SIZE 100, 16 PIXEL UPDATE

   @ 140, 072 BUTTONBMP oSaida PROMPT "  &Salida" OF oDlg TEXTRIGHT PIXEL ;
      BITMAP ".\EXIT.BMP" SIZE 100, 40 ACTION( oDlg:End() ) FONT oFont CANCEL

   oSaida:cToolTip := "Saida - Exit - Cancelar"

   ACTIVATE DIALOG oDlg CENTERED ON INIT( CTRLS_COLORS( oDlg ) )

   lMarried := .F.

   oMarried:Enable()
   oMarried:Refresh()

   oBrw:SetFocus()

RETURN NIL

FUNCTION MENU_SILVIO_FILTRO_EDAD( cAlias, oBrw, oAge )

   LOCAL oDlg, oFont, oFnt, ovFont, oSaida, cTitle, aGrad, oSay, oRadmenu

   nOpcRad := 3

   oAge:Disable()
   oAge:Refresh()

   cTitle := "xBrowse: Filtrar: Elija una opción:"

   DEFINE FONT oFont  NAME 'TAHOMA' SIZE 0, - 14 BOLD
   DEFINE FONT oFnt   NAME 'TAHOMA' SIZE 0, - 12 BOLD
   DEFINE FONT oVfont NAME 'TAHOMA' SIZE 0, - 12 NESCAPEMENT 900 BOLD

   aGrad := { { 0.30, nRGB( 221, 245, 255 ), nRGB( 192, 221, 255 ) }, ;
              { 0.50, nRGB( 192, 221, 255 ), nRGB( 221, 245, 255 ) } }

   DEFINE DIALOG oDlg SIZE 250, 200 PIXEL TRUEPIXEL FONT oFont ;
      TITLE cTitle GRADIENT aGrad
     
   oDlg:lHelpIcon := .F.

   @ 12, 090 SAY oSay PROMPT "Filtrar Por: " SIZE 100, 24 PIXEL OF oDlg   ;
      FONT oFont COLORS METRO_COBALT, CLR_WHITE TRANSPARENT

   @ 50.5, 070 RADIO oRadMenu VAR nOpcRad ITEMS "Hasta 20 años" OF oDlg   ;
      SIZE 130, 16 PIXEL UPDATE                                           ;
      ON CHANGE( CHANGE_INDICES_EDAD( nOpcRad, cAlias, oBrw ),            ;
                 oBrw:Refresh(), oBrw:SetFocus() )

   @ 80.5, 070 RADIOITEM "Más de 50 años" RADIOMENU oRadMenu OF oDlg      ;
      SIZE 130, 16 PIXEL UPDATE

   @ 140, 072 BUTTONBMP oSaida PROMPT "  &Salida" OF oDlg TEXTRIGHT PIXEL ;
      BITMAP ".\EXIT.BMP" SIZE 100, 40 ACTION( oDlg:End() ) FONT oFont CANCEL

   oSaida:cToolTip := "Saida - Exit - Cancelar"

   ACTIVATE DIALOG oDlg CENTERED ON INIT( CTRLS_COLORS( oDlg ) )

   lAge := .F.

   oAge:Enable()
   oAge:Refresh()

   oBrw:SetFocus()

RETURN NIL

FUNCTION CHANGE_INDICES_CASADO( nOpcRad, cAlias, oBrw )

   LOCAL lCasado := .T., lNoCasado := .F.

   IF nOpcRad     == 2 // No Casados

      SET ORDER TO 02  // MARRIED

      /*
      ORDSCOPE( 0, lNoCasado )
      ORDSCOPE( 1, lNoCasado )
      GO TOP
      */

      INDEX ON MARRIED TAG 05 TO CUSTTEMP FOR ( .NOT. EOF() ) .AND. ;
         ( cAlias )->MARRIED >= lNoCasado                     .AND. ;
         ( cAlias )->MARRIED <= lNoCasado MEMORY // TEMPORARY

      GO TOP

      IF EOF()

         /*
         ORDSCOPE( 0, Nil )
         ORDSCOPE( 1, Nil )
         GO TOP
         */

         OrdDestroy( "CUSTTEMP" )

         SELECT( cAlias )
         SET ORDER TO 01
         GO TOP

      ENDIF

   ELSEIF nOpcRad == 1 //->  CASADOS

      SET ORDER TO 02  // MARRIED

      /*
      ORDSCOPE( 0, lCasado )
      ORDSCOPE( 1, lCasado )
      GO TOP
      */

      INDEX ON MARRIED TAG 05 TO CUSTTEMP FOR ( .NOT. EOF() ) .AND. ;
         ( cAlias )->MARRIED >= lCasado                       .AND. ;
         ( cAlias )->MARRIED <= lCasado MEMORY // TEMPORARY

      GO TOP

      IF EOF()

         /*
         ORDSCOPE( 0, Nil )
         ORDSCOPE( 1, Nil )
         GO TOP
         */

         OrdDestroy( "CUSTTEMP" )

         SELECT( cAlias )
         SET ORDER TO 01
         GO TOP

      ENDIF

   ENDIF

   GO TOP

   oBrw:GoBottom()
   oBrw:Refresh()
   oBrw:Gotop()

RETURN NIL

FUNCTION CHANGE_INDICES_EDAD( nOpcRad, cAlias, oBrw )

   LOCAL cEdad20I := 20, cEdad20F := 29, cEdadIni := 50, cEdadFin := 100 //->anos

   IF nOpcRad     == 2 // mas de 50 anos

      SET ORDER TO 03  // EDAD/AGE

      /*
      ORDSCOPE( 0, cEdadIni )
      ORDSCOPE( 1, cEdadFin )
      GO TOP
      */

      INDEX ON AGE TAG 05 TO CUSTTEMP FOR ( .NOT. EOF() ) .AND. ;
         ( cAlias )->AGE >= cEdadIni                      .AND. ;
         ( cAlias )->AGE <= cEdadFin MEMORY // TEMPORARY

      GO TOP

      IF EOF()

         /*
         ORDSCOPE( 0, Nil )
         ORDSCOPE( 1, Nil )
         GO TOP
         */

         OrdDestroy( "CUSTTEMP" )

         SELECT( cAlias )
         SET ORDER TO 01
         GO TOP

      ENDIF

   ELSEIF nOpcRad == 1 //->  EDAD/AGE // 20/29 anos.

      SET ORDER TO 03  // EDAD/AGE

      /*
      ORDSCOPE( 0, cEdad20I )
      ORDSCOPE( 1, cEdad20F )
      GO TOP
      */

      INDEX ON AGE TAG 05 TO CUSTTEMP FOR ( .NOT. EOF() ) .AND. ;
         ( cAlias )->AGE >= cEdad20I                      .AND. ;
         ( cAlias )->AGE <= cEdad20F MEMORY // TEMPORARY

      GO TOP

      IF EOF()

         /*
         ORDSCOPE( 0, Nil )
         ORDSCOPE( 1, Nil )
         GO TOP
         */

         OrdDestroy( "CUSTTEMP" )

         SELECT( cAlias )
         SET ORDER TO 01
         GO TOP

      ENDIF

   ENDIF

   GO TOP

   oBrw:GoBottom()
   oBrw:Refresh()
   oBrw:Gotop()

RETURN NIL
// ESTA EM: INV1.PRG
STATIC FUNCTION xBrwColors( oBrw, lFoot )

   LOCAL cClrBack

   DEFAULT lFoot          := .F.

   oBrw:l2007             := .T.

   // oBrw:nRowHeight        := 24
   // oBrw:nHeaderHeight     := 24
   oBrw:lFooter           := lFoot
   
   // oBrw:lRecordSelector     := .F.
   // oBrw:lColDividerComplete := .F.
   // oBrw:lRowDividerComplete := .F.
   
   oBrw:lFlatStyle        := .F.
   oBrw:bClrHeader        := { || { CLR_BLACK, CLR_WHITE, CLR_WHITE } }
   oBrw:lFullGrid         := .F.

   // tira as linhas, nao gostei.
   // oBrw:nRowDividerStyle  := LINESTYLE_NOLINES
   // oBrw:nColDividerStyle  := LINESTYLE_NOLINES

   // oBrw:nMarqueeStyle := MARQSTYLE_HIGHLROW // Marca toda a celula, nao gostei.

   oBrw:bClrStd = { || If( oBrw:KeyNo() % 2 == 0, ;
                   { If( ( oBrw:cAlias )->( DELETED() ), CLR_HRED, CLR_BLUE ),;
                      RGB( 198, 255, 198 ) }, ;
                  { If( ( oBrw:cAlias )->( DELETED() ), CLR_HRED, CLR_BLUE ),;
                      RGB( 232, 255, 232 ) } ) }

   oBrw:bClrSel = { || { If( ( oBrw:cAlias )->( DELETED() ), CLR_HRED, CLR_WHITE ),;
                           RGB( 34, 177, 76 ) } }
   
   cClrBack = Eval( oBrw:bClrSelFocus )[ 2 ]

   oBrw:bClrSelFocus  := { || { If( ( oBrw:cAlias )->( DELETED() ), CLR_HRED, CLR_WHITE ),;
                              cClrBack } }

   oBrw:SetColor( CLR_CYAN, RGB( 232, 255, 232 ) )

RETURN NIL
// By Giovanny Vecchi - TESTRAD.PRG
FUNCTION CTRLS_COLORS( f_oDlgContainer )

   LOCAL lc_aCtrls := {}, lc_iFor := 0
   LOCAL lc_aItemsRadio := {}

   lc_aCtrls := f_oDlgContainer:aControls

   FOR lc_iFor := 1 TO Len( lc_aCtrls )

      IF ValType( lc_aCtrls[lc_iFor] ) == "O"

         IF lc_aCtrls[lc_iFor]:ClassName() == "TRADIO"

            aEval( lc_aCtrls[lc_iFor]:oRadMenu:aItems,                 ;
                   {|_oRadId|{ SetWindowTheme( _oRadId:hWnd, "", "" ), ;
                   _oRadId:SetColor( METRO_ORANGE, METRO_AMBER ) } } )
                   
         ELSEIF lc_aCtrls[lc_iFor]:ClassName() == "TCHECKBOX"

            SetWindowTheme( lc_aCtrls[lc_iFor]:hWnd, "", "" )

            // C:\FWH\INCLUDE\COLORS.CH
            lc_aCtrls[lc_iFor]:SetColor( METRO_RED, METRO_AMBER )

         ENDIF

      ENDIF

   NEXT

RETURN NIL

FUNCTION LIBERA_TUDO() // CLOSE ALL

   IF File( "testxbr6.log" )
      DELETEFILE( "testxbr6.log" )
   ENDIF

   dbCommitAll()
   dbUnlockAll()
   dbCloseAll()
   FreeResources()
   RELEASE ALL
   SysRefresh()

   hb_gcAll( .T. )

   CLEAR MEMORY

   PostQuitMessage( 0 )

   QUIT

RETURN NIL

// FIM / END                 kapiabafwh@gmail.com
 

Regards, saludos.

[karinha]

Download completo:

https://mega.nz/file/BMFQCLoQ#6XUdt023gjxxPr-iYUu6WhLpqtt2xS98D2sqmtaEF7o

Regards, saludos.

[karinha]

Marc, it doesn't work. I don't like this display showing .T., .F., it should show YES or NO or a BITMAP. Download the example and modify it for me, please.

Marc, no funciona. No me gusta esta pantalla que muestra .T., .F., debería mostrar SÍ o NO o un BITMAP. Descargue el ejemplo y modifíquelo por mí, por favor.

Code: Select all  Expand view  RUN

   WITH OBJECT oBrw:oCol( "Married" )

      oCol := oBrw:AddCol()

      //oCol:bStrData   := { || IIF( _FIELD->Married, "SI", "NO")}

      oCol:AddResource("YES")  //  If you want to use bitmaps
      oCol:AddResource("NO")

      oCol:bBmpData   := { || iif( _FIELD->Married, 1, 2) }  //  Showing the bitmaps

      :oHeaderFont := oVFont

      :cHeader := "Casado"

   END
 

Tks, gracias.

Regards, saludos.

[Marc Venken]

Here you see A Xbrowse with bitmaps. Adjust the aBmp with your data. (a sample from Mr. Rao that I changed)

Code: Select all  Expand view  RUN

#include "fivewin.ch"

function Main()

   static aBmp := { "c:\marc32\bitmaps\16x16\yes.bmp","c:\marc32\bitmaps\16x16\stop.bmp","c:\marc32\bitmaps\32x32\copy.bmp","c:\marc32\bitmaps\32x32\view.bmp" }

   local oDlg, oFont, oBrw

   USE CUSTOMER

   DEFINE FONT oFont NAME "TAHOMA" SIZE 0,-14
   DEFINE DIALOG oDlg SIZE 700,400 PIXEL TRUEPIXEL FONT oFont

   @ 20,20 XBROWSE oBrw SIZE -20,-20 PIXEL OF oDlg ;
      DATASOURCE "CUSTOMER" ;
      COLUMNS "FIRST", "AGE", "SALARY","MARRIED" ;
      LINES NOBORDER

   oBrw:nStretchCol      := STRETCHCOL_WIDEST // Ajusta as colunas do xBrowse.

   WITH OBJECT oBrw
      :nRowHeight    := 30
      WITH OBJECT :Age
         :nWidth        := 100
         :nDataStrAlign := AL_CENTER
         :AddBitmap( { FW_BmpPlus(), FW_BmpMinus() } )

         // Right Button
         :nEditType     := EDIT_BUTTON
         :bEditBlock    := { |r,c,oCol| oCol:Value + 1 }
         :nBtnBmp       := 1
         :lBtnTransparent  := .t.

         // Left Button
         :bBmpData      := { |v,lSel| If( lSel, 2, 0 ) }
         :bBmpAction    := { |oCol| oCol:VarPut( oCol:Value - 1 ) }
      END
      WITH OBJECT :Salary
         :nEditType     := EDIT_GET
         :AddBitmap( { FW_BmpPlus(), FW_BmpMinus() } )
         :bBmpData      := { || If(oBrw:salary:value > 50000, 1, 2 ) }
      END
      WITH OBJECT :Married
         :nEditType := EDIT_LISTBOX
         :aEditListTxt   := { "SI", "No"}  //  Select text for field
         :aEditListBound := { .t., .f. }

         :AddBitmap( aBmp )
         //:bStrData   := { || IF( oBrw:Married:Value, "SI", "NO")}
         :bStrData   := { || ""} //  No Text, only BMP
         :bBmpData      := { || If(oBrw:Married:value , 1, 2 ) }
      END

      :CreateFromCode()
   END

   ACTIVATE DIALOG oDlg CENTERED
   RELEASE FONT oFont

return nil

 

[Otto]

Dear João,
> Master OTTO, I challenge you to do better! hahahahahaha.

I gladly accept the challenge.
If I understand you correctly, you would like to see the program TESTXBR7.PRG as a mod harbour version?

Best regards,
Otto

[Marc Venken]

Using Setup Xbrowse is easier like this if you are more into it.

Code: Select all  Expand view  RUN

    aVelden3 :=  { ;
   { "bond"       , "Bond"          ,nil,  60 }, ; // 2    // DBF Field,  Name Xbrowse Header,  Picture,  Size column
   { "naam"       , "Naam"          ,nil, 110 }, ; // 3
   { "voornaam"   , "Voornaam"      ,nil, 110 }, ; // 4
   { "ploeg2018"  , "P_2018"         ,"@!", 80}, ; // 6
   { "ploeg2017"  , "P_2017"         ,"@!", 80}, ; // 6
   { "brief2017"  , "Brief"         ,nil,  70 }, ; // 5
   { "Lidg2018"   , "J2018"         ,nil,  70 }, ; // 8
   { "Lidg2017"   , "J2017"         ,nil,  70 }, ; // 8
   { "Update"     , "Update"        ,nil, 100 },;   // 16
   { "documenten" , "Documenten"    ,nil, 100 },;   // 16
   { "exlid"      , "Exlid"       ,nil,  45 },;   // 12
   { "mailspel"   , "Email Speler"  ,nil, 40 }, ; // 12
   { "mailoud1"   , "Ouder1"        ,nil, 40 }, ; // 10
   { "mailoud2"   , "Ouder2"        ,nil, 40 }} // 11


   //oRs:lAutoAppend   := .t.

   @ 0,0 XBROWSE oBrw[3] size -1,-1 PIXEL OF  oFld:aDialogs[ 3 ] font oFont ;
      DATASOURCE oRs ;
      COLUMNS aVelden3;
      AUTOSORT CELL LINES NOBORDER FOOTERS
      //FASTEDIT

//  USING IT HERE WITH (oBrw[3] = Object you made) you address all columns at once
     oBrw[3]:nEditTypes = EDIT_GET  // every column will have this edit type
     oBrw[3]:SetChecks()

     oBrw[3]:Naam:bClrHeader := { || { CLR_RED, 155 } }  //  You can make 1 item for a specific column (Naam) , so no need for the WITH... END clause
     oBrw[3]:voornaam:bClrHeader := { || { CLR_RED, 155 } }

     oBrw[3]:nHeadStrAligns  := AL_CENTER
 
     oBrw[3]:Bond:bClrStd := { || IF( empty(oRs:bond) , { CLR_BLACK,RGB(255,102,0) } , { CLR_BLACK,CLR_WHITE } ) }


   WITH OBJECT oBrw[3]

      :SetGroupHeader( "Lidgelden", oBrw[3]:oCol("J2018"):nCreationOrder, oBrw[3]:oCol("J2017"):nCreationOrder )
      :SetGroupHeader( "Emails", oBrw[3]:oCol("Email Speler"):nCreationOrder, oBrw[3]:oCol("Ouder2"):nCreationOrder )

      //:nFreeze:=5
      //:bgotfocus     := { || oBtnfoto:show()}
      //:blostfocus     := { || oBtnfoto:hide()}

      :bChange       := { || oImage:Refresh() }
      :bClrSelFocus = {|| { CLR_WHITE, RGB(0, 128, 128) } } // CUANDO TIENE EL FOCUS

//  FOR EVERY COLUMN YOU CAN DEFINE STUFF USING WITH ... END  best use for several settings.  1 setting see above

      WITH OBJECT :Bond
         :nEditType     := EDIT_GET
         :AddBitmap( { FW_BmpPlus(), FW_BmpMinus() } )
         :bBmpData      := { || If(oBrw[3]:Bond:value > 50000, 1, 2 ) }
      END
 
   END

   oBrw[3]:CreateFromCode()

 

[Marc Venken]

Dear João,
> Master OTTO, I challenge you to do better! hahahahahaha.

I gladly accept the challenge.
If I understand you correctly, you would like to see the program TESTXBR7.PRG as a mod harbour version?

Best regards,
Otto

And we (I) would like to see the code and be able to compile it. Out of curriossity

[Otto]

Marc,

sure, I can post the source code.

Do you have a Mod Harbour server installed?

Best regards,
Otto

[Otto]

Hello Mark,
The program also works with WEBVIEW2, directly as a FIVEWIN-EXE.
Here you have a source.
This is just a quick test with a dummy JSON.
Normally the JSON would come from the server.

However, I would prefer to do the example with mod harbour because I make all the new programs with mod harbour and I am familiar with it.
But maybe, if there is interest, the program could be modified as well.
Instead of loading the data from the server with the fetch method, they would be sent and received as shown here.

Code: Select all  Expand view  RUN

oWebView := TWebView():New(1 , hWnd )
oWebView:bOnBind = { | cJson, cCalls | ;
hb_jsondecode( cJson, @hPost ), fromjavascript(hPost) ,   ;
oWebView:Return( cCalls, 0, "{ 'result': '" + csend2js + "' }" ) }
oWebView:Bind( "SendToFWH" )
 

Everything else would remain the same.

Best regards,
Otto

Code: Select all  Expand view  RUN

    // Please install https://developer.microsoft.com/en-us/m ... /webview2/ x86 version before using it

    #include "FiveWin.ch"

    function Main()

       local oWebView := TWebView():New()

       oWebView:SetHtml( Html() )
       oWebView:SetTitle( "Please identify with your credentials" )
       oWebView:SetSize( 1200, 800 )
       oWebView:SetUserAgent( "Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/103.0.5060.53 Mobile Safari/537.36" )
       oWebView:Bind( "SendToFWH" )
       sleep( 300 )
       oWebView:Run()
       oWebView:Destroy()

    return nil


    function Html()

       local cHtml

       TEXT INTO cHtml
<!DOCTYPE html>
<html lang="de">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>


 


    <style>
        #table-container {
            height: 300px;
            overflow: auto;
        }

/* Add this to the style block in the <head> section */
    .no-select {
    user-select: none; /* For modern browsers */
    -webkit-user-select: none; /* For older WebKit-based browsers */
    -moz-user-select: none; /* For Firefox */
    -ms-user-select: none; /* For older IE versions */
}
    /* Custom striped row styles for Bootstrap 5.x */
    .table-striped tbody tr:nth-of-type(odd) {
        background-color: #b3d89e !important; /* Light gray for odd rows */
    }

    .table-striped tbody tr:nth-of-type(even) {
        background-color: #e9ecef; /* Slightly darker gray for even rows */
    }


        .filter-div {
            display: none;
            /* Beginnt versteckt */
            margin: 0;
            padding: 0;
        }

        #filter-container {
            margin: 0;
            padding: 0;
        }

        .filter-section {
            display: flex;
            align-items: center;
            margin: 0;
            padding: 0;
        }

        .filter-section label {
            margin: 0;
            padding: 0;
        }

        .grid-container {
            display: grid;
            grid-template-columns: min-content auto;
            column-gap: 10px;
            align-items: center;
        }

        .inputs-container {
            display: flex;
            gap: 10px;
        }
    </style>
</head>

<body>
    <div class="container mt-5">
        <div class="row">
            <div class="col-md-12">
                <h2 class="mb-4">xBrowse Filter Advanced 5.0 Model</h2>

             

                <div id="table-container" class="border mb-3">
           
                        <table class="table table-striped no-select">
                        <thead>
                            <tr>
                                <th>#</th>
                                <th>FIRST</th>
                                <th>LAST</th>
                                <th>STREET</th>
                                <th>CITY</th>
                                <th>STATE</th>
                                <th>ZIP</th>
                                <th>HIREDATE</th>
                                <th>MARRIED</th>
                                <th>AGE</th>
                                <th>SALARY</th>
                                <th>NOTES</th>
                            </tr>
                        </thead>
                        <tbody>
                            <!-- Table rows will be populated by JavaScript -->
                        </tbody>
                    </table>
                </div>

                <!-- Dynamische Filter-Divs -->
                <div id="filter-container">
                    <div id="age-div" class="filter-div grid-container border mb-2 p-2" style="display: none;">
                        <label>Alter:</label>
                        <div class="inputs-container">
                            <label class="d-flex align-items-center gap-1">
                                <input type="radio" name="age-status" value="20"> 20
                            </label>
                            <label class="d-flex align-items-center gap-1">
                                <input type="radio" name="age-status" value="Über 20 Jahre"> Über 20 Jahre
                            </label>
                        </div>
                    </div>

                    <div id="married-div" class="filter-div grid-container border mb-2 p-2" style="display: none;">
                        <label>Verheiratet:</label>
                        <div class="inputs-container">
                            <label class="d-flex align-items-center gap-1">
                                <input type="radio" name="married-status" value="Verheiratet"> Verheiratet
                            </label>
                            <label class="d-flex align-items-center gap-1">
                                <input type="radio" name="married-status" value="Nicht verheiratet"> Nicht verheiratet
                            </label>
                        </div>
                    </div>
                </div>

                <!-- Filterabschnitt -->
                <div class="filter-section grid-container">
                    <label><strong>Gefiltert nach:</strong></label>
                    <div>
                        <input type="checkbox" id="filter-age"> Alter
                        <input type="checkbox" id="filter-married" class="ms-3"> Verheiratet
                    </div>
                </div>

            </div>

         
        </div>
    </div>

    <!-- Insert the JavaScript code -->


    <script>

$(document).ready(function () {
    const increment = 50;
    const baseHeight = 300;
    const dummyData = [
        {
            "#": 1, "FIRST": "John", "LAST": "Doe", "STREET": "123 Elm St", "CITY": "Springfield",
            "STATE": "IL", "ZIP": "62701", "HIREDATE": "2020-01-15", "MARRIED": "Yes",
            "AGE": 30, "SALARY": "$50,000", "NOTES": "Promoted last year"
        },
        {
            "#": 2, "FIRST": "Mair", "LAST": "Smith", "STREET": "456 Oak St", "CITY": "Columbus",
            "STATE": "OH", "ZIP": "43215", "HIREDATE": "2018-07-01", "MARRIED": "No",
            "AGE": 25, "SALARY": "$45,000", "NOTES": "Recently completed training"
        },
        {
            "#": 2, "FIRST": "Huber", "LAST": "Smith", "STREET": "456 Oak St", "CITY": "Columbus",
            "STATE": "OH", "ZIP": "43215", "HIREDATE": "2018-07-01", "MARRIED": "No",
            "AGE": 25, "SALARY": "$45,000", "NOTES": "Recently completed training"
        },
        {
            "#": 2, "FIRST": "Müller", "LAST": "Smith", "STREET": "456 Oak St", "CITY": "Columbus",
            "STATE": "OH", "ZIP": "43215", "HIREDATE": "2018-07-01", "MARRIED": "No",
            "AGE": 25, "SALARY": "$45,000", "NOTES": "Recently completed training"
        },
        {
            "#": 2, "FIRST": "Konrad", "LAST": "Smith", "STREET": "456 Oak St", "CITY": "Columbus",
            "STATE": "OH", "ZIP": "43215", "HIREDATE": "2018-07-01", "MARRIED": "No",
            "AGE": 25, "SALARY": "$45,000", "NOTES": "Recently completed training"
        },
        {
            "#": 3, "FIRST": "Sam", "LAST": "Wilson", "STREET": "789 Pine St", "CITY": "Austin",
            "STATE": "TX", "ZIP": "73301", "HIREDATE": "2019-10-10", "MARRIED": "Yes",
            "AGE": 40, "SALARY": "$60,000", "NOTES": "Leads the marketing team"
        }
    ];

    function populateTable(data) {
        let tableBody = $('table tbody');
        tableBody.empty();  

        data.forEach((row) => {
            let rowHtml = `<tr>
                <td>${row["#"]}</td>
                <td>${row["FIRST"]}</td>
                <td>${row["LAST"]}</td>
                <td>${row["STREET"]}</td>
                <td>${row["CITY"]}</td>
                <td>${row["STATE"]}</td>
                <td>${row["ZIP"]}</td>
                <td>${row["HIREDATE"]}</td>
                <td>${row["MARRIED"]}</td>
                <td>${row["AGE"]}</td>
                <td>${row["SALARY"]}</td>
                <td>${row["NOTES"]}</td>
            </tr>`;
            tableBody.append(rowHtml);
        });
    }

    populateTable(dummyData);


    function adjustTableHeight() {
        let filtersHeight = 0;
        if ($('#age-div').is(':visible')) filtersHeight += $('#age-div').outerHeight(true);
        if ($('#married-div').is(':visible')) filtersHeight += $('#married-div').outerHeight(true);

        const newHeight = baseHeight - filtersHeight;
        $('#table-container').height(newHeight >= 50 ? newHeight : 50);
    }

    function sendFilterData() {
        const ageStatus = $('input[name="age-status"]:checked').val() || '';
        const marriedStatus = $('input[name="married-status"]:checked').val() || '';
        const filterAge = $('#filter-age').is(':checked');
        const filterMarried = $('#filter-married').is(':checked');

        const filterData = {
            age: ageStatus,
            married: marriedStatus,
            filterAge: filterAge,
            filterMarried: filterMarried
        };

        console.log(filterData);

        populateTable(dummyData.filter(item => {
            return true;
        }));
    }

    $('#filter-age').change(function () {
        $('#age-div').toggle(this.checked);
        adjustTableHeight();
        sendFilterData();
    });

    $('#filter-married').change(function () {
        $('#married-div').toggle(this.checked);
        adjustTableHeight();
        sendFilterData();
    });

    $('input[name="age-status"]').change(function () {
        sendFilterData();
    });

    $('input[name="married-status"]').change(function () {
        sendFilterData();
    });
});


    </script>
   
</body>

</html>

       ENDTEXT

    return cHtml
   

 

 

[Otto]

Linking in a CSS:
<link href="https://bootswatch.com/5/morph/bootstrap.css" rel="stylesheet">

[karinha]

Thanks Marc. Problem solved. Gracias marc. Problema resuelto.

Code: Select all  Expand view  RUN

   WITH OBJECT oBrw
      // :Married:SetCheck( , .T. )  // EDITA
      :Married:SetCheck()            // NO EDITA
   END
 

Dear Otto, your WEB solution looks amazing. Very good indeed, the future is coming. Thanks.

Estimado Otto, su solución WEB parece increíble. Muy bien por cierto, el futuro está por llegar. Gracias.


Regards, saludos.