Make WordPress Core

Opened 22 months ago

Last modified 22 months ago

#44019 new defect (bug)

Class-wp-widget-categories.php causes js error in console.

Reported by: arhit Owned by:
Milestone: Future Release Priority: normal
Severity: normal Version: 2.8
Component: Widgets Keywords: has-patch
Focuses: Cc:
PR Number:


The implementation of onCatChange() javascript function in class-wp-widget-categories.php causes problems in themes which use wrappers to style select boxes (drop down menus).

HTML dropdowns are very limited in terms of styling possibilities. It is quite common practice for the front-end designers to use javascript to add a custom wrapper around the select boxes for further styling.

For the sake of clarity, to create a style like this (https://orionthemes.com/img/select-box.png), one absolutely needs a custom wrapper.

In this case select box changes html structure:

	<select name="cat" id="cat" class="postform">


<div class="selectwrapper">
	<select name="cat" id="cat" class="postform">

If you do this in WordPress categories widget, an error is returned in console:

(index):830 Uncaught TypeError: dropdown.parentNode.submit is not a function
    at HTMLSelectElement.onCatChange ((index):830)

Interestingly, if you do the same thing with the archive widget, everything works as it should.

To test this, you can add this jQuery to functions.js file in the theme:

$('.widget_categories select, .widget_archive select').wrap('<div class="selectwrapper"></div>');

Attachments (4)

Screen Shot 2018-05-09 at 13.16.26.png (7.6 KB) - added by arhit 22 months ago.
categories widget select
Screen Shot 2018-05-09 at 13.23.22.png (14.1 KB) - added by arhit 22 months ago.
error in the console
44019.0.diff (1.3 KB) - added by westonruter 22 months ago.
44019.1.diff (1.5 KB) - added by westonruter 22 months ago.

Download all attachments as: .zip

Change History (6)

22 months ago

categories widget select

22 months ago

error in the console

#1 @westonruter
22 months ago

It would be more robust to use the form property on the select element to locate the form to submit. See 44019.0.diff. The problem with that is that the form attribute is not available in IE11: https://caniuse.com/#feat=form-attribute

#2 @westonruter
22 months ago

  • Keywords has-patch added; needs-patch removed
  • Milestone changed from Awaiting Review to Future Release
  • Version changed from 4.9.5 to 2.8

44019.1.diff implements a more robust approach.

Note: See TracTickets for help on using tickets.