From 0eb87d02c5a862ea1f92ecd825d09804ebc9cc6b Mon Sep 17 00:00:00 2001 From: "Michael Adams (mdawaffe)" Date: Sun, 6 Dec 2015 22:22:44 +0000 Subject: [PATCH] Meta Boxes: Preserve radio inputs' state when sorting metaboxes. When sorting a metabox, a clone of that metabox is created as a drag/drop "helper". Previously, any checked radio input in the original metabox would become unchecked, when its clone "helper" was inserted into the DOM (since only one radio within a set of radios of the same name can be checked). Continued use of the clone helper is important so that the element being dragged isn't subject to the click and other event handlers attached to the real metabox, so we can't just switch to dragging around the real metabox. See, for example, comment:10:ticket:16972. Preserve the radios' state via some name attribute trickery. Fixes #16972 git-svn-id: https://develop.svn.wordpress.org/trunk@35809 602fd350-edb4-49c9-b593-d223f7449a82 --- src/wp-admin/js/postbox.js | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git a/src/wp-admin/js/postbox.js b/src/wp-admin/js/postbox.js index 4fe74193bb..a4cdad8001 100644 --- a/src/wp-admin/js/postbox.js +++ b/src/wp-admin/js/postbox.js @@ -109,7 +109,20 @@ var postboxes; distance: 2, tolerance: 'pointer', forcePlaceholderSize: true, - helper: 'clone', + helper: function( event, element ) { + // `helper: 'clone'` is equilavalent to `return element.clone();` + // Cloning a checked radio and then inserting that clone next to the original + // radio unchecks the original radio (since only one of the two can be checked). + // We get around this by renaming the helper's inputs' name attributes so that, + // when the helper is inserted into the DOM for the sortable, no radios are + // duplicated, and no original radio gets unchecked. + return element.clone() + .find( ':input' ) + .attr( 'name', function( i, currentName ) { + return 'sort_' + parseInt( Math.random() * 100000, 10 ).toString() + '_' + currentName; + } ) + .end(); + }, opacity: 0.65, stop: function() { var $el = $( this );