Has anyone built forms with custom HTML forms yet?

If you have questions or if you want to share your opinion about Aware IM post your message on this forum
Post Reply
BenHayat
Posts: 2749
Joined: Thu Dec 23, 2010 5:48 am
Location: Fla, USA
Contact:

Has anyone built forms with custom HTML forms yet?

Post by BenHayat »

Guys, have you built any forms or main layout using the new custom HTML forms? If yes, can you share a few screen shots? Preferably if it shows data as well.

Secondly, is it possible to use Bootstrap 4 and it's flexbox layout to build device responsive forms?

Thanks.
T0M
Posts: 21
Joined: Mon Jan 28, 2019 9:37 am
Location: Central Europe

Re: Has anyone built forms with custom HTML forms yet?

Post by T0M »

I'm getting into custom forms and pages within main frames and menus in the next days.

Got a custom login form for admin and users.

It was almost easy (when looking back);
just replace the native one with yours but name it the same, place all resources (css, .js etc) in the same folder (just beside the form).. then you will need know/find out which "aw-mapped" fields from the original native form you need to change/add on your custom one. All set.

Took me a bit to fiddle and sort that out.


Next we got a guest registration form (bound to guest reg process with some other specific checkings - like affiliate IDs)

It was done (I'm on 8.2) with "import HTML" inside form editor.

I almost pulled my hair out and wanted to throw that @#€#&! PC out of the window.. as I couldn't get it working. Always a small thing missing ..

In the end it was quite a simple fix:
the custom form template's html file referenced to something like:
/assets/css/file.css

It works fine when changed into (before importing!):
../assets/css/file.css
OR
../yourcustomfolder/assets/CSS/file.css

:roll: :mrgreen:


I now have a login and "special" registration page greeting me with custom bg image, HTML, CSS and .js ..just like this one (wait, I believe it actually is exactly this one):

https://colorlib.com/wp/template/login-form-v3/




So I just hope that same trick will do well with custom pages and frames.
8.2 (Build 2570) | MySQL | Win 2016 | UpCloud | == Arabica && || Robusta
T0M
Posts: 21
Joined: Mon Jan 28, 2019 9:37 am
Location: Central Europe

Re: Has anyone built forms with custom HTML forms yet?

Post by T0M »

Well.. i tried and failed. Or let´s say i need to continue failing till it finally works. :x


I went per documentation and
-> created a new folder C:/xxx/webapps/myappname/Custom/myfolderforthisshit/product-description
-> put a single html file in /product-description
-> placed all related folders in "product-description" too. Like folder for: css, js, bootstrap (3.xx)..
-> Main frame. Property: Contents: Display HTML page. Imported from /product-description


It shows text content of that html file.. but loading bar is permanently "loading" and the sites menu (native aware) is totally crippled horizontally to the very top of the page (instead of the native vertical menu).
No images are shown. No css styling visible. So i guess .js is also not working.

Then (always did import again and tested):

:arrow: Tried without renaming the ressources paths in pagename.html (they are like: /css/file.css)

:arrow: Tried with renaming the ressources paths in pagename.html to ../css/file.css

:arrow: Tried with renaming the ressources paths in pagename.html to ../Custom/myfolderforthisshit/product-description/css/file.css

:arrow: Tried removing <head> tags. Leaving only the tag and whats inside of <body> </body>

:arrow: Tried removing <head> and <body> leaving only the divs

:arrow: Tried a few more combinations i can´t remember.


If you put in a plain pagename.html without any ressources / links to css, js ..it works as expected.
So something may conflicts with awareim bootstrap, css, js




Anyone has a pointer into the right direction?
(Would love to preserve my brown hair till ma 40's)





Edit/Update:

When using for example:
https://bootsnipp.com/builder
and downloading that vanilla example "Project Name" "Jumbotron" thing.. it kinda works (downloads only a single html file which i then imported as described above)

Edit/Update 2:
Still using bootsnip.com/builder.
When copy/pasting bootsnip HTML code right into Contents -> HTML string. WORKS!
Used bootstrap 3.3.0 and jquery 1.11.1 as ettings as this is at least = or < than aware. (so I'm counting on backward compatibility)
8.2 (Build 2570) | MySQL | Win 2016 | UpCloud | == Arabica && || Robusta
aware_support
Posts: 7523
Joined: Sun Apr 24, 2005 12:36 am
Contact:

Re: Has anyone built forms with custom HTML forms yet?

Post by aware_support »

One "gotcha" for those using custom forms (I thought it was documented, but now I cannot find where).

If a form refers to resources stored under the web application directory (AwareIM/Tomcat/webapps/AwareIM) they need to be referred to using ../

Let's say that you store some CSS inside AwareIM/Tomcat/webapps/AwareIM/MyCSS folder

So the form includes a reference like this:
<link href="MyCSS/Somefile.css>>

This works when you just display the form. However, when you import such a form into Aware IM you need to replace the above reference with:
<link href="../MyCSS/Somefile.css>>

This only applies to resources stored inside a web application directory. If your references include absolute URL's they need not be changed.
Aware IM Support Team
T0M
Posts: 21
Joined: Mon Jan 28, 2019 9:37 am
Location: Central Europe

Re: Has anyone built forms with custom HTML forms yet?

Post by T0M »

Ok, that's good information.

If a form or page is stored inside awareim we'd need to reference with:
../folder/file.css

But do we also need to define the depth (or aware will look through for this folder itself)?
means like eg:
../../../folder/file.css
8.2 (Build 2570) | MySQL | Win 2016 | UpCloud | == Arabica && || Robusta
aware_support
Posts: 7523
Joined: Sun Apr 24, 2005 12:36 am
Contact:

Re: Has anyone built forms with custom HTML forms yet?

Post by aware_support »

You just need to specify one level more than where the form actually is (this is because at run-time the form is running inside an IFRAME)
Aware IM Support Team
T0M
Posts: 21
Joined: Mon Jan 28, 2019 9:37 am
Location: Central Europe

Re: Has anyone built forms with custom HTML forms yet?

Post by T0M »

Well, sorry for picking that up again..

But it seems whatever i do.. it will not work.

I put the html and ressources inside aware and outside and tried all options;
Edited ressources to
../folder/
../../folder/ and also left default
folder/

tried to "import" and "display HTML string"

The page itself, if opened on a browser displays fine..
But whenever awareim should serve/display the page it will not work.

Image

Image

Image

Image
8.2 (Build 2570) | MySQL | Win 2016 | UpCloud | == Arabica && || Robusta
aware_support
Posts: 7523
Joined: Sun Apr 24, 2005 12:36 am
Contact:

Re: Has anyone built forms with custom HTML forms yet?

Post by aware_support »

Custom HTML forms work in object forms only and have nothing to do with visual perspectives. Visual perspectives are a different story altogether - they are imported as is and do not use IFRAME. Also note that they are embedded into an existing Aware IM page - so do not use <link>, <body> or <style> elements. They may or may not work. If you need to include CSS styles put them in the Custom/CSS directory as usual or modify startup.html
Aware IM Support Team
johntalbott
Posts: 619
Joined: Wed Jun 17, 2015 11:16 pm
Location: Omaha, Nebraska
Contact:

Re: Has anyone built forms with custom HTML forms yet?

Post by johntalbott »

Circling back .. is anyone successfully using custom forms?
VocalDay Solutions - Agility - Predictability - Quality

We specialize in enabling business through the innovative use of technology.

AwareIM app with beautiful UI/UX - https://screencast-o-matic.com/watch/crfUrrVeB3t
Post Reply