V7 - form design - merge rows

weblike

Hi,
I'm strugelling to have good looking forms, but if I use mutiple columns and on column B I add 1 attribute with height 100px, than the rowefrom column A are very distant from one other.

Does anyone found a solution on this?

Thx,

pureist

There is none. It is how it works in V7. It was explained in the following Post:

weblike

nooooooooooooooooooooooooooooooooooooo

crisg0112

weblike wrote
nooooooooooooooooooooooooooooooooooooo

i feel the same ..

johntalbott

With form configuration adjustments and some scripting, you can get around it.

customaware

Hi John....

That screenshot demonstrates solution for a couple of issues...

Any chance of posting a 1 form demo (including the html text box - I think you stall cannot get the background color to fill the entire cell...right?)

johntalbott

I'll see what I can do.

.. I think you stall cannot get the background color to fill the entire cell...right?

Can you elaborate on this part?

customaware

In earlier versions you could render the background color of a form cell and it would paint the ENTIRE cell.

Currently this functionality is lost and you can only paint the background of the text in the cell rather than the cell itself.

Would still love to see a small demo of how you aligned all the controls on the form when tall control in one of the columns.... please?

weblike

Hi John,

Can you share please the solution for this?

thx,

customaware

Has anyone worked out a workaround for this.

It is really really irritating. Grrrrr.!!!! 🙁

aware_support

As a workaround create a custom CSS file and add the following line to it:

.aw-column-multi textarea {
	position: absolute; 
}

weblike

Hi,
Unfortunately this workaround doesn't work for me!!! Has anyone tested?

customaware

Works for me Gheorghe.

weblike

I have tested with picture attributes nd this how it looks:
There are 2 photo attributes: 1st don't respect the css the second does....HMMMM

johntalbott

The approach that I used is little more involved than the approach shared by Support. But if you are looking for an alternative, here is what I did. Everything below is using the Staff Entry form of the CRM sample application.

Step 1. Put the controls that are getting pushed down the form into the same row as the tall control.

Step 2. Add id's to the attributes in the form to make it easier to refer to them using jQuery

Step 3. Add a Render script to remove display and width values in the CSS of the container for each field

$("#lastname").closest (".form-group").parent().css( {"display":"", "width":""});
$("#email").closest (".form-group").parent().css( {"display":"", "width":""});
$("#jobtitle").closest (".form-group").parent().css( {"display":"", "width":""});
$("#loginname").closest (".form-group").parent().css( {"display":"", "width":""});
$("#password").closest (".form-group").parent().css( {"display":"", "width":""});
$("#accesslevel").closest (".form-group").parent().css( {"display":"", "width":""});

aware_support

The approach suggested by us only works for text areas. If you use pictures they should be already covered by the standard CSS settings and should not produce this gap.

customaware

aware_support wrote
The approach suggested by us only works for text areas. If you use pictures they should be already covered by the standard CSS settings and should not produce this gap.

Please explain what you mean by this and provide a sample bsv to demonstrate.

pureist

the Picture/Image upload control has never expanded the row height, either in a single column form, or multiple column form.
The control itself expands when a picture/image has been uploaded (to display the image) but it overlays controls/attributes below it, like it is floating over the top of the them, rather than expanding the row.
Attached is a bsv demonstrating. Create and new Regular User and attach a picture.

THE OUTSANDING PROBLEM, however, is that the Document upload control which works exactly the same way as the image upload control (uploads a file), DOES expand the row when it expands, as well as when the form is first loaded.
And it is also not the same default dimensions as the Image upload control.
Support needs to adjust the css on the Document upload control so it works like the Picture upload control in that when it expands it overlays the controls below and does not expand the row.
And while doing that, also adjust the defaiult dimensions of the document upload control to be the same as those of the Picture upload control, for the sake of uniformity.

twocolformwithPictandDocattr.zip

34.6kB

eagles9999 wrote
aware_support wrote
The approach suggested by us only works for text areas. If you use pictures they should be already covered by the standard CSS settings and should not produce this gap.

Please explain what you mean by this and provide a sample bsv to demonstrate.

PointsWell

This issue also arises when you use a map image in the second column