作者：亚艾元技术部
对于一个管理界面，添加、编辑，删除等链接，指向的表单页面，有时候为了更好的体验，我们想在Modal的形式中打开，也就是弹出框的形式。
对于这样的链接，我们需要为它添加一些额外的属性：
<ul>
<li><a href="/tags/add" class="button button-action button--primary button--small use-ajax" data-dialog-type="modal" data-dialog-options="{"width":700}" target="_blank">添加标签</a></li>
</ul>
红色部分，就是使用modal打开，需要添加的额外信息，只需要添加这样的信息，即可实现ajax。
当然，我们还需要对我们的表单加以改造,下面是我们实际项目中的一个自立，供大家参考：
class TagForm extends FormBase {
/**
* {@inheritdoc}
*/
public function getFormId() {
return 'tag_form';
}
/**
* Is the current request for an Ajax modal/dialog.
*
* @return bool
* TRUE if the current request is for an Ajax modal/dialog.
*/
protected function isDialog() {
$wrapper_format = $this->getRequest()
->get(MainContentViewSubscriber::WRAPPER_FORMAT);
return (in_array($wrapper_format, [
'drupal_ajax',
'drupal_modal',
'drupal_dialog',
'drupal_dialog.off_canvas',
])) ? TRUE : FALSE;
}
/**
* {@inheritdoc}
*/
public function buildForm(array $form, FormStateInterface $form_state) {
$term = NULL;
$term = \Drupal::routeMatch()->getParameter('taxonomy_term');
$form['name'] = [
'#type' => 'textfield',
'#title' => $this->t('标签名称'),
'#maxlength' => 40,
'#weight' => 0,
'#default_value' => $term == NULL ? '' : $term->label(),
'#required' => TRUE,
];
$form['weight'] = [
'#type' => 'textfield',
'#title' => $this->t('Weight'),
'#size' => 6,
'#default_value' => $term == NULL ? 0 : $term->getWeight(),
'#description' => $this->t('标签是按照权重的升序排列的.'),
'#required' => TRUE,
];
if ($this->isDialog()) {
$form['submit'] = [
'#type' => 'submit',
'#value' => $this->t('保存'),
'#prefix' => '<div id="submit-button-container">',
'#suffix' => '</div>',
'#ajax' => array(
'callback' => '::ajaxSubmit',
'event' => 'click',
),
];
}
else {
$form['submit'] = [
'#type' => 'submit',
'#value' => $this->t('保存'),
'#prefix' => '<div id="submit-button-container">',
'#suffix' => '</div>',
];
}
return $form;
}
public function ajaxSubmit(array &$form, FormStateInterface $form_state) {
$response = new AjaxResponse();
$term_name = $form_state->getValue('name');
$entity = NULL;
$term = \Drupal::routeMatch()->getParameters()->get('taxonomy_term');
$entity = $term;
if ($entity != NULL) {
//$entity->set('vid', 'subject_category');
if ($term_name != NULL) {
$entity->set('name', $term_name);
}
}
else {
$entity = \Drupal::entityTypeManager()
->getStorage('taxonomy_term')
->create([
'vid' => 'tags',
'name' => $term_name,
]);
//设置部门id，根据用户的部门id，这里假定所有的用户都有部门，这是必须的。只在添加的时候，设置。
$uid = \Drupal::currentUser()->id();
$account = User::load($uid);
$tid = $account->field_department->target_id;
$entity->set('field_department', $tid);
}
$weight = $form_state->getValue('weight');
if (!empty($weight)) {
$entity->set('weight', $weight);
}
else {
$entity->set('weight', 0);
}
$status = $entity->save();
if ($form_state->getErrors()) {
}
else {
$response->addCommand(new CloseModalDialogCommand());
$str_redirect_url = Url::fromUri('internal:/department/tags')->toString();
//$str_redirect_url = Url::fromRoute('zhuanti.zhuanti_admin_page', [], [])->toString();
$response->addCommand(new RedirectCommand($str_redirect_url));
}
return $response;
}
/**
* {@inheritdoc}
*/
public function validateForm(array &$form, FormStateInterface $form_state) {
parent::validateForm($form, $form_state);
}
/**
* {@inheritdoc}
*/
public function submitForm(array &$form, FormStateInterface $form_state) {
//普通页面
if (!$this->isDialog()) {
$term_name = $form_state->getValue('name');
//$term = NULL;
$term = \Drupal::routeMatch()->getParameter('taxonomy_term');
if ($term != NULL) {
if ($term_name != NULL) {
$term->set('name', $term_name);
}
}
else {
$term = \Drupal::entityTypeManager()
->getStorage('taxonomy_term')
->create([
'vid' => 'tags',
'name' => $term_name,
]);
//设置部门id，根据用户的部门id，这里假定所有的用户都有部门，这是必须的。只在添加的时候，设置。
$uid = \Drupal::currentUser()->id();
$account = User::load($uid);
$tid = $account->field_department->target_id;
$term->set('field_department', $tid);
}
$weight = $form_state->getValue('weight');
if (!empty($weight)) {
$term->set('weight', $weight);
}
else {
$term->set('weight', 0);
}
$result = $term->save();
//==========================================================
switch ($result) {
case SAVED_NEW:
$this->messenger()
->addStatus($this->t('创建了一个新标签.'));
break;
case SAVED_UPDATED:
$this->messenger()
->addStatus($this->t('更新了新标签.'));
break;
}
//$route_name = "view.$view_id.$display_id";
$route_name = "view.department_tags.page_1";
$form_state->setRedirect($route_name, []);
}
//==========================================================
}
}
主要是增加了isDialog 的判断，检查一下是不是通过弹出框打开的，然后分两种情况分别处理。
Ajax更新完毕以后，想让当前页面刷新，这样可以看到最新的数据：
$response->addCommand(new CloseModalDialogCommand());
$str_redirect_url = Url::fromUri('internal:/department/tags')->toString();
//$str_redirect_url = Url::fromRoute('zhuanti.zhuanti_admin_page', [], [])->toString();
$response->addCommand(new RedirectCommand($str_redirect_url));
