| User |
Post |
|
12:35 am June 13, 2012
|
|
LeslieBarry
|
|
|
|
|
|
Member
|
|
posts 4
|
|
|
|
|
Post edited 2:03 am – June 13, 2012 by GetViable
In your demo: http://topquark.com/demo/formidable-plus/
you have sized the <textarea> to fit the cell nicely. How have you done this?
To clarify, I understand that this will be done with CSS, I am just unsure how.
I would also like to understand what CSS I need to add to my theme to change the colours of the lines and the backgrounds to the table.
Thanks.
|
|
|
7:18 am June 13, 2012
|
|
Top Quark
|
|
|
Barrie, ON
|
|
|
|
|
Member
|
|
posts 179
|
|

|
|
|
|
Post edited 7:24 am – June 13, 2012 by Top Quark
Hi there,
I didn’t actually do anything special to make them fit. You can affect the width with a statement like:
.with_frm_style textarea {
width: 200px; /* or auto or 150px or whatever */
}
Or, for the textareas in a Formidable Plus specific table and column (change the 84 to your table ID and column-1 to the column number you want to affect – note, the first column is .column-0}:
#frm-table-84 .column-1 textarea{
width:250px;
}
As for the colour of the border lines, do this:
.frm-table td, .frm-table th{
border-color:#123456;
}
Cheers
Trevor
|
|
|
10:38 pm June 18, 2012
|
|
LeslieBarry
|
|
|
|
|
|
Member
|
|
posts 4
|
|
|
|
|
Thanks, Trevor – this worked a treat.
|
|
|
11:25 am June 19, 2012
|
|
Top Quark
|
|
|
Barrie, ON
|
|
|
|
|
Member
|
|
posts 179
|
|

|
|
|
|
10:38 pm November 8, 2012
|
|
KennethCline
|
|
|
|
|
|
Member
|
|
posts 4
|
|
|
|
|
I found this doesn't work for input fields because they have size=”10″ and class=”auto-width table-cell” attributes specified in table-field.php. I worked around this problem by doing the following:
// echo '<input type="text" size="10" id="'.$this_field_id.'" name="'.$this_field_name.'[]" value="'.esc_attr($value).'" class="auto_width table-cell" />'."\n";
switch($field['field_key']) { // switch based on the field name of the table
case 'animal_info': // The animal_info table on the New Animal form
switch($col_num) {
case '0': // column-0 is the "Name" column
$my_size = '40';
break;
case '2': // column-2 is the "Description" column
$my_size = '60';
break;
default:
$my_size = '25';
default:
$my_size = '25';
break;
} // switch($col_num)
break;
default:
$my_size = '25';
break;
} // switch($field_name)
echo '<input type="text" size="'.$my_size.'" id="'.$this_field_id.'" name="'.$this_field_name.'[]" value="'.esc_attr($value).'" class="table-cell" />'."\n";
This allows me to limit it to the table I'm interested in (animal_info) and I can set a unique size per column. Not ideal - would be nice to have it exposed in
the front-end, and my changes won't survive an update, but hey - it gets the job done for now.
Trevor - is there a better way to do this???
|
|
|
10:16 am November 23, 2012
|
|
Top Quark
|
|
|
Barrie, ON
|
|
|
|
|
Member
|
|
posts 179
|
|

|
|
|
|
Hi Kenneth,
You could use a quick jQuery function to do this. Something like:
jQuery(function($){
if ($('#my-table-id').length){ // If the table in question is on the page
$('#my-table-id .column-0').find('input').each(function(){
$(this).attr('size',40);
});
$('#my-table-id .column-2').find('input').each(function(){
$(this).attr('size',60);
});
// ... etc.
}
});
|
|