Question

我遇到问题，我无法在Joomla 1.5上运行DataTables.net javascripts。该脚本与DataTables上的脚本一样

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
        <script src="//datatables.net/download/build/nightly/jquery.dataTables.js"></script>
        <script type="text/javascript">
    $(document).ready( function () {
    var table = $('#example').DataTable();
} );
</script>

要说是Joomla剥离我的代码，我设法运行Google Chart API javascript没有任何问题。这里的任何专家都会分享为什么会发生这种情况？

更新：

以下是我的代码：

   <?php

    $doc = JFactory::getDocument();

    $doc->addScript('http://code.jquery.com/jquery-1.11.0.min.js');
    $doc->addScript('http://datatables.net/download/build/nightly/jquery.dataTables.js');
    $doc->addScriptDeclaration('
        $(document).ready( function () {
            $("#example").DataTable();
        });
    ');

    function listProcess($process,$date_sort)
    {
        $asas= new class_asas;
        $sql = "
        Select proses_pendaftaran.*, secretary.*, 
            kpps_agih.name as kpps_agih_name,
            kpps_sokong.name as kpps_sokong_name,
            ppps.name as ppps_name,
            tps.name as tps_name,
            pjs.name as pjs_name,
            pt.name as pt_name

        From proses_pendaftaran 
            Left join jos_users secretary On secretary.id=proses_pendaftaran.user_id
            Left join jos_users kpps_agih On kpps_agih.id=proses_pendaftaran.kpps_agih_id
            Left join jos_users kpps_sokong On kpps_sokong.id=proses_pendaftaran.kpps_sokong_id
            Left join jos_users ppps On ppps.id=proses_pendaftaran.ppps_semak_id
            Left join jos_users tps On tps.id=proses_pendaftaran.tps_perakui_id
            Left join jos_users pjs On pjs.id=proses_pendaftaran.pjs_lulus_id
            Left join jos_users pt On ppps.id=proses_pendaftaran.pt_rekod_id
        Where current_process='$process' 
        Order By $date_sort DESC";
        //echo $sql;
        return $asas->readAll($sql);


    }
    $userm = $asas->getUser();
    $userid = $user->get('id');
    $userm=$asas->getOtherUser($userid);
    $usergroup = $userm['user_group_id'];

    //---------------------------------------------------------------------------------------------------------------

    //PJS, TPS, KPPS
    if($usergroup ==7 or $usergroup ==2 or $usergroup ==3 or $usergroup ==4 or $usergroup ==5)
    {
    $datas=listProcess('ppps_semak','kpps_agih_date');
    ?>
    <h1 class="contentheading">Senarai Permohonan Yang Telah Diagihkan (Menunggu Tindakan PPPS/PPPS(P))</h1>
    <table id ="example" width="100%" class="systemTable">
    <thead>
        <tr>

            <th width="20%">NAMA BADAN SUKAN</th>
            <th width="10%">NAMA PEMOHON</th>
            <th width="10%">TARIKH PERMOHONAN</th>
            <th width="10%">PEGAWAI KPPS</th>
            <th width="15%">TARIKH DIAGIHKAN</th>
            <th width="10%">PEGAWAI PPPS</th>
            <th width="10%">STATUS</th>
        </tr>
        </thead>
        <?php 
        foreach($datas as $data)
        {

        ?>
        <tr>

            <td><?php echo strtoupper($data['NamaBadan']) ?></td>
            <td><?php echo strtoupper($data['name']) ?><br/>[<?php echo $data['TelPejabat'] ?>]</td>
            <td><?php echo date('d/m/Y',strtotime($data['tarikh_mohon'])) ?></td>
            <td><?php echo strtoupper($data['kpps_agih_name']) ?></t>
            <td><?php echo date('d/m/Y (h:ia)',strtotime($data['kpps_agih_date'])) ?></td>
            <td><?php echo strtoupper($data['ppps_name']) ?></t>
            <td><?php echo strtoupper($data['current_process']) ?></t>
        </tr>
        <?php

        }
        ?>
    </table>
    <br/>

    <?php
    }
?>

Answer 1

尝试使用以下内容导入脚本并添加自定义代码：

$doc = JFactory::getDocument();

$doc->addScript('http://code.jquery.com/jquery-1.11.0.min.js');
$doc->addScript('http://datatables.net/download/build/nightly/jquery.dataTables.js');
$doc->addScriptDeclaration('
    $(document).ready( function () {
        $("#example").DataTable();
    });
');

<强> HTML：

<table id="example">
    <thead>
        <tr>
            <th>Column 1</th>
            <th>Column 2</th>
            <th>etc</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Row 1 Data 1</td>
            <td>Row 1 Data 2</td>
            <td>etc</td>
        </tr>
        <tr>
            <td>Row 2 Data 1</td>
            <td>Row 2 Data 2</td>
            <td>etc</td>
        </tr>
    </tbody>
</table>

我几分钟前就已经对此进行过测试，这对我来说非常适合。请复制并粘贴脚本（进行一些更改）和我提供的HTML。

Answer 2

首先，由于您处于Joomla环境中，因此mootools和jquery之间会发生冲突，因此您无法使用

      $(document).ready( function () { $("#example").DataTable(); });

但是

      jQuery.noConflict(); 
      jQuery(document).ready( function () { jQuery("#example").DataTable(); });

换句话说，当mootools库存在时，你不能使用$。

你也可以考虑使用具有所有数据表功能的Joomla（http://www.tabulizer.com）的Tabulizer而不会有麻烦。

无法将DataTables.net javascript添加到Joomla 1.5

2 个答案: