form layout in drupal from a module

Question

I created my own module called "cssswitch". I'm trying to create my own html layout to display the admin form portion of the module. I understand how to use the hook_form_alter() to modify form elements, but I need to create the entire form layout to make some fields appear next to each other. It seems I need something like the way I have the frontend view of the node displayed with theme_cssswitch_display(), but for the admin part of the node.

function cssswitch_form_alter(&$form, $form_state, $form_id) {

    switch($form_id) {  

        case 'cssswitch_node_form':
            $form['hour_start']['#prefix'] = '<div class="start-box">';
            $form['ampm_start']['#suffix'] = '</div>';
            $form['ampm_start']['#attributes'] = array("style" => "border-width:2px;");
            break;
    }

}

function cssswitch_theme() {

    return array(
      'cssswitch_display' => array(
        'arguments' => array('node'),
      ),

    );

}

// to display the view of the node
function theme_cssswitch_display($node) {

  $output = '<div class="cssswitch-cssfilename">Filename: '.
    check_plain($node->cssfilename). '</div>';
  $output .= '<div class="cssswitch-time_start">Start: '.
    check_plain($node->hour_start). ':'.check_plain($node->minute_start).' '.check_plain($node->ampm_start).'</div>';

  $output .= '<div class="cssswitch-time_end">End: '.
    check_plain($node->hour_end). ':'.check_plain($node->minute_end).' '.check_plain($node->ampm_end).'</div>';    

  return $output;
}

thanks for any help

Answer 1

I got it all sorted out now. My hook_theme is this:

function cssswitch_theme() {

    return array(
      'cssswitch_display' => array(
        'arguments' => array('node'),
      ),

      'cssswitch_node_form' => array(
        'arguments' => array('form' => NULL),
        'template' => 'cssswitch-node-form.tpl.php',
      ),

      );

}

I created the file themes/garland/cssswitch-node-form.tpl.php Then I can have control over where to put any form elements like this:

<style>
#edit-hour-start-wrapper, #edit-minute-start-wrapper, #edit-ampm-start-wrapper, #edit-hour-end-wrapper, #edit-minute-end-wrapper, #edit-ampm-end-wrapper {
    float:left;
    margin-right:25px;
}
</style>
<div id="regform1">

<?php print drupal_render($form['title']); ?>
<?php print drupal_render($form['cssfilename']); ?>

    <fieldset class="group-account-basics collapsible">
        <legend>Time Start</legend>
        <?php print drupal_render($form['hour_start']); ?>
        <?php print drupal_render($form['minute_start']); ?>
        <?php print drupal_render($form['ampm_start']); ?>
    </fieldset>

    <fieldset class="group-account-basics collapsible"><legend>Time end</legend>
        <?php print drupal_render($form['hour_end']); ?>
        <?php print drupal_render($form['minute_end']); ?>
        <?php print drupal_render($form['ampm_end']); ?>    
    </fieldset>
</div>

<?php print drupal_render($form['options']); ?>
<?php print drupal_render($form['author']); ?>
<?php print drupal_render($form['revision_information']); ?>
<?php print drupal_render($form['path']); ?>
<?php print drupal_render($form['attachments']); ?>
<?php print drupal_render($form['comment_settings']); ?>
<?php print drupal_render($form); ?>

Answer 2

hook_form_alter is only needed, if you want to change a form that another module has defined. Since you are defining the form, you don't need to alter it, instead you can just define it like you want.

What you need to use, to change the markup of the form, is the #theme attribute of the form itself and/or it's elements. With it you can use your own theme functions to render the form and it's elements.

Look for help in Drupal's FAPI reference.