Using AJAX in menu link's edit form causes database connection serialization errors

Created on 29 July 2017, over 7 years ago
Updated 26 February 2025, about 1 month ago

ISSUE SUMMARY:

If you add custom managed field to the module-defined menu items via hook_BASE_FORM_id_alter, uploading a file is broken.

ENVIRONMENT:

OS/web server: Linux/Apache
Drupal version: 8.3.5

REPRODUCIBILITY: always

STEPS TO REPRODUCE:

1) Create a custom module (e.g. mymodule)

2) Implement hook_BASE_FORM_id_alter in the .module file in order to add new filed to the menu item edit form, with the following code:

/**
 * Implements hook_BASE_FORM_id_alter().
 *
 * Alter menu link edit form for special menu item type (e.g. Home).
 */
function mymodule_form_menu_link_edit_alter(&$form, &$form_state, $form_id) {
  $form['item_image'] = [
    '#type' => 'managed_file',
    '#title' => t('Item image'),
    '#upload_location' => 'public://item_image',
    '#default_value' => 0,
  ];
}

3) Navigate to the menu edit form, e.g. Home link in Main Navigation or Login/Logout link in User Menu. For example, Administration > Structure > Menus > Main navigation > Home edit. The menu item edit form will be displayed containing the item image field, you've created in the hook function.

4) Try to upload an image

EXPECTED BEHAVIOR:

An image file should be uploaded without any issue, just like in any other form.

ACTUAL BEHAVIOR:

Uploading image to the field is broken, causing the an Ajax and database serialization errors

Browser errors details:

POST http://localhost/d8/develop/admin/structure/menu/link/standard.front_pag... 500 (Internal Server Error) jquery.min.js?v=2.2.4:4

Uncaught
Drupal.AjaxError {message: "↵An AJAX HTTP error occurred.↵HTTP Result Code: 50…encySerializationTrait as a temporary solution."}", name: "AjaxError"}
message: "↵An AJAX HTTP error occurred.↵HTTP Result Code: 500↵Debugging information follows.↵Path: /d8/develop/admin/structure/menu/link/standard.front_page/edit?element_parents=item_image&ajax_form=1↵StatusText: Internal Server Error↵ResponseText: {"message":"A fatal error occurred: The database connection is not serializable. This probably means you are serializing an object that has an indirect reference to the database connection. Adjust your code so that is not necessary. Alternatively, look at DependencySerializationTrait as a temporary solution."}"
name
:
"AjaxError"

Recent log errors details:

Type: php
Date: Friday, July 28, 2017 - 16:52
User: admin
Location: http://localhost/d8/develop/admin/structure/menu/link/standard.front_pag...
Referrer: http://localhost/d8/develop/admin/structure/menu/link/standard.front_pag...
Message LogicException: The database connection is not serializable. This probably means you are serializing an object that has an indirect reference to the database connection. Adjust your code so that is not necessary. Alternatively, look at DependencySerializationTrait as a temporary solution. in Drupal\Core\Database\Connection->__sleep() (line 1471 of /opt/lampp/htdocs/d8/develop/core/lib/Drupal/Core/Database/Connection.php).
Severity: Error
Hostname: 127.0.0.1

NOTES:

- The issue not tested on Windows platform
- Upload destination has valid permissions, so uploading files in other forms works without problems
- Modyfing menu item content form in the same way works without any issue (e.g. mymodule_form_menu_link_content_form_alter)

🐛 Bug report
Status

Needs review

Version

11.0 🔥

Component

ajax system

Created by

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

Production build 0.71.5 2024