Hi,

I set

this.wcHTML = "replacement html..."

in form.wchtmlgen() so that I can output totally new HTML.

The new HTML is rendered, but only inside the dimensions of the original form (opened with awserver.wFormStandardPage).
What can be done to remove this limitation, so that the HTML can be full-page?

(I know I could show an HTML page directly, but I would prefer to keep the logic and code flow consistent and just alter the UI of an existing form).

Thanks

Paul

you can play with thisForm.Width= and thisForm.Height=

I have found that if I set width and height in form.wcHTMLGen then it works the first time the user sees the form, but when a user opens the form a second time then the changes have not been kept.
wcPropSave does contain those property names.

I would like to set the properties in form.wcHTMLGen because there is generic code there dealing with custom HTML, but I assume there is a timing problem with this.
What should I do to make the changes permanent?

.
Also (I am sure this is a stupid question but I will ask anyway 😉 ) ...
I have replaced the HTML of the form using this.wcHTML = in wcHTMlGen(). Cool, the replacement HTML is shown.
But, how do I link the events of the page elements to FiC?
For example :
the VFP form has a button named button1 and clicking that button calls a method
I have found that button in the original HTML file produced by FiC, called something like loginform-button1, and used the same name, class, type and ID for the button in the new HTML.
But, clicking the button in the new HTML does nothing...
I notice that the .js file generated by FiC after using the new HTML now only contains the js related to tabindex and focus, it no longer contains

FoxInCloud.formActivateObserve('loginform', null, null);
FoxInCloud.documentInit('loginform');

Are these two lines the "glue" that binds the DOM events to the FiC / WC handler?
Do I have to make the div hierarchy and their names the same as in the original HTML?
Or am I missing something else?

Thanks
Paul

if I set width and height in form.wcHTMLGen then it works the first time the user sees the form, but when a user opens the form a second time then the changes have not been kept.

You can override xxxProcess.wFormStandardPage_Output():

* ------------------------------------------------------------
protected procedure wFormStandardPage_Output && {fr} Page standard FoxInCloud pour un formulaire
LPARAMETERS ;
  toForm as awFrm of aw.vcx; && {en} Reference to form && {fr} Référence au formulaire
, tcForm; && {en} .Name of form {fr} Nom du formulaire
, tcHTML; && [''] {fr} HTML du contenu de la page (formulaire[s])
, tcScript; && [''] {fr} Script du ou des formulaires figurant dans la page

if m.tcForm == 'myForm.scx'
  m.toForm.width = 999
  m.toForm.height = 999
endif

return dodefault(m.toForm, m.tcForm, m.tcHTML, m.tcScript)
endproc

how do I link the events of the page elements to FoxInCloud?

You can implement your custom HTML at the object level:

procedure .wcHTMLgen()
LPARAMETERS toHTMLgen AS awHTMLgen OF awHTML.prg, tlInnerHTML && {en} awHTMLgen instance {fr} instance de awHTMLgen && [.F.] {en} render container's inner HTML {fr} Rendre l'intérieur du conteneur
			
local lcEvents
lcEvents = m.toHTMLgen.cEvents() && implements all the events handlers

this.wcHTML = textmerge([<tag id="<<this.wcID>>" class="myClass" <<m.lcEvents>>>])

Sorry, I don't quite understand your suggestion about "implement your custom HTML at the object level".
I have replaced the entire HTML of the form and everything on it with the contents of a separate HTML file.

Where do I put that wcHTMLGen() code, should I insert the "tag=..." code at the end of my form HTML?
In any case, m.toHTMLgen.cEvents() always seems to return ""...

Unfortunately, while the suggested change to wFormStandardPage_Output() does resize the VFP form, the HTML output for the second time through is still the original dimensions.
Maybe I will have to resize it in the form's Init() instead.
I see that changes to form properties made in form.wcHTMLGen() are not persisted - is this because they occur before form.Init() ?

Thanks

I don't quite understand your suggestion about "implement your custom HTML at the object level"

Instead of replacing the whole form HTML at once, you can replace each control's HTML in its .wcHTMLgen method. This way you can get standard FoxinCloud attributes by calling toHTMLgen methods.

the HTML output for the second time through is still the original dimensions.

using which method? wForm or wFormMaster()? I need code and/or debug reports to understand what happens.

I see that changes to form properties made in form.wcHTMLGen() are not persisted - is this because they occur before form.Init()?

HTML generation occurs after saving properties; you can set the dimensions in form.Init(), in m.this.wlInitFirst section:

if m.this.wlLAN or m.this.wlInitFirst
	&& {en} Move here the code to be executed IN DESKTOP MODE and only when form is first instantiated IN WEB MODE:
	&& {en}  custom member initialization, BindEvent(member, 'event', thisform, 'method'), etc.
	&& {fr} Déplacez ici le code à exécuter en mode DESKTOP et seulement à la première instanciation du formulaire EN MODE WEB :
	&& {fr}  initialisation complémentaire des membres, BindEvent(membre, 'événement', thisform, 'méthode'), etc.
endif

if m.this.wlInitFirst
	&& {en} WEB MODE: form's initial instantiation; code below this block will later execute for each user of this form
	&& {fr} MODE WEB : première instanciation du formulaire ; le code après ce bloc s'exécutera pour chaque utilisateur du formulaire

	this.Width = 99
	this.Height = 99
	return
endif

I understand what you are saying about the individual controls, but I am trying to introduce the ability to totally replace the form's HTML from a separate file; it is a quick way for a replacement UI to be provided without changing VFP code and without having to change the structure of the VFP form layout. In my particular example, I would like to quickly replace my (boring) desktop-styled login page with a pretty HTML5 page.
So I am hoping there is a simple way to bind elements in the new HTML with the underlying control events in the VFP form.

I am using XXXServer.wFormStandardPage to launch the form (from the Index method (for index.xxx)).

I see. We must find a way to generate login_scx.js as of the standard HTML generation; then you just have to make sure the elements in your custom HTML have the same IDs as what FoxinCloud would have generated.

Here is a code that should work:

procedure form.wcHTMLgen()
LPARAMETERS toHTMLgen AS awHTMLgen OF awHTML.prg, tlInnerHTML && {en} awHTMLgen instance {fr} instance de awHTMLgen && [.F.] {en} render container's inner HTML {fr} Rendre l'intérieur du conteneur
			
toHTMLgen.getHTML_() && this should generate the full login_scx.js
this.wcHTML = yourHTML

Hi,

Yes thank you, the code does work with some conditions :

1. the ID of a replacement HTML element must match the original ID generated by FiC
2. the div surrounding an element that triggers a request must have the same ID as the original form ID

So I have the replacement page mostly working, except I am still having trouble keeping the new form dimensions on the second opening.
Ideally I would like to have :

1. generic code in thisform.Init (wlInitFirst) that checks for a custom HTML file and resizes the form
2. generic code in thisform.wcHTMLGen that processes the HTML

Mostly there, except I cannot use thisform.wcID in thisform.Init as that property has not yet been set. I will just use thisform.name instead, unless you see a better way.

Thanks
Paul

As I wrote earlier, for event handlers to operate, IDs must match those FoxinCloud would assign; indeed, thisForm.wcID == thisForm.Name

To help you about resizing the form using generic class-level code, I need to see what code you currently run and what display you get. Maybe you can share a test app URL.