Modificate content profile form to show checkboxes in the matrix

Question

I need to show matrix like this http://eugen.gotdns.com/test/zeitplaner.png in content profile form. I can arrange checkboxes with CSS in this way, but i need also some labels on the top and on the left. Should i work with $form array to add some labels? Can this be done with css maybe?

Answer 1

Although you could theoretically do this with CSS, it would be a browser-compatibility nightmare.

Your best bet is to modify the $form array to make it into a <table>. You could do this either using prefixes and suffixes on the individual elements (for the opening and closing of td's and tr's), or you could just add #markup elements in between the form fields for that. Either way would work, but I'd go the prefix/suffix direction just because it would be a lot cleaner.

If you need help implementing this, feel free to ask here (probably in a different question).

Answer 2

I agree with Mike Crittenden that the way to do this is to use tables, I don't agree with the way he want to do it though.

The best solution is to make a custom theme function for the form. Basicly what you do it to loop through your form items and render them. The easiest is to render them one table row at a time.

I have copied some old code that shows this example, but you probably need to modify it some. I had some uncertainties not knowing which row and columns I would need, So I have made this a bit more generic that you will need, and sent some data with the form when I generated it.
You can render your form items any way you want, it also depends on how you structured your form items how you can loop through if even possible. The code below is based on form structure like this: $form['category']['item'] = checkbox. If you have structured your form items differently you will need to loop through them different. What you will need to do however, id to render the form items one row at a time. $rows will be an array of array, where each array in it, will be the rows of your matrix and should in order contain the elements in that row.

When you render a form item Drupal will know that it has been rendered, so when you use drupal_render($form) only the form items that hasn't been rendered will be rendered like submit buttons etc.

function theme_form_id($form) {
    $labels = array(
      ...
    );
    $cats = $form['categories']['#value']; // This would for you be Mo, Di ...
    $pros = $form['profile_items']['#value']; // array of name the form items have.
    $header = array('Ziet' ...);
    $rows = array();

    foreach ($pros as $item) {
        $new_row = array($labels[$item]);
        foreach ($cats as $cat) {
            $new_row[] = array('data' => drupal_render($form[$cat][$item]), 'class' => 'checkbox');
        }
        $rows[] = $new_row;
    }
    $output = theme('table', $header, $rows);
    $output .= drupal_render($form);
    return $output;
}