DataTable Access to XMLHttpRequest at what to do?

S

SPART4K2020-08-31 16:39:04

JSON

SPART4K, 2020-08-31 16:39:04

Hello, I want to connect dataTables to my page

<!DOCTYPE html>
<html lang="ru">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>StorePad</title>

    <!-- Bootstrap core CSS -->
    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/media.css">

    
    <!-- Custom styles for this template -->
  </head>
  <body>
    <!--header leftmenu-->
    <div class="leftmenu">
      <div class="nav">
        <a href="#"><img src="img/logotype.png" alt="Логотип"></a>
      <ul class="navbar">
        
        <li><a href="#"><div class="icon imgMain"></div>Главная</a></li>
        <li><a href="#"><div class="icon imgOrder"></div>Заказы</a></li>
        <li><a href="#"><div class="icon imgClients"></div>Клиенты</a></li>
        <li><a href="#"><div class="icon imgDisplay"></div>Дисплей</a></li>
      </ul>
      </div>
    </div>
    <!--header leftmenu-->
    <!--header main-->
    <div class="main">
      <!--header header-->
      <div class="header">
      <div class="personalAreaBar">
        <a href="#"><img src="img/avatar.png" alt="Аватар" class="avatar"><p class="name">Lestate15</p></a>
        <a href="#"><img src="img/notification.png" alt="Уведомления"></a>
      </div>
      </div>
      <!--header header-->

      <!--header content-->
      <div class="content">
        <table id="example" class="display" style="width:100%">
        <thead>
            <tr>
                <th>Name</th>
                <th>Position</th>
                <th>Office</th>
                <th>Extn.</th>
                <th>Start date</th>
                <th>Salary</th>
            </tr>
        </thead>
        <tfoot>
            <tr>
                <th>Name</th>
                <th>Position</th>
                <th>Office</th>
                <th>Extn.</th>
                <th>Start date</th>
                <th>Salary</th>
            </tr>
        </tfoot>
    </table>
      </div><!--header content-->
    </div>
    <!--header main-->
    <script src="https://code.jquery.com/jquery-3.5.1.js" ></script>
    <script src="https://cdn.datatables.net/1.10.21/js/jquery.dataTables.min.js" ></script>
    <script src="https://cdn.datatables.net/plug-ins/1.10.15/i18n/Russian.json"></script>

    <script src="js/script.js"></script>
    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
  </body>

</html>

script.js file:

$(document).ready(function() {
    $('#example').DataTable( {
        "ajax": '../StorePad/ajax/data/arrays.txt'
    } );
} );

displays the following error

I tried to do it through OpenServer:

I did not find a solution to the problem, kind people, tell me

Reply

Answer the question

In order to leave comments, you need to log in

3 answer(s)

S

Sergey S, 2015-07-23
@artem_music

The site uses the Masonry masonry.desandro.com script, which builds the blocks itself. Using a script does not affect the quality of layout in my opinion.

S

Sergey Melnikov, 2015-07-23
@mlnkv

https://www.google.com.ua/webhp?sourceid=chrome-in...

P

Pavel Shvedov, 2015-07-23
@mmmaaak

Did something similar recently as an experiment, but without absolute positioning. You just need to change the block ordering logic a bit codepen.io/anon/pen/rVqBLK