I have added the Media Uploader to our plugin, but it is creating multiple instances somehow. The Model is created twice. One with the configurations and one appears to be the default instances. I have no idea where it is being instigated from. Here is my JS:
/**
* Load media uploader on pages with our custom metabox
*/
jQuery(document).ready(function($){
'use strict';
var file_frame = null;
function showMediaUploader(e) {
var self = this;
var title = ( $(self).attr('id') == 'listListingImages' ) ? 'Select Multiple Images' : 'Select Image';
var text = ( $(self).attr('id') == 'listListingImages' ) ? 'Add Images' : 'Add Image';
// If the media frame already exists, reopen it.
if ( file_frame ) {
file_frame.open();
return;
}
// Create the media frame, if applicable.
if (!file_frame) {
file_frame = wp.media.frames.file_frame = wp.media({
title: title, // Translated string
button: {
text: text //Translated string
},
multiple: false
});
file_frame.off("select");
file_frame.on("select", function() {
setCustomImage(self);
});
file_frame.open();
}
}
function setCustomImage(btn) {
var attachment = file_frame.state().get("selection").first().toJSON();
$(btn).prev().val(attachment.url);
}
$(".wp-upload-button").on("click", showMediaUploader);
});
and this is the HTML
echo '<input type="text" name="'. $this->element_name() .'" id="listListingImages" value="'. $this->element_value() .'">';
echo '<a href="#" class="button button-primary exopite-sof-button wp-upload-button" id="listListingImages" data-media-uploader-target="#listListingImages">'. $add .'</a>';
View the error in this gif
If this isn't an error with my code, but rather another instance of the Media Uploader coming from somewhere else, how would I go about I dentifiying where that is?
I have added the Media Uploader to our plugin, but it is creating multiple instances somehow. The Model is created twice. One with the configurations and one appears to be the default instances. I have no idea where it is being instigated from. Here is my JS:
/**
* Load media uploader on pages with our custom metabox
*/
jQuery(document).ready(function($){
'use strict';
var file_frame = null;
function showMediaUploader(e) {
var self = this;
var title = ( $(self).attr('id') == 'listListingImages' ) ? 'Select Multiple Images' : 'Select Image';
var text = ( $(self).attr('id') == 'listListingImages' ) ? 'Add Images' : 'Add Image';
// If the media frame already exists, reopen it.
if ( file_frame ) {
file_frame.open();
return;
}
// Create the media frame, if applicable.
if (!file_frame) {
file_frame = wp.media.frames.file_frame = wp.media({
title: title, // Translated string
button: {
text: text //Translated string
},
multiple: false
});
file_frame.off("select");
file_frame.on("select", function() {
setCustomImage(self);
});
file_frame.open();
}
}
function setCustomImage(btn) {
var attachment = file_frame.state().get("selection").first().toJSON();
$(btn).prev().val(attachment.url);
}
$(".wp-upload-button").on("click", showMediaUploader);
});
and this is the HTML
echo '<input type="text" name="'. $this->element_name() .'" id="listListingImages" value="'. $this->element_value() .'">';
echo '<a href="#" class="button button-primary exopite-sof-button wp-upload-button" id="listListingImages" data-media-uploader-target="#listListingImages">'. $add .'</a>';
View the error in this gif
If this isn't an error with my code, but rather another instance of the Media Uploader coming from somewhere else, how would I go about I dentifiying where that is?
As it turned out it was being created somewhere else and I found it by doing a search and replace.