web-dev-qa-db-fra.com

wp n'est pas défini erreur en utilisant wp.media pour créer un téléchargeur d'image personnalisé

J'essaie de créer un téléchargeur de média personnalisé dans une méta-boîte personnalisée sur un type de publication personnalisé. C'est beaucoup de coutume. J'ai un fichier javascript mis en file d'attente qui exécute la classe wp.media lorsque vous cliquez sur le bouton Ajouter une image. Lorsque j'ai testé le bouton, le message d'erreur suivant s'affiche: "Uncaught ReferenceError: wp n'est pas défini". J'ai trouvé plusieurs ressources qui ont résolu ce problème en ajoutant wp_enqueue_media (); mais quand j'essaie de le faire, cela ne résout pas le problème. S'il vous plaît aider?

Création de la méta-boîte/script mis en file d'attente: 

function cns_add_custom_metabox(){
    add_meta_box( 'fet-media-fields', 'Listing Media', 'cns_display_media' );
}
add_action( 'add_meta_boxes', 'cns_add_custom_metabox' ); 

function cns_display_media( $post ){ 

    ?>

    <div id="metabox-wrapper">
        <img id="image-tag">
        <input type="hidden" id="img-hidden-field" name="custom_image_data">
        <input type="button" id="image-upload-button" class="button" value="Add Image">
        <input type="button" id="image-delete-button" class="button" value="Remove Image">

    </div>


    <?php
}

function register_admin_script() {
    wp_enqueue_script( 'cns-image-upload.js', get_stylesheet_directory_uri() . '/js/cns-image-upload.js', array('jquery') );
}

add_action( 'admin_enqueue_scripts', 'register_admin_script' );

Fichier Javascript - cns-image-upload.js: 

var addButton = document.getElementById( 'image-upload-button' );
var deleteButton = document.getElementById( 'image-delete-button' );
var img = document.getElementById( 'image-tag' );
var hidden = document.getElementById( 'img-hidden-field' );
var customUploader = wp.media({
    title: 'Select and Image',
    button:{
        text: 'User this Image'
    },
    multiple: false
});

addButton.addEventListener( 'click', function(){
    if( customUploader ){
        customUploader.open();
    }
} );
custom-post-typesmetaboxuploadsjavascripterrors
1
Christy

Deviner! Je n'ai pas encapsulé le code javascript avec les éléments suivants:

jQuery(document).ready( function($){ });

3
Christy