Media Manager: Aktualisiert die Bibliothek nach der neuen Auswahl

Ich habe ein benutzerdefiniertes Feld in eine Metabox mit einer Schaltfläche erstellt, die den Medienmanager öffnet und die Auswahl mehrerer Bilder ermöglicht. Beim Ereignis “open” ruft die Galerie die IDs der aktuellen gespeicherten Auswahl aus dem Attribut “data-ids” der Schaltfläche ab, die den Medienmanager austriggers. Die Bilder werden korrekt angezeigt und sind bereits ausgewählt.

Das Problem, das ich habe, ist, dass, nachdem ich den Medienmanager wieder geöffnet habe, und neue Bilder auswählen, obwohl das “Daten-IDs” -Attribut mit den neuen IDs der neu ausgewählten Bilder aktualisiert wird, aktualisiert die Galerie nicht zuvor ausgewählte Bilder mit den neuen, es sei denn, ich speichere zuerst das benutzerdefinierte Feld. Was mache ich falsch? Ich kann nicht herausfinden, wie ich die Auswahl der Bilder “auffrische”. Kann es jemand herausfinden?

Das ist mein Code

// Gallery Field Control var wppf_gallery_ids, wppf_get_gallery_list, wppf_get_gallery_field; GalleryControl = { // Initializes a new media manager or returns an existing frame. // @see wp.media.featuredImage.frame() frame: function() { if ( this._frame ) return this._frame; this._frame = wp.media({ title: 'something', library: { type: 'image' }, button: { text: 'something' }, multiple: 'toggle', }); this._frame.on( 'open', this.updateFrame ).state('library').on( 'select', this.select ); return this._frame; }, select: function() { var selection = GalleryControl._frame.state().get( "selection" ).toJSON(); var wppf_new_ids = ''; // Empty previous images jQuery(wppf_get_gallery_list).empty(); // Load all stuff up jQuery(selection).each(function(index) { jQuery(wppf_get_gallery_list).append('
  • '); wppf_new_ids += this.id + ','; }); // Remove last comma wppf_new_ids = wppf_new_ids.substr(0,wppf_new_ids.length-1); jQuery('#' + wppf_get_gallery_field).attr('data-ids',wppf_new_ids); }, updateFrame: function() { var selection = GalleryControl.frame().state().get('selection'); selection.reset(); // Grab all ids from gallery var all_ids = wppf_gallery_ids.split(','); // Add to selection if(all_ids !== '') { jQuery.each(all_ids, function(index, value) { var attachment = wp.media.attachment( value ); attachment.fetch(); selection.add( attachment ? [ attachment ] : [] ); }); } }, init: function() { // Handle media manager jQuery('body').on('click', '.wppf-open-gallery', function(e) { e.preventDefault(); // Get the gallery id and details wppf_get_gallery_field = jQuery(this).attr('id'); wppf_gallery_ids = jQuery(this).data('ids'); wppf_get_gallery_list = jQuery(this).data('list'); GalleryControl.frame().open(); }); } }; // Run Gallery Editor GalleryControl.init();

    Der Knopf, der die Galerie öffnet, sieht so aus

     Create Gallery 

    Wenn ich dann die Galerie öffne und 2 neue Bilder hinzufüge, wird das Data-IDs-Attribut mit den neuen IDs aktualisiert und sieht so aus

     Create Gallery 

    Allerdings wird der Medienmanager die 4 Bilder nicht “vorauswählen”, bis ich die Post rette. Weiß jemand, wie man dieses Problem beheben kann?

    Vielen Dank.

    Solutions Collecting From Web of "Media Manager: Aktualisiert die Bibliothek nach der neuen Auswahl"

    Ich nehme an, du hast diesen Code irgendwo kopiert. Nur wppf_gallery_ids ich es wppf_gallery_ids habe, sehe ich wppf_gallery_ids nicht irgendwo wppf_gallery_ids der init function, was bedeutet, dass es nichts aktualisieren kann, da die Prüfung leer ist. Ich sehe zwei Optionen: Entweder es während der Auswahl innerhalb der select aktualisieren, oder einfach wppf_new_ids in das Array wppf_new_ids wppf_gallery_ids .

    Mir scheint es, dass beide Variablen wppf_new_ids/_gallery_ids so ziemlich die gleiche functionalität haben und man sie fallen lassen könnte.

    Abgesehen davon sollten Sie Ihr gesamtes Stück Code in eine selbstausführende function einfügen und die Globals hineinschieben:

     ( function( $ ) { 'use strict'; // your code } )( jQuery || {} ); 

    Das bedeutet auch, dass Sie $ anstelle von jQuery .

    Eine andere Sache, die ich vermeiden würde, ist die Verschmutzung des globalen Namensraums. Wenn Sie einfach GalleryControl hinzufügen, haben Sie bereits das window.GalleryControl Set. Mit solch einem generischen Namen wird wahrscheinlich eine Kollision mit anderem Code gestern als morgen passieren. Besserer Stil ist es, einen eigenen, bereits existierenden Namespace auf dem window Objekt zu verwenden: wppf . Das bedeutet, dass Ihr endgültiger Wrapper so aussehen könnte:

     ( function( $ ) { 'use strict'; var gallery; gallery.init = function() { // }; gallery.frame = function() { // }; gallery.select = function() { // }; gallery.updateFrame = function() { // }; window.wppf = window.wppf || {}; window.wppf.gallery = window.wppf.gallery || {}; window.wppf.gallery = new gallery(); } )( jQuery || {} ); 

    Mehr zu diesem Thema im ausgezeichneten Artikel über JS Objects .