WordPress.org

Make WordPress Core

Opened 4 years ago

Last modified 3 years ago

#27996 new enhancement

Show/Hide Postbox doesn't work if dynamically added

Reported by: johnstonphilip Owned by:
Milestone: Future Release Priority: normal
Severity: normal Version: 3.9
Component: Administration Keywords: needs-refresh has-patch
Focuses: javascript Cc:

Description

If you have a plugin which adds a metabox to the page at runtime, the "handlediv" button which shows/hides the contents of that metabox doesn't work.

To fix it, the code (on line 12 of postbox.js and also in postbox.min.js) should change from:

$('.postbox h3, .postbox .handlediv').bind('click.postboxes', function() {

To:

$(document).on('click.postboxes', '.postbox h3, .postbox .handlediv', function() {

P.S. I have tried to submit a patch in the past but my entire computer had a meltdown and scattered files from here to Mordor to the Shire because I have no idea how to do it properly. This after spending a couple weeks reading up on how to it properly. So, unfortunately, I am not able to submit a patch due to the incredibly difficult-for-me-to-understand SVN system. My Apologies.

Attachments (2)

Make-postboxes-open-close-if-added-after-DOM.patch (973 bytes) - added by johnstonphilip 3 years ago.
Make postboxes open/close if added after DOM
All-bind-s-changed-to-on.patch (2.0 KB) - added by johnstonphilip 3 years ago.
All "bind"s changed to "on"s.

Download all attachments as: .zip

Change History (12)

#1 @jesin
4 years ago

What plugin are you using? I am unable to reproduce this issue with my own meta box code.

This is the code I used.

function sample_meta_box() {
	add_meta_box( 'sample', 'Sample', 'sample_html', 'post' );
}

function sample_html() {
	echo 'Some text here';
}

add_action( 'add_meta_boxes', 'sample_meta_box' );

#2 @SergeyBiryukov
4 years ago

  • Component changed from General to Administration

#3 @kucrut
4 years ago

Just curious, are you adding a meta box to the post editing screen or a plugin settings screen? To make the meta boxes work on plugin settings screen, you will need to initialize the postbox script manually.

By the way, if you're more comfortable with Git than with SVN, you can follow scribu's guide on how to contribute using Git :)

#4 @johnstonphilip
4 years ago

@jesin I am actually not referring to creating a metabox using 'add_meta_box' or even PHP at all. I'm referring to after it has been created. Say you're on the post editing screen and you might have a "duplicate" button which clones the metabox and changes some of the values. The way it is now, you can't duplicate it using javascript and still have the open/close controls work because it's new to the DOM.

@kucrut I am adding it to the post editing screen. Thanks for the git suggestion.

P.S. <3 Blink

@johnstonphilip
3 years ago

Make postboxes open/close if added after DOM

#5 @johnstonphilip
3 years ago

The reason why I want to do it this way is because I have a potentially unlimited number of unique metaboxes - but only need to show 2 at any given time.

I would like to load ONLY what is actually needed (based on user selection in an existing meta box). This is why I would like to create those metaboxes at-runtime and load their contents in through ajax.

I could create hundreds of empty metaboxes and then trigger the ajax when the user selects the data in question - but I would rather only create the metaboxes needed.

This ticket was mentioned in Slack in #core by johnstonphilip. View the logs.


3 years ago

#7 @johnstonphilip
3 years ago

Additionally, according to the jQuery website, "bind" is no longer the preferred method as "on" is now preferred.

Read more here: http://api.jquery.com/bind/ "As of jQuery 1.7, the .on() method is the preferred method for attaching event handlers to a document."

#8 @johnstonphilip
3 years ago

  • Keywords dev-feedback added

#9 follow-up: @johnbillion
3 years ago

  • Keywords needs-refresh has-patch added; dev-feedback removed
  • Milestone changed from Awaiting Review to Future Release
  • Type changed from defect (bug) to enhancement

Thanks for the updated patch, johnstonphilip.

It looks like the order of the first two parameters in .on() needs to be reversed.

Do the other event handlers in add_postbox_toggles() need to be updated too? I would expect so, for completeness.

@johnstonphilip
3 years ago

All "bind"s changed to "on"s.

#10 in reply to: ↑ 9 @johnstonphilip
3 years ago

Replying to johnbillion:

Good call - not sure how I missed that.

I tested this patch this time - on both Chrome, Safari, and Mobile Safari.

Thanks for taking a look, johnbillion!

Note: See TracTickets for help on using tickets.