2

How can I make a structure like adding new textfield with a button and removing that field with remove button. The structure generated should be similar to when we upload a image in multi-image field and it generates image and remove by the side of it. What I want is similar to this instead of image I want is textfield and remove by the side of it using form Api. I have tried with examples module on drupal, ajax add more, but it is not giving what I exactly want. Thanks in advance. Please help me on this.

<?php
// this is inside the form callback
$form['#tree'] = TRUE;
   $form['replace_div'] = array(
     '#markup' => '<div id="info-replace-div"></div>',
   );
   $form['info_fieldset'] = array(
    '#type' => 'fieldset',
    '#title' => t('People coming to the picnic'),
    '#prefix' => '',
    '#suffix' => '',
    );
 if(empty($form_state['num_info'])){
     $form_state['num_info'] = 1;
   }


if($form_state['values']['op'] == 'Add one more' || empty($form_state['values'])){
    for ($i = $form_state['num_info']; $i > $form_state['num_info']-1; $i--) {
      $form['info_fieldset'][$i]['add_name'] = array(
        '#type' => 'submit',
        '#value' => t('Add one more'),
        '#submit' => array('add_more_add_one_info'),
        '#limit_validation_errors' => array(),
        '#ajax' => array(
          'method' => 'before',
          'callback' => 'ajax_add_more_info',
          'wrapper' => 'info-replace-div',
        ),
      );
     $form['info_fieldset'][$i]['remove_name'] = array(
        '#type' => 'submit',
        '#value' => t('Remove').$i,
        '#limit_validation_errors' => array(),
        '#submit' => array('remove_more_add_one_info'),
        '#ajax' => array(
          'method' => 'before',
          'callback' => 'ajax_remove_one_info',
          'wrapper' => 'info-replace-div',
        ),
      );
      $form['info_fieldset'][$i]['module_markup_name1'] = array(
        '#type' => 'item',
        '#markup' => '<div class="module-title info">' . t('Information') . '</div>',
      );
      $form['info_fieldset'][$i]['module_element1'] = array(
        /*'#type' => 'text_format',*/
        '#type' => 'textarea',
        '#title' => '',
        /*'#format' => 'full_html',*/
        '#rows' => 5,
        '#cols' => 50,
        '#default_value' => (!empty($node) && isset($node) && isset($node->body[$node->language][0]['value']) ? $node->body[$node->language][0]['value'] : ''),
      );
      $form['info_fieldset'][$i]['module_desc_markup1'] = array(
        '#type' => 'item',
        '#markup' => '<span class="qtip-link">
                            <span class="qtip-tooltip">' . $module->description . '</span>
                          </span>',
      );
      $form['info_fieldset'][$i]['module_position1'] = array(
        '#type' => 'textfield',
        '#default_value' => (!empty($position_values_arr)) ? $position_values_arr[1] : 6,
        '#size' => 20,
        '#attributes' => array('class' => array('my-weight-for-element')),
      );
      $form['info_fieldset'][$i]['module1'] = array(
        '#type' => 'hidden',
        '#default_value' => in_array($module->mid, $actModule) ? 1 : 0,
      );
    }
      }


function add_more_add_one_info($form, &$form_state){
  $form_state['num_info']++;
  $form_state['rebuild'] = TRUE;
  //add more is working fine
}
function ajax_add_more_info($form, &$form_state){
  return $form['info_fieldset'];
}
function ajax_remove_one_info($form, &$form_state){
  return $form['info_fieldset'];
}
function remove_more_add_one_info($form, &$form_state){

//  unset($form_state['info_fieldset'][$form_state['num_info']]);
//   $form_state['rebuild'] = TRUE;
// need to find the logic for this one
}![enter image description here][1]

output should be like in this image

As 1 shown in the image I can manage add button below the all generated field but I need remove button by the side of the field. So, that only that field is removed.

The functionality in the end I need to create is there should be a form and multiple element can be added to the form as in google form. Refer the link and image for example.enter image description here

  • For more information of the structure what I want and to be more clear is you can refer to the google form. Where we can add each form element easily by selecting it from dropdown and place it any where and also remove it. docs.google.com/… you can use edit this form and I want some functionality like this. – Pradeep Mar 25 '14 at 10:56
  • I am adding image for the google form for functionality. – Pradeep Mar 25 '14 at 12:20
1

Not sure why you want this feature. But This module has similar features you need, you can try it.

After installing module just try this in your form,

$form['your_form_id'] = array(
'#type' => 'options',



);

Regardless of other features this module provides, simply you can use it as the text field also, the value are passed to

$form_state['values']['your_form_id']

You can hide those unnecessary elements as per your needs, just add these css to your theme,

.form-option-add 
{visibility:hidden;}

.form-options-manual
{visibility:hidden;}

.remove-default
{visibility:hidden;}
.form-radio
{visibility:hidden;}

.tabledrag-handle
{visibility:hidden;}

.tabledrag-processed thead
{visibility:hidden;}
|improve this answer|||||
0

In D7, Example module contains a submodule form_example. Use form_example module, Go through form tutorial #9 by accessing a url like abc.com/examples/form_example/tutorial/9. This tutorial implement same work that you want to do.

|improve this answer|||||

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.