簡體   English   中英

數據表和表工具的警告警報

[英]Warning alert on datatables & tabletools

我正在使用jQuery庫(DataTables)制作一個表,並想添加按鈕以將表的結果導出到Excel文件,然后以該頁面為例 ,並導出它們,但是現在當頁面加載時發送警報,我一直在互聯網上閱讀,說它可以管理腳本中的某些行和狀態,但是當我打開頁面時,我無法解決它,它顯示了下一個錯誤:

DataTables警告(表ID ='example'):無法重新初始化DataTable。

要檢索此表的DataTables對象,請不傳遞任何參數,或參閱bRetrieve和bDestroy的文檔

我用下一種形式調用腳本:index.php

<meta charset="utf-8">
    <script src="js/jquery.js" type="text/javascript"></script>
    <script src="js/funciones.js" type="text/javascript"></script>
    <script src="js/jquery.dataTables.js" type="text/javascript"></script>
    <link href="css/cuerpo.css" rel="stylesheet" type="text/css" /> 


    <!--Prueba-->
        <style type="text/css" title="currentStyle">
            @import "css/demo_page.css";

            @import "css/TableTools.css";
        </style>
        <script src="js/TableTools.js" type="text/javascript"></script>
        <script src="js/ZeroClipboard.js" type="text/javascript"></script>
        <script type="text/javascript" charset="utf-8">
            $(document).ready( function () {
                $('#example').dataTable( {
                    "sDom": 'T<"clear">lfrtip'
                } );
            } );
        </script>

    <!--Prueba-->
</head>
<body id="dt_example">
    <div id="container">
        <div id="header"> 
        </div>
            <div id="intro">
                <header id="titulo">
                </header>
                    <div id="demo">


                <article id="contenido"></article>
                <br><br>
            </div>
    </div>

</body>

然后調用一個JS頁面:

$(document).ready(function(){
    verlistado()
    //se carga la lista de la consulta


})
function verlistado(){ //funcion para mostrar el listado en el index por jquery
              var randomnumber=Math.random()*11;
            $.post("Registro/lista_base.php", {
                randomnumber:randomnumber
            }, function(data){
              $("#contenido").html(data);
            });
}

after it use the jQuery library and print on a php data table:

$(document).ready(function(){
   $('#example').dataTable( { //convertimos nuestro listado de la forma del jquery.datatables- pasamos el id de la tabla
        "sPaginationType": "full_numbers" //damos formato a la paginacion(numeros)
    } );
})


        <!--Prueba-->
        <style type="text/css" title="currentStyle">

            @import "css/TableTools.css";
        </style>
        <script src="js/TableTools.js" type="text/javascript"></script>
        <script src="js/ZeroClipboard.js" type="text/javascript"></script>
        <script type="text/javascript" charset="utf-8">
            $(document).ready( function () {
                $('#example').dataTable( {
                    "sDom": 'T<"clear">lfrtip'
                } );
            } );
        </script>

    <!--Prueba-->
    <script language="JavaScript" type="text/javascript">
        function PopWindow(idUsuario)
            {
                window.open('Registro/detalle.php?id='+idUsuario,'Registo del alumno','width=420, height=350');
            }
    </script>
    <script type="text/javascript" language="javascript" src="js/listado.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script>
    <script>
        $(document).ready(function()
            {
                $('[rel=tooltip]').bind('mouseover', function()
                    {
                        if ($(this).hasClass('ajax')) 
                            {
                                var ajax = $(this).attr('ajax');    
                                $.get(ajax,

                                function(theMessage)
                                    {
                                        $('<div class="tooltip">'  + theMessage + '</div>').appendTo('body').fadeIn('fast');});
                            }
                        else{
                                var theMessage = $(this).attr('content');
                                                $('<div class="tooltip">' + theMessage + '</div>').appendTo('body').fadeIn('fast');
                            }

                $(this).bind('mousemove', function(e)
                    {
                        $('div.tooltip').css
                            ({
                                'top': e.pageY - ($('div.tooltip').height() / 2) - 5,
                                'left': e.pageX + 15
                            });
                    });

                }).bind('mouseout', function(){
                    $('div.tooltip').fadeOut('fast', function(){
                    $(this).remove();
                });
                });
            });
        </script>
        <style>
            .tooltip
                {
                    position:absolute;
                    width:250px;
                    background-image:url(images/tip-bg.png);
                    background-position:left center;
                    background-repeat:no-repeat;
                    color:#FFF;
                    padding:5px 5px 5px 18px;
                    font: Verdana, Geneva, sans-serif;
                    font-size:12px;
                }
            li
                {
                    margin-bottom:30px;
                }
            #wrapper
                {
                    margin:0 auto;
                    width:500px;
                    margin-top: 99px;
                }
        </style>
        <div id="demo">
        <table cellpadding="0" cellspacing="0" border="0" class="display" id="example">
            <thead>
                <tr>
                    <th>Instituto</th>
                    <th>Categoria</th>
                    <th>Version</th>
                    <th width="20%">Nombre</th>
                    <th>Nacionalidad</th>
                    <th>email</th>
                    <th>Puntaje</th>
                    <th>Comprobante</th>
                    <th width='1%'>Detalles</th>
                </tr>
            </thead>
            <tfoot>
                <tr> 
                </tr>
            </tfoot>
            <tbody>
                <?php
                    while($reg=  mysql_fetch_array($listado))
                        {
                            echo '<tr>';
                            echo '<td><center>'.mb_convert_encoding($reg['razon_comercial'], "UTF-8").'</center></td>';
                            echo '<td><center>'.mb_convert_encoding($reg['categoria'], "UTF-8").'</center></td>';
                            echo '<td><center>'.mb_convert_encoding($reg['version'], "UTF-8").'</center></td>';
                            echo '<td>'.mb_convert_encoding($reg['Nombre'], "UTF-8").'</td>';
                            echo '<td><center>'.mb_convert_encoding($reg['nacionalidad'], "UTF-8").'</center></td>';
                            echo '<td>'.mb_convert_encoding($reg['email'], "UTF-8").'</td>';
                            echo '<td><center>'.mb_convert_encoding($reg['calificacion'], "UTF-8").'</center></td>';
                            echo "<td><center><a href='".mb_convert_encoding($reg['comprobante'], 'UTF-8')."'</a>descargar</center></td>";                      
                            echo "<td><a href=javascript:PopWindow(".mb_convert_encoding($reg['idAlumno'], 'UTF-8').") alt=Image Tooltip rel=tooltip content='
                                    <div id=con><b>Nombre: </b>".mb_convert_encoding($reg['Nombre'], "UTF-8")."<br>
                                    <b>Nacionalidad: </b>".mb_convert_encoding($reg['nacionalidad'], "UTF-8")."<br>
                                    <b>Correo: </b>".mb_convert_encoding($reg['email'], "UTF-8")."<br>
                                    <b>Instituto: </b>".mb_convert_encoding($reg['razon_comercial'], "UTF-8")."<br>
                                    <b>Puntaje: </b>".mb_convert_encoding($reg['calificacion'], "UTF-8")."<br>
                                    <b>Categoria: </b>".mb_convert_encoding($reg['categoria'], "UTF-8")."<br>
                                    <b>Versi&oacute;n: </b>".mb_convert_encoding($reg['version'], "UTF-8")."</div>'><center><img src='images/detail.png' width='20%'></center></a><br></td>";
                            echo '</tr>';

                        }
                ?>
            </tbody>
        </table>

我希望你能幫助我。

我認為您遇到的問題是在加載數據之前觸發了javascript。 要解決此問題,請確保腳本位於正在填充的表的下方。

您在同一頁面上針對#example兩次調用了dataTable,這將引發“ DataTables警告(表ID ='example'):無法重新初始化DataTable”錯誤

先前的答案是正確的,但是,如果要添加導出按鈕,則還需要刷新路徑。

sSwfPath: "/swf/copy_csv_xls_pdf.swf",

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM