<!DOCTYPE html>
<html>
  <head>
    <script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
    <link href="https://nightly.datatables.net/css/jquery.dataTables.css" rel="stylesheet" type="text/css" />
    <script src="https://nightly.datatables.net/js/jquery.dataTables.js"></script>
    <meta charset=utf-8 />
    <title>DataTables - JS Bin</title>
  </head>
  <body>
  <div class="container">
    <table id="fidsTable" class="display nowrap" width="100%">
    <thead>
      <tr>
         <th>Time</th>
         <th>Logo</th>
         <th>Departing from</th>
         <th>Temp</th>
         <th>Flight No</th>
         <th>Status</th>
       </tr>
      </thead>
      <tbody>
      <tr>
        <td>10:10</td>
        <td><img src="../../../../../../airline_logos/fr.gif" alt="." /></td>
        <td>Alicante</td>
        <td>22 &deg;C</td>
        <td>FR2152</td>
        <td>Boarding</td>
      </tr>
      <tr>
         <td>10:10</td>
        <td><img src="../../../../../../airline_logos/ls.gif" alt="." ></td>
        <td>Lanzarote</td>
        <td> 23 &deg;C</td>
        <td>LS1201</td>
        <td>Boarding</td>
      </tr>
      <tr>
        <td>10:50</td>
        <td><img src="../../../../../../airline_logos/lh.gif" alt="." ></td>
        <td>Frankfurt</td>
        <td>5 &deg;C</td>
        <td>LH953</td>
        <td>Estimated 11:15</td>
      </tr>
      <tr>
        <td>11:00</td>
        <td><img src="../../../../../../airline_logos/kl.gif" alt="."></td>
        <td>Amsterdam</td>
        <td>15 &deg;C</td>
        <td>KL1424</td>
        <td>Check-In Open</td>
      </tr>
      <tr>
        <td>11:00</td>
        <td width="13%"><img src="../../../../../../airline_logos/lh.gif" alt="." ></td>
        <td>Munich</td>
        <td>6 &deg;C</td>
        <td>LH2509</td>
        <td>Estimated 11:15</td>
      </tr>
      <tr>
        <td>11:00</td>
        <td><img src="../../../../../../airline_logos/ezy.gif" alt="." ></td>
        <td>Belfast</td>
        <td>9 &deg;C</td>
        <td>EZY194</td>
        <td>Check-In Open</td>
      </tr>
      <tr>
        <td>11:05</td>
        <td><img src="../../../../../../airline_logos/tk.gif" alt="." ></td>
        <td>Istanbul </td>
        <td>17 &deg;C</td>
        <td>TK1968</td>
       <td>Check-In Open</td>
      </tr>
      <tr>
        <td>11:05</td>
        <td><img src="../../../../../../airline_logos/ezy.gif" alt="." ></td>
        <td>Glasgow</td>
        <td>11 &deg;C</td>
        <td>EZY512</td>
        <td>Check-In Open</td>
      </tr>
      <tr>
        <td>11:10</td>
        <td><img src="../../../../../../airline_logos/af.gif" alt="."></td>
        <td>Paris CDG</td>
        <td>12 &deg;C</td>
        <td>AF1165</td>
        <td>Check-In Open</td>
      </tr>
      <tr>
        <td>11:25</td>
        <td><img src="../../../../../../airline_logos/gr.gif" alt="." ></td>
        <td>Guernsey</td>
        <td>14 &deg;C</td>
        <td>GR703</td>
        <td>On Time</td>
      </tr>
      <tr>
        <td>11:30</td>
        <td><img src="../../../../../../airline_logos/ls.gif" alt="."></td>
        <td>Funchal</td>
        <td>21 &deg;C</td>
        <td>LS1225</td>
        <td>On Time</td>
      </tr>
      <tr>
        <td>11:55</td>
        <td><img src="../../../../../../airline_logos/ezy.gif" alt="."></td>
        <td >Edinburgh</td>
        <td>11 &deg;C</td>
        <td>EZY502</td>
        <td>On Time</td>
      </tr>
    </tbody>
   </table>
   </div>
  </body>
</html>
 
body {
  font: 90%/1.45em "Helvetica Neue", HelveticaNeue, Verdana, Arial, Helvetica, sans-serif;
  margin: 0;
  padding: 0;
  color: #333;
  background-color: #fff;
}
 
var degree = '\u2103';
var airlineimage = '../../';
var pageInfo;
var endInt;
var currentInt;
var currentpage;
var datareload;
var datarefresh;
var datareloadplus = 6000;
var dropdown = 100;
var dropdownspeed = 100;
$(document).ready(function() {
    table = $('#fidsTable').DataTable({
        createdRow: function(row, data, dataIndex) {
            $('td:eq(0)', row).css('padding-left', '15px');
            $('td:eq(1)', row).css('color', 'yellow');
            $('td:eq(3)', row).css('margin-left', '-50px');
            $('td:eq(5)', row).css('color', 'yellow');
        },
     
        //data: allData,
       
        pageLength: 11,
        lengthChange: false,
        responsive: true,
        ordering: false,
        autoWidth: false,
        paging: true,
        searching: false,
        orderable: false,
        info: true,
        pagingType: "numbers",
        dom: '<"top"i>rt<"clear">',
        language: {
            "emptyTable": "There are no flights for <?php echo $date; ?>",
            "info": "Page No: _PAGE_ of _PAGES_",
        },
        columnDefs: [{
            'max-width': '10%',
            'targets': 2
        }],
        columns: [{
                data: "ScheduleTime"
            },
            {
                data: "Flight"
            },
            {
                data: "Image",
                render: function(data, type) {
                    return '<img class="responsive_image" src="' + airlineimage + '' + data + '"/>';
                }
            },
            {
                data: "AirportName"
            },
            {
                data: "Temp"
            },
            {
                data: "RemarksWithTime"
            },
        ],
        rowCallback: function(row, data) {
            $('td', row).eq(4).addClass('flightdatatemp');
        },
        initComplete: function(settings, json) {
                  
                  var api = this.api();
            // Set the first page load
            $("table tbody tr").hide();
            // $("table tbody tr").each(function(index){
            // $(this).delay(index*dropdown).show(dropdownspeed);
            // });
            // Get the page info, so we know what the last is
            var pageInfo = api.page.info();
            datareload = pageInfo.pages * 6000;
            console.log("REFRESH 1", datareload);
            // Set the ending interval to the last page
            endInt = pageInfo.pages,
                // Current page
                currentInt = 0,
                // Start an interval to go to the "next" page every 3 seconds
                interval = setInterval(function() {
                        // "Next" ...
                        api.page(currentInt).draw('page');
                        $("table tbody tr").hide();
                        $("table tbody tr").each(function(index) {
                            $(this).delay(index * dropdown).show(dropdownspeed);
                        });
                        // Increment the current page int
                        currentInt++;
                        console.log("ENDINT", endInt);
                        console.log("CURRENTINT", currentInt);
                        // If were on the last page, reset the currentInt to the first page #
                        if (currentInt === endInt) {
                            currentInt = 0;
                           /* function datarefresh() {
                                $("table tbody tr").hide();
                                $("table tbody tr").each(function(index) {
                                    $(this).delay(index * dropdown).show(dropdownspeed);
                                    console.log("RUN REFRESH");
                                    table.ajax.reload(null, false);
                                });
                            }
*/
                            //datareload = datareload + datareloadplus;
                            //setTimeout(datarefresh, datareload);
                        }
                    },
                  6000); // 6 seconds
        }
    });
});
1 error
Line 120: Expected an assignment or function call and instead saw an expression.
Output 300px

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers