Drupal 7 FAPI- Adding form elements in validate or submit handlers

Question

Is it possible to add additional form elements in the validate or submit functions in drupal 7 module? The following code works and image is displayed on the form:

function test1_form($form, &$form_state)
{
     $form['image']=array(
           '#markup'=>'<img src="sites/all/modules/create_ad/th.jpeg"><br/>', //replace with your own image path
     );

     $form['submit'] = array(
           '#type' => 'submit',
           '#value' => 'Submit',
     );
}

but when I try to display image after submission in submit function like following, it doesn't work:

function test1_form($form, &$form_state)
{
     $form['submit'] = array(
           '#type' => 'submit',
           '#value' => 'Submit',
     );
}

function test1_form_submit($form,&$form_state)
{
     $form['image']=array(
           '#markup'=>'<img src="sites/all/modules/create_ad/th.jpeg"><br/>', //replace with your own image path
     );
}

Any positive help is welcome. Thanks.

Answer 1

You could follow the multi-step form methodology to add additional fields to your form after submission.

Here is a blog post that talks about one approach for multi-step and can give you some insight.

Basically, on your submit function you store your values and set the form to be rebuilt. Then in your form function you check for those stored values and add the new fields if present.

Example:

<?php
function test1_form($form, &$form_state)
{
        if (isset($form_state['storage']['show-image'])){
            $form['image']=array(
                '#markup'=>'<img src="sites/all/modules/create_ad/th.jpeg"><br/>', //replace with your own image path
            );
        }

     $form['submit'] = array(
                 '#type' => 'submit',
                 '#value' => 'Submit',
     );
}

function test1_form_submit($form,&$form_state)
{
    $form_state['rebuild'] = TRUE;
    $form_state['storage']['show-image'] = true;
}

Answer 2

Here is another way of doing this with Ajax. This way you will not get any page reload since only the image will be loaded in to the div with wrapper id.

Here is the code:

function test_menu()
{
    $items = array();

    $items['test'] = array(
        'title'           => 'test',
        'page callback'   => 'drupal_get_form',
        'page arguments'  => array('test1_form'),
        'access callback' => array(TRUE),
        'type'            => MENU_CALLBACK,
    );

    return $items;
}

function test1_form($form, &$form_state)
{
    $form['submit'] = array(
        '#type'  => 'button',
        '#value' => t('Submit'),
        '#name'  => 'add',
        '#ajax'  => array(
            'callback' => 'ajax_load_picture_callback',
            'wrapper'  => 'wrapper',
            'method'   => 'replace',
            'effect'   => 'fade',
        ),
    );

    $form['image'] = array(
        '#markup' => '',
        '#prefix' => '<div id="wrapper">',
        '#suffix' => '</div>',
    );
    if (array_key_exists('triggering_element', $form_state) &&
        array_key_exists('#name', $form_state['triggering_element']) &&
        $form_state['triggering_element']['#name'] == 'add')
    {
        $form['image']['#markup'] ='<img src="themes/bartik/logo.png"><br/>'; //replace with your own image path
    }

    return $form;
}

function ajax_load_picture_callback($form, $form_state)
{
    return $form['image'];
}

function test1_form_submit($form, &$form_state)
{

}