Hi Thierry,
Button groups no longer align according to property of wBScolAlign
In the attached example, this property is "R" for the [Valider] and [Annuler] buttons
Hi Vincent,
Can you reproduce in every similar case?
Difficult, I'll try to sort it out and get back to you
However, it seems to me that the behavior of the buttons is different when one of them is a class
Can you remind us of the principle please ?
If one of the buttons has an alignment directive, the group follows this directive or for a left alignment you have to mark the left button and the same on the right ?
However, it seems to me that the behavior of the buttons is different when one of them is a class
For example, in this screen [Fermer] is a class with a wBScolAlign = "R" that does not appear
When the button is a class, the container must contain:
margin-left: auto
Hi Vincent,
Thanks for these details
I understand that, based on the VFP buttons width, FoxInCloud has assigned a .col-lg-2
class, obviously too tight for the buttons rendered in Bootstrap.
You can confirm this in the browser dev tools by changing in the class attribute:
offset-lg-5
tooffset-lg-4
col-lg-2
tocol-lg-3
To make FoxInCloud assign these classes, you can just make your VFP buttons larger, either at design time or in .Init()
.
OK, thank you Thierry
There remains the wBScolAlign which is not interpreted when the button is a class
Hi Vincent,
All controls are based on a class, FoxIncloud makes no difference on that.
On the various screenshots you provide, I see some buttons aligned right OK, some not; so it happens only in some cases; we need to find out which ones and why.
On the listparties.scx
screenshot you shared, I see the buttons are not wrapped in a Bootstrap column (<div … class="col-xx-99…"…>
), reason why valider
and annuler
are stacked under ajout clients
.
I'll try to reproduce based one your source code you shared privately.
Please try to identify all the forms where this happens.
TIA
Hi Vincent,
Can't reproduce with the code you shared… because of this error when running snoTest.prg
:
Application could not start: "Method or procedure menuappli(): error #12 ("Variable 'INFOSMAJ' is not found") at code line #75 ("IF FDATE (Mchemin + "Fichiers\Infos_MAJ.Html", 1) > InfosMaj")"
TIA
OK Thierry, I synchronize ...
Hi Vincent,
I had to do this change to start the server :
modify command c:\…\menuappli.prg
&& replace
IF FDATE (Mchemin + "Fichiers\Infos_MAJ.Html", 1) > InfosMaj
&& by
IF !lDevMode() and FDATE (Mchemin + "Fichiers\Infos_MAJ.Html", 1) > InfosMaj
I think checking the data structure is useful in production mode only.
do c:\…\snotest.prg with "listeparties.scx"
yields the following errors :
"Error: 94
Message: Must specify additional parameters.
Code: LPARAMETERS oForm, oGrid, formWidth
Program: ajustegrid
Line No: 161"
"Error: 1734
Message: Property WZOOM is not found.
Code: * oForm.Width_ correspond à la taille d'origine (vhecr.vcx)
Program: ajustegrid
Line No: 165"
"Error: 107
Message: Operator/operand type mismatch.
Code: FOR EACH oGrc IN .Columns FOXOBJECT
Program: ajustegrid
Line No: 170"
"Error: 107
Message: Operator/operand type mismatch.
Code: FOR EACH oGrc IN .Columns FOXOBJECT
Program: ajustegrid
Line No: 170"
"Error: 94
Message: Must specify additional parameters.
Code: LPARAMETERS oForm, oGrid, formWidth
Program: ajustegrid
Line No: 161"
"Error: 1734
Message: Property WZOOM is not found.
Code: * oForm.Width_ correspond à la taille d'origine (vhecr.vcx)
Program: ajustegrid
Line No: 165"
"Error: 107
Message: Operator/operand type mismatch.
Code: FOR EACH oGrc IN .Columns FOXOBJECT
Program: ajustegrid
Line No: 170"
"Error: 107
Message: Operator/operand type mismatch.
Code: FOR EACH oGrc IN .Columns FOXOBJECT
Program: ajustegrid
Line No: 170"
"Error: 94
Message: Must specify additional parameters.
Code: LPARAMETERS oForm, oGrid, formWidth
Program: ajustegrid
Line No: 161"
"Error: 1734
Message: Property WZOOM is not found.
Code: * oForm.Width_ correspond à la taille d'origine (vhecr.vcx)
Program: ajustegrid
Line No: 165"
"Error: 107
Message: Operator/operand type mismatch.
Code: FOR EACH oGrc IN .Columns FOXOBJECT
Program: ajustegrid
Line No: 170"
"Error: 107
Message: Operator/operand type mismatch.
Code: FOR EACH oGrc IN .Columns FOXOBJECT
Program: ajustegrid
Line No: 170"
"Error: 94
Message: Must specify additional parameters.
Code: LPARAMETERS oForm, oGrid, formWidth
Program: ajustegrid
Line No: 161"
"Error: 1734
Message: Property WZOOM is not found.
Code: * oForm.Width_ correspond à la taille d'origine (vhecr.vcx)
Program: ajustegrid
Line No: 165"
"Error: 107
Message: Operator/operand type mismatch.
Code: FOR EACH oGrc IN .Columns FOXOBJECT
Program: ajustegrid
Line No: 170"
"Error: 107
Message: Operator/operand type mismatch.
Code: FOR EACH oGrc IN .Columns FOXOBJECT
Program: ajustegrid
Line No: 170"
Does not affect HTML generation, however could be useful to fix.
This layout falls into a caveat of the Bootstrap HTML generator.
I think I know why it happens, however it was one of the difficult situation the algorithm has to face… unsure we can fix it definitely.
Fortunately I could easily fix by wrapping all controls below the grid into a container:
<!-- Generated on 06/10/2022 10:32:05 in 0,84 sec. by FAS version 3.0.1-beta.4 of 31/07/2022 16:42:02 /-->
<div id="listeparties_scx" class="listeparties_scx form bootstrap" style="position:relative;">
<span id="listeparties_scx-waitpic" class="fa fa-2x fa-spinner fa-pulse" aria-hidden="true" style="position:absolute;display:none;"></span>
<div id="listeparties_scx-grid" class="listeparties_scx-grid needsclick bootstrap mb-3" title="Double clic pour valider votre choix">
</div>
<div id="listeparties_scx-vhccnt1" class="listeparties_scx-vhccnt1 position-relative">
<div class="mb-3">
<div class="form-check" id="listeparties_scx-vhccnt1-check1_div"><input type="checkbox" id="listeparties_scx-vhccnt1-check1" class="listeparties_scx-vhccnt1-check1 standard form-check-input" tabindex="3" accesskey="T" size="2" autocomplete="off"><label for="listeparties_scx-vhccnt1-check1" id="listeparties_scx-vhccnt1-check1_lbl" class="listeparties_scx-vhccnt1-check1 standard ChkOptLabel form-check-label" accesskey="T">Tous / Aucun</label></div>
</div>
<div class="row row-abandon1">
<div class="col col-valider1 col-12 col-sm-5 col-md-4 col-lg-3 col-xl-2 text-start">
<button type="button" id="listeparties_scx-vhccnt1-valider1" class="listeparties_scx-vhccnt1-valider1 doo-valider btn-outline-secondary btn" tabindex="4" accesskey="V"><span class="fa fa-check text-success fa-lg" aria-hidden="true"></span> Valider</button>
</div>
<div class="col col-ajoutclient1 col-12 col-sm-6 col-md-4 offset-lg-2 col-lg-3 offset-xl-3 text-center">
<button type="button" id="listeparties_scx-vhccnt1-ajoutclient1" class="listeparties_scx-vhccnt1-ajoutclient1 btn-outline-secondary btn" tabindex="5"><span class="fa fa-user-plus text-primary" aria-hidden="true"></span> Ajout client</button>
</div>
<div class="col col-abandon1 col-12 col-md-4 offset-lg-1 col-lg-3 offset-xl-2 col-xl-2 text-end">
<button type="button" id="listeparties_scx-vhccnt1-abandon1" class="listeparties_scx-vhccnt1-abandon1 floatRight btn-outline-secondary btn" tabindex="6" accesskey="A"><span class="fa fa-ban text-danger fa-lg" aria-hidden="true"></span> Annuler</button>
</div>
</div>
</div>
</div>
<!--/ Generated on 06/10/2022 10:32:05 in 0,84 sec. by FAS version 3.0.1-beta.4 of 31/07/2022 16:42:02 -->
Now buttons are wrapped into Bootstrap <div … class="col-xx-99…"…>
columns.
Here is the modified VFP form source code (listeParties.sc2
)
*--------------------------------------------------------------------------------------------------------------------------------------------------------
* (ES) AUTOGENERADO - ¡¡ATENCIÓN!! - ¡¡NO PENSADO PARA EJECUTAR!! USAR SOLAMENTE PARA INTEGRAR CAMBIOS Y ALMACENAR CON HERRAMIENTAS SCM!!
* (EN) AUTOGENERATED - ATTENTION!! - NOT INTENDED FOR EXECUTION!! USE ONLY FOR MERGING CHANGES AND STORING WITH SCM TOOLS!!
*--------------------------------------------------------------------------------------------------------------------------------------------------------
*< FOXBIN2PRG: Version="1.19" SourceFile="listeparties.scx" /> (Solo para binarios VFP 9 / Only for VFP 9 binaries)
*
*
#INCLUDE "..\..\..\fichiers\constant.h"
DEFINE CLASS dataenvironment AS dataenvironment
*< CLASSDATA: Baseclass="dataenvironment" Timestamp="" Scale="" Uniqueid="" ClassIcon="1" />
DataSource = .NULL.
Height = 200
Left = 1
Name = "Dataenvironment"
Top = 220
Width = 520
ENDDEFINE
DEFINE CLASS listeparties AS vhecr OF "..\..\..\classes\vhecr.vcx"
*< CLASSDATA: Baseclass="form" Timestamp="" Scale="" Uniqueid="" />
*-- OBJECTDATA items order determines ZOrder / El orden de los items OBJECTDATA determina el ZOrder
*< OBJECTDATA: ObjPath="Grid" UniqueID="" Timestamp="" />
*< OBJECTDATA: ObjPath="Grid.Column1.Header1" UniqueID="" Timestamp="" />
*< OBJECTDATA: ObjPath="Grid.Column1.Text1" UniqueID="" Timestamp="" />
*< OBJECTDATA: ObjPath="Grid.Column1.CHECK1" UniqueID="" Timestamp="" />
*< OBJECTDATA: ObjPath="Grid.Column2.Header1" UniqueID="" Timestamp="" />
*< OBJECTDATA: ObjPath="Grid.Column2.Text1" UniqueID="" Timestamp="" />
*< OBJECTDATA: ObjPath="Vhccnt1" UniqueID="" Timestamp="" />
*< OBJECTDATA: ObjPath="Vhccnt1.Check1" UniqueID="" Timestamp="" />
*< OBJECTDATA: ObjPath="Vhccnt1.Valider1" UniqueID="" Timestamp="" />
*< OBJECTDATA: ObjPath="Vhccnt1.Ajoutclient1" UniqueID="" Timestamp="" />
*< OBJECTDATA: ObjPath="Vhccnt1.Abandon1" UniqueID="" Timestamp="" />
Caption = "Parties liées au dossier"
DoCreate = .T.
Name = "ListeParties"
waitpic.Height = 20
waitpic.Name = "waitpic"
waitpic.Width = 20
waitpic.ZOrderSet = 0
ADD OBJECT 'Grid' AS gridlist WITH ;
ColumnCount = 2, ;
Height = 247, ;
Left = 15, ;
Name = "Grid", ;
Panel = 1, ;
RecordSource = "CParties", ;
RowHeight = 20, ;
TabIndex = 1, ;
Top = 5, ;
wcolsresize = 1.5, ;
Width = 590, ;
ZOrderSet = 1, ;
Column1.Alignment = 2, ;
Column1.ControlSource = "CParties.Selection", ;
Column1.CurrentControl = "CHECK1", ;
Column1.Name = "Column1", ;
Column1.Sparse = .F., ;
Column1.Width = 14, ;
Column2.ControlSource = "CParties.Idinfos", ;
Column2.Name = "Column2", ;
Column2.ReadOnly = .T., ;
Column2.Width = 542
*< END OBJECT: ClassLib="..\..\..\classes\gridlist.vcx" BaseClass="grid" />
ADD OBJECT 'Grid.Column1.CHECK1' AS vhcchk WITH ;
Alignment = 0, ;
Caption = "", ;
Centered = .T., ;
Name = "CHECK1"
*< END OBJECT: ClassLib="..\..\..\classes\vhc.vcx" BaseClass="checkbox" />
ADD OBJECT 'Grid.Column1.Header1' AS header WITH ;
Caption = "", ;
Name = "Header1"
*< END OBJECT: BaseClass="header" />
ADD OBJECT 'Grid.Column1.Text1' AS vhctxt WITH ;
BackColor = 255,255,255, ;
BorderStyle = 0, ;
ForeColor = 0,0,0, ;
Margin = 0, ;
Name = "Text1"
*< END OBJECT: ClassLib="..\..\..\classes\vhc.vcx" BaseClass="textbox" />
ADD OBJECT 'Grid.Column2.Header1' AS header WITH ;
Alignment = 2, ;
Caption = "Identification des parties", ;
FontSize = 10, ;
Name = "Header1"
*< END OBJECT: BaseClass="header" />
ADD OBJECT 'Grid.Column2.Text1' AS vhctxt WITH ;
BorderStyle = 0, ;
Margin = 0, ;
Name = "Text1", ;
ReadOnly = .T.
*< END OBJECT: ClassLib="..\..\..\classes\vhc.vcx" BaseClass="textbox" />
ADD OBJECT 'Vhccnt1' AS vhccnt WITH ;
BackStyle = 0, ;
Height = 61, ;
Left = 15, ;
Name = "Vhccnt1", ;
Top = 260, ;
Width = 590
*< END OBJECT: ClassLib="..\..\..\classes\vhc.vcx" BaseClass="container" />
ADD OBJECT 'Vhccnt1.Abandon1' AS abandon WITH ;
Height = 27, ;
Left = 490, ;
Name = "Abandon1", ;
TabIndex = 5, ;
Top = 30, ;
ZOrderSet = 5
*< END OBJECT: ClassLib="..\..\..\classes\abandon.vcx" BaseClass="commandbutton" />
ADD OBJECT 'Vhccnt1.Ajoutclient1' AS ajoutclient WITH ;
Left = 235, ;
Name = "Ajoutclient1", ;
TabIndex = 4, ;
Top = 30, ;
wbscolalign = C, ;
ZOrderSet = 4
*< END OBJECT: ClassLib="..\..\clients\ajoutclient.vcx" BaseClass="commandbutton" />
ADD OBJECT 'Vhccnt1.Check1' AS vhcchk WITH ;
Alignment = 0, ;
Caption = "\<Tous / Aucun", ;
Height = 17, ;
Left = 6, ;
Name = "Check1", ;
TabIndex = 2, ;
Top = 5, ;
Value = .F., ;
wbscolalign = C, ;
Width = 89, ;
ZOrderSet = 2
*< END OBJECT: ClassLib="..\..\..\classes\vhc.vcx" BaseClass="checkbox" />
ADD OBJECT 'Vhccnt1.Valider1' AS valider WITH ;
Left = 5, ;
Name = "Valider1", ;
TabIndex = 3, ;
Top = 31, ;
ZOrderSet = 3
*< END OBJECT: ClassLib="..\..\..\classes\valider.vcx" BaseClass="commandbutton" />
PROCEDURE Init
LPARAMETERS callBackMethod
WITH THISFORM
IF .wlLAN .OR. .wlInitFirst
DODEFAULT()
ENDIF
IF .wlInitFirst
RETURN
ENDIF
.Grid.RecordSource = Vierge
eCard (A.Insert, .F., .F., .F., .T.)
.Grid.RecordSource = "CParties"
ENDWITH
DODEFAULT (m.callBackMethod)
ENDPROC
PROCEDURE Load
lParameters reminder_in_your_subclass_call_DoDefault_after_opening_all_views_and_cursorAdapters && {en} see sample impl. in awFrm code {fr} voir exemples impl. dans code de awFrm
DO CreateCparties IN \VHDev\Appli\Dossiers\Gesdoss
RETURN DODEFAULT()
ENDPROC
PROCEDURE Vhccnt1.Ajoutclient1.Init
THIS.Left = THIS.Left + 20
RETURN DODEFAULT()
ENDPROC
PROCEDURE Vhccnt1.Check1.InteractiveChange
LPARAMETERS Useless_Parm && Documentation d'implémentation : voir le code hérité de aw.vcx!aw???.Interactivechange() (cliquez 'Voir le code parent')
IF (Type('m.thisForm.wlHTMLgen') == 'L' AND m.thisForm.wlHTMLgen)
RETURN .T.
ENDIF
REPLACE ALL Selection WITH THIS.Value IN CParties
THISFORM.Refresh
ENDPROC
PROCEDURE Vhccnt1.Valider1.Click
LPARAMETERS nButton, nShift, nXcoord, nYcoord && Documentation d'implémentation : voir le code hérité de aw.vcx!aw???.Click() (cliquez 'Voir le code parent')
IF (Type('m.thisForm.wlHTMLgen') == 'L' AND m.thisForm.wlHTMLgen)
RETURN .T.
ENDIF
DO AfterRel IN \VHDev\Program\Init
DODEFAULT()
ENDPROC
ENDDEFINE