Скрипт работает на Frontend, но не в wp-admin

Question

У меня есть несколько стилей и сценариев из таблиц данных. net, и я использую их в веб-интерфейсе с этой функцией:

function datatables_enqueue_child_styles() {
    if(is_page('alumnes') OR is_page('veure-despeses')){ ?>
    <script src=<?php echo "".get_home_url()."/wp-content/themes/CasalMasRomeu/DataTables/jQuery-3.3.1/jquery-3.3.1.min.js" ?>></script>
    <link href=<?php echo "".get_home_url()."/wp-content/themes/CasalMasRomeu/DataTables/datatables.css" ?> rel="stylesheet" type="text/css">
    <script src=<?php echo "".get_home_url()."/wp-content/themes/CasalMasRomeu/DataTables/datatables.js" ?>></script>
<?php }

}
add_action( 'wp_head', 'datatables_enqueue_child_styles' );

Затем я показываю таблицу с этим фрагментом кода:

<div id="content" class="site-content">
<?php echo do_shortcode('[INSERT_ELEMENTOR id="459"]'); ?>
    <div class="content-formularis">
        <table id="despeses-table" class="display responsive nowrap" style="width:100%">
            <thead>
                <tr>
                    <th>Alumne</th>
                    <th>Quantitat</th>
                    <th>Tipus</th>
                    <th>Pagat</th>
                    <th>Concepte</th>
                    <th>Altres comentaris</th>
                    <th>Data</th>
                </tr>
            </thead>
            <tbody>
                <?php 
                // args
                $args = array(
                    'numberposts'   => -1,
                    'post_type'     => 'despeses',
                );

                // query
                $the_query = new WP_Query( $args );
                if( $the_query->have_posts() ):
                    while( $the_query->have_posts() ) : $the_query->the_post();
                        $id = get_the_ID();
                        if ( get_field( 'pagat' ) == 1 ) { $pagat = "Pagat"; } else { $pagat = "No pagat"; }
                        echo "<tr>";
                        $post_object = get_field( 'alumnes' );
                        echo '<td>'.get_the_title($post_object).'<br>';
                        echo '<a href="' . get_home_url() . '/edita-objectes/?ptype=despeses&object_id=' . $id . '">Editar despesa</a></td>';
                        echo '<td>'.get_field( "quantitat" ).'</td>';
                        echo '<td>'.get_field( "tipus" ).'</td>';
                        echo '<td>'.$pagat.'</td>';
                        echo '<td>'.get_field( "concepte" ).'</td>';
                        echo '<td>'.get_field( "altres_comentaris" ).'</td>';
                        echo '<td>'.get_the_date("d/m/Y").'</td>';
                        echo "</tr>";
                        endwhile;
                endif;
                wp_reset_query();    // Restore global post data stomped by the_post(). ?>
            </tbody>
            <tfoot>
                <tr>
                    <th>Alumne</th>
                    <th>Quantitat</th>
                    <th>Tipus</th>
                    <th>Pagat</th>
                    <th>Concepte</th>
                    <th>Altres comentaris</th>
                    <th>Data</th>
                </tr>
            </tfoot>
        </table>
    </div>

</div>
<script>
var table = $('#despeses-table').DataTable();
$(document).ready( function () {
    $('#despeses-table').DataTable();
        responsive: true
} );
new $.fn.dataTable.Buttons( table, {
    buttons: [
        'copy', 'excel', 'pdf'
    ]
} );

table.buttons().container()
    .appendTo( $('.col-sm-6:eq(0)', table.table().container() ) );
</script>

Это работает хорошо, но когда я хочу использовать его на странице wp-admin, таблица отображается неправильно. Я использую этот фрагмент кода:

function cmr_despeses(){ ?>
    <h1>Despeses</h1>
    <table id="despeses-table" class="display responsive nowrap" style="width:100%">
        <thead>
            <tr>
                <th>Alumne</th>
                <th>Quantitat</th>
                <th>Tipus</th>
                <th>Pagat</th>
                <th>Concepte</th>
                <th>Altres comentaris</th>
                <th>Data</th>
            </tr>
        </thead>
        <tbody>
            <?php 
            // args
            $args = array(
                'numberposts'   => -1,
                'post_type'     => 'despeses',
            );

            // query
            $the_query = new WP_Query( $args );
            if( $the_query->have_posts() ):
                while( $the_query->have_posts() ) : $the_query->the_post();
                    $id = get_the_ID();
                    if ( get_field( 'pagat' ) == 1 ) { $pagat = "Pagat"; } else { $pagat = "No pagat"; }
                    echo "<tr>";
                    $post_object = get_field( 'alumnes' );
                    echo '<td>'.get_the_title($post_object).'<br>';
                    echo '<a href="' . get_home_url() . '/edita-objectes/?ptype=despeses&object_id=' . $id . '">Editar despesa</a></td>';
                    echo '<td>'.get_field( "quantitat" ).'</td>';
                    echo '<td>'.get_field( "tipus" ).'</td>';
                    echo '<td>'.$pagat.'</td>';
                    echo '<td>'.get_field( "concepte" ).'</td>';
                    echo '<td>'.get_field( "altres_comentaris" ).'</td>';
                    echo '<td>'.get_the_date("d/m/Y").'</td>';
                    echo "</tr>";
                    endwhile;
            endif;
            wp_reset_query();    // Restore global post data stomped by the_post(). ?>
        </tbody>
        <tfoot>
            <tr>
                <th>Alumne</th>
                <th>Quantitat</th>
                <th>Tipus</th>
                <th>Pagat</th>
                <th>Concepte</th>
                <th>Altres comentaris</th>
                <th>Data</th>
            </tr>
        </tfoot>
    </table>
    <script>
    var table = $('#despeses-table').DataTable();
    $(document).ready( function () {
        $('#despeses-table').DataTable();
            responsive: true
    } );
    </script>
<?php }

Я поставил в очередь стили на панели администратора, используя эту функцию:

function utm_user_scripts() {
    echo "HOLA";
    $plugin_url = plugin_dir_url( __FILE__ );
    wp_enqueue_style( 'admin-dt-css', $plugin_url . "DataTables/datatables.css");
    wp_enqueue_script( 'admin-dt-js',  $plugin_url . "DataTables/datatables.js");
    wp_enqueue_script( 'admin-dt-jquery',  $plugin_url . "DataTables/jQuery-3.3.1/jquery-3.3.1.min.js");
}
add_action( 'admin_enqueue_scripts', 'utm_user_scripts' );

Я не знаю, что я делаю неправильно и почему он работает на интерфейсе, но не на панели администратора.

Спасибо!

Answer 1

Я решил это, исключая библиотеку jquery. Вы можете найти более подробную информацию здесь:

Ошибка типа: $ (...). DataTable не является функцией

Надеюсь, что она может помочь вам!