Form Field Issues - Forum | JoomShaper
Awaiting an answer SP Page Builder

Form Field Issues

Asked by Douglas B 4 years ago Last activity 4 years ago

Hello,

Thank you for resolving the recent issue with mail not sending from form builder, that is really great.
I have been noticing that there are a few style issues that there appears to be no manual adjustments for.

  • When using a "textarea" form element, the Field Label does not move up and out of the way when typing in the textarea box. This causes a jumble at the beginning of typing.


  • I noticed, this "jumble" is the same issue on any field type if you are needing to add text to the field placeholder area. Then the field name and the field placeholder text jumble together. Shouldnt the field name move up and out of the way if there is placeholder text added?

  • When using a "select" form field, it appears the the field name automatically populates the field placeholder area and jumbles together with the field placeholder text. You can also see below that the placeholder text is positioned too low and is cut off.


  • When using radio buttons, there is inconsistent vertical spacing between form items. The radio button field name is too tight to the form item above it causing a need to adjust bottom gap excessively to compensate.


As I mentioned above, I cannot seem to find any way to manually and individually adjust vertical gap, as it is a global setting for the form (General > Form Styles > Field Style > Bottom Gap). This is not adequate and requires excessive spacing to compensate for the lack of space between an upper form element and a radio group element.

If you could please fix the issue with form names overlapping the placeholder text, I would appreciate that a lot.

Thank you very much for your help.

14 replies

Oldest first Newest first Most helpful
Ofi Khan Staff
4 years ago

Hello Douglas B

The style is coming from the template. Which template do you use?

Best regards

enrico
4 years ago

Hi,
I've some trouble with the form addon too.
For me it's impossible to modify the vertical position of a field on the Select element.
If I try to do it the form editor collapse and displayed a different Select element of the same form.
This appened on normal editor and also in the frontend editor.
It's so frustrating!

I work with Sp Page Builder Version 3.8.7 and Joomla! 3.10.10

Thank you in advance

Kind regards

enrico

Ofi Khan Staff
4 years ago

Hello enrico

Apology for the inconveniences. Please post a new question on the forum and we will help you.

Best regards

Douglas B Asked this
4 years ago · edited

Good Morning Ofi Khan,

Thank you for your attention, i appreciate it. My setup is Joomla 4, SP PageBuilder Pro 3.8.8, and the template is Daycare for J4.
I also have Helix Ultimate.

Ofi Khan Staff
4 years ago

Please check Daycare template settings. Maybe this template is applying the style.

Douglas B Asked this
4 years ago

Hello Ofi Khan,

So, the daycare template is using HelixU, and all the settings in the template seem to be global settings.
I had to add some css overrides like below, which seem to help. I am hoping that a second or third form wont have the same field naming structure, or else that would be another problem for sure.

#sppb-form-builder-field-3{
line-height: 75px;
}
#sppb-form-builder-field-20, #sppb-form-builder-field-21{
line-height: 100px;
}
#captcha-1659727634378{
line-height: 80px;
}

Can you suggest a fix for the captcha which has placeholder text inserted automatically for some reason?
e.g.
3+4= (field name (captcha question))
3+4= (auto inserted in the placeholder text area)
Not sure why there is text being inserted in what appears to be the placeholder text area.

Thank you.

Ofi Khan Staff
4 years ago

Please share the page link to check the captcha issue.

Douglas B Asked this
4 years ago

Good Morning,

Please see the link in the hidden content area below.

If when you look at it, could you also take a peek at either of the two textarea fields directly above it.
The css spacing i added does space the field name above where a person would type, but the content area where you type now also inherits the exaggerated spacing which is not good.
Thank you sir.

Ofi Khan Staff
4 years ago

I am little confused. Which style do you prefer? Text Area style (when in active, title does not move) or normal text style (when in active, title move upwards)?

Douglas B Asked this
4 years ago

If we are talking about preference, I like the "normal text style" as it moves up and out of the way when you click to fill in the field. If you are using placeholder text, then the form field name and the placeholder text occupy the same space creating jumbled text. The way around this for me (which is only a bandaid fix) is to not use placeholder text, which for most fields is acceptable.

The "text area style" and the "normal text style" do not seem to function the same way in that regard.

The "text area style" that does not move is directly in the same spot as where you begin typing in to fill out that field. See images at the beginnning of this post.

Either way, there is an issue with the form name text occupying the same space as the placeholder text (normal text style) and/or the typed in data (text area style).

At least with the Daycare theme it seems.

Log in to reply.