In drupal 8 I have implemented an add more interface :
the route file :
add_remove_fieldset_example:
path: 'add-remove-fieldset-example'
defaults:
_form: '\Drupal\add_remove_fieldset_example\Form\AddRemoveFieldsetExampleForm'
requirements:
_permission: 'access content'
add_remove_fieldset_example_modal:
path: '/add-remove-fieldset-example-modal'
defaults:
_form: '\Drupal\add_remove_fieldset_example\Form\AddRemoveFieldsetExampleModalForm'
_title: 'Add Remove fieldset Form'
requirements:
_permission: 'access content'
AddRemoveFieldsetExampleForm.php
class AddRemoveFieldsetExampleForm extends FormBase {
public function getFormId() {
return 'add_remove_fieldset_example_form';
}
public function buildForm(array $form, FormStateInterface $form_state) {
$form['#attached']['library'][] = 'core/drupal.ajax';
$form['#attached']['library'][] = 'core/drupal.dialog.ajax';
$form['addtag'] = [
'#type' => 'submit',
'#value' => t('Add one more'),
'#submit' => ['::addOneTag'],
'#weight' => 100,
'#ajax' => [
'callback' => '::updateTagCallback',
'wrapper' => 'tagfields-wrapper',
'method' => 'replace',
],
];
$form['remtag'] = [
'#type' => 'submit',
'#value' => t('Remove the last'),
'#submit' => ['::remOneTag'],
'#weight' => 100,
'#ajax' => [
'callback' => '::updateTagCallback',
'wrapper' => 'tagfields-wrapper',
'method' => 'replace',
],
];
$form['#tree'] = TRUE;
$form['tags'] = [
'#type' => 'fieldset',
'#prefix' => '<div id="tagfields-wrapper">',
'#suffix' => '</div>',
];
$number_of_tags = $form_state->get('number_of_tags') ?? 0;
$form['not'] = array('#type' => 'hidden', '#value' => $number_of_tags);
if (empty($number_of_tags)) {
$number_of_tags = 0;
$form_state->set('number_of_tags', $number_of_tags);
}
for ($i = 0; $i <= $number_of_tags; $i++) {
$form['tags']['field_1_'.$i] = [
'#type' => 'textfield',
'#title' => 'Field 1',
'#prefix' => '<div class="col-md-3 col-xs-12">',
'#suffix' => '</div>',
];
$form['tags']['field_2_'.$i] = [
'#type' => 'textfield',
'#title' => 'Field 2',
'#prefix' => '<div class="col-md-3 col-xs-12">',
'#suffix' => '</div>',
];
$form['tags']['field_3_'.$i] = [
'#type' => 'textfield',
'#title' => 'Field 3',
'#prefix' => '<div class="col-md-3 col-xs-12">',
'#suffix' => '</div>',
];
$form['tags']['field_4_'.$i] = [
'#type' => 'date',
'#date_format' => 'Y-m-d',
'#title' => 'Field 4',
'#prefix' => '<div class="col-md-3 col-xs-12">',
'#suffix' => '</div>',
];
}
$form['submit'] = [
'#type' => 'submit',
'#value' => t('Submit'),
'#ajax' => [
'callback' => '::ajaxSubmitForm',
'event' => 'click',
],
];
return $form;
}
public function addOneTag(array &$form, FormStateInterface $form_state) {
$number_of_tags = $form_state->get('number_of_tags');
$form_state->set('number_of_tags', $number_of_tags + 1);
$form_state->setRebuild(TRUE);
}
public function remOneTag(array &$form, FormStateInterface $form_state) {
$number_of_tags = $form_state->get('number_of_tags');
$form_state->set('number_of_tags', $number_of_tags - 1);
$form_state->setRebuild(TRUE);
}
public function updateTagCallback(array &$form, FormStateInterface $form_state) {
return $form['tags'];
}
public function validateForm(array &$form, FormStateInterface $form_state) {
}
public function submitForm(array &$form, FormStateInterface $form_state) {
}
public function ajaxSubmitForm(array &$form, FormStateInterface $form_state) {
$response = new AjaxResponse();
$addmore_test_modal_form=\Drupal::formBuilder()->getForm('Drupal\add_remove_fieldset_example\Form\AddRemoveFieldsetExampleModalForm',$form_state->getValues());
$response->addCommand(new OpenModalDialogCommand('ADD MORE FIELD MODAL TEST : ', $addmore_test_modal_form, ['width' => '955']));
return $response;
}
}
AddRemoveFieldsetExampleModalForm.php
class AddRemoveFieldsetExampleModalForm extends FormBase {
public function getFormId() {
return 'add_remove_fieldset_example_modal_form';
}
public function buildForm(array $form, FormStateInterface $form_state, $arr = array()) {
// Add the core AJAX library.
$form['#attached']['library'][] = 'core/drupal.ajax';
$form['#attached']['library'][] = 'core/drupal.dialog.ajax';
$form['#tree'] = TRUE;
$not = $arr['not'] ?? 0;
$form['not']= [
'#type' => 'hidden',
'#default_value' => $not,
];
$output = $not.'<table><tr><th>Field 1</th><th>Field 2</th><th>Field 3</th><th>Field 4</th></tr>';
for ($i = 0; $i <= $not; $i++) {
$x1 = $arr['tags']['field_1_'.$i] ?? '';
$x2 = $arr['tags']['field_2_'.$i] ?? '';
$x3 = $arr['tags']['field_3_'.$i] ?? '';
$x4 = $arr['tags']['field_4_'.$i] ?? '';
$form['field_1_'.$i] = [
'#type' => 'textfield',
'#default_value' => $x1,
];
$form['field_2_'.$i] = [
'#type' => 'textfield',
'#default_value' => $x1,
];
$form['field_3_'.$i] = [
'#type' => 'textfield',
'#default_value' => $x1,
];
$form['field_4_'.$i] = [
'#type' => 'textfield',
'#default_value' => $x1,
];
$output .= '<tr><td>'.$x1.'</td><td>'.$x2.'</td><td>'.$x3.'</td><td>'.$x4.'</td></tr>';
}
$output .= '</table>';
$form['input Data'] = [
'#title'=> 'Input Data',
'#type' => 'markup',
'#markup' => $output
];
$form['actions'] = [
'#type' => 'actions',
];
// Add a submit button that handles the submission of the form.
$form['actions']['confirm'] = [
'#type' => 'submit',
'#value' => $this->t('Confirm'),
'#attributes' => ['class' => ['btn btn-success btn-lg'],],
'#ajax' => [
'callback' => [static::class, 'confirmSubmit'],
'url' => Url::fromRoute('add_remove_fieldset_example_modal'),
'options' => [
'query' => [
FormBuilderInterface::AJAX_FORM_REQUEST => TRUE,
],
],
],
];
$form['actions']['modify'] = [
'#type' => 'submit',
'#value' => $this->t('Modify'),
'#attributes' => ['class' => ['btn btn-primary btn-lg'],],
'#ajax' => [
'callback' => [static::class, 'modifySubmit'],
'url' => Url::fromRoute('add_remove_fieldset_example_modal'),
'options' => [
'query' => [
FormBuilderInterface::AJAX_FORM_REQUEST => TRUE,
],
],
],
];
return $form;
}
public static function modifySubmit(array &$form, FormStateInterface $form_state): AjaxResponse {
$response = new AjaxResponse();
$response->addCommand(new CloseDialogCommand());
return $response;
}
public static function confirmSubmit(array &$form, FormStateInterface $form_state): AjaxResponse {
$not = $form_state->getValue('not') ?? 0;
$output = $not.'<table><tr><th>Field 1</th><th>Field 2</th><th>Field 3</th><th>Field 4</th></tr>';
for ($i = 0; $i <= $not; $i++) {
$x1 = $form_state->getValue('field_1_'.$i) ?? '';
$x2 = $form_state->getValue('field_2_'.$i) ?? '';
$x3 = $form_state->getValue('field_3_'.$i) ?? '';
$x4 = $form_state->getValue('field_4_'.$i) ?? '';
$output .= '<tr><td>'.$x1.'</td><td>'.$x2.'</td><td>'.$x3.'</td><td>'.$x4.'</td></tr>';
}
$output .= '</table>';
print_r($output); die;
}
public function submitForm(array &$form, FormStateInterface $form_state) {
//Do nothing
}
}
On submission of the modal form the following headers are passed successfully, but the content of the 2nd set of values arenot displayed in the output table.
Please refer to the attached screenshot.
| Comment | File | Size | Author |
|---|---|---|---|
| response.png | 3.74 KB | subhajitbanerjee50 | |
| headers.png | 15.91 KB | subhajitbanerjee50 | |
| form.png | 80.2 KB | subhajitbanerjee50 | |
| modal-form.png | 79.04 KB | subhajitbanerjee50 |
Comments
Comment #2
subhajitbanerjee50 commentedComment #3
bbu23Comment #4
bbu23The module is not yet implemented, but thanks for the proposition.
Comment #5
bbu23