Portal Engine Questions on portal engine and web parts.
Version 4.x > Portal Engine > Bizform - Multiple Checkbox View modes: 
User avatar
Member
Member
AP-Kentico - 9/3/2009 2:04:54 PM
   
Bizform - Multiple Checkbox
Currenly the multiple checkboxes does not have an attribute to display a number of items in a row in case of horizontal type.
How can I display a 2/3/4 items in a row for multiple checkboxes in bizform in version 4.0.
Does 4.1 has it?

Thanks,
AP

User avatar
Member
Member
seanbun - 9/4/2009 2:29:25 AM
   
RE:Bizform - Multiple Checkbox
Hi AP,

I assume you've picked "Multiple choice" for your field type in bizform. Actually, you can choose the "Repeat Direct" setting to list options in vertical or horizontal direction.

Or you can set a class in the "Control CSS class" and style the option with your own CSS rules.

Cheers,
Matt

User avatar
Member
Member
AP-Kentico - 9/4/2009 9:11:17 AM
   
RE:Bizform - Multiple Checkbox
Thanks, it worked like a charm.
I did not have to write a new control just to define the numer of columns.
The only problem is that I have lots of checkbox lists and in some of them I want to show 2 columns and in some 3 columns. I guess I will create multiple css classes.

Please consider having an attribute of number of colums to show in the horizontal multiple checkbox layout, if possible.

Thanks,
Anil.

User avatar
Member
Member
AP-Kentico - 9/8/2009 9:52:50 AM
   
RE:Bizform - Multiple Checkbox
I actually had it working by specifying Horizontal layout and using a css class HorizontalList as shown below on Friday. But I don't know what setting changed and it doesn't work anymore.

Has anyone tried formating multiple checkboxes in the horizontal display using CSS?
If yes, could you please mention the css classes?

I have this in my css file.
.HorizontalList
{
width: 700px;
font-family: Arial;
font-size: 12px;
background-color: #e2e2e2;
border: 1px solid #c2c2c2;
}

.HorizontalList tr, .VerticalList tr
{
float: left;
width: 55em;
margin: 0;
list-style: none;
}

.HorizontalList td
{
float: left;
width: 16em;
margin: 0;
padding-left: 1.5em;
text-indent: -1.5em;
padding-right: 1.5em;
}