jQuery数据表无法在php中工作

Shown below is my connection.php file.

Pic

I encountered these error in my console

How I can get rid of these errors?

        <?php
        $con=mysqli_connect("localhost", "root", "");
        mysqli_select_db($con,"college");
        if($con)
        {
            //echo "Database Connected";
            //echo "<br>";
        }
        else
        {
            //echo "Database Not Connected";
        }
        ?>

This is my fetch.php file. i called all my css and js file but i don't know why my datatable is not working.

        <html>
        <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" >
        <link rel="stylesheet" href="datatable/media/css/dataTables.jquery.dataTables.css" />
        <link rel="stylesheet" href="datatable/media/css/dataTables.bootstrap.css" />
        <script src="datatable/media/js/dataTables.jquery.dataTables.js"></script>
        <script src="datatable/media/js/dataTables.bootstrap.js"></script>
        </head>
        <body>



        <?php
        include("conn.php");
        $sql="select * from student";
        $res=mysqli_query($con,$sql);
        ?>

        <table border="1" id="datatable">
        <thead>
        <tr>
        <td>USER NAME</td>
        <td>FIRST NAME</td>
        <td>LAST NAME</td>
        <td>EMAIL ADDRESS</td>
        <td>PASSWORD</td>
        </tr>
        </thead>
        <tbody>
        <?php 

        while ($result=mysqli_fetch_array($res))
        {
            ?>
            <tr>
            <td><?php echo $result['Student_Uname']; ?></td>
            <td><?php echo $result['Student_Fname']; ?></td>
            <td><?php echo $result['Student_Lname']; ?></td>
            <td><?php echo $result['Email_Id']; ?></td>
            <td><?php echo $result['Password']; ?></td>
            </tr>

        <?php } ?>
        </tbody>
        </table>
        </body>
        </html>

        <script>
        $(document).ready(function() {
         $('#datatable').DataTable();
        });
        </script>

This is my index.php file. this is my student information page.

        <!DOCTYPE html>
        <html lang="en">
        <head>
        <title>Form Page</title>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" >
        <link rel="stylesheet" href="style/css/bootstrap.css" />
        <link rel="stylesheet" href="style/css/bootstrap-theme.css" />
        </head>
        <body>
        <div class="container">
        <h2 align="center">STUDENT INFORMATION FORM</h2>
        <form method="POST" action="insert.php" class="form-horizontal" autocomplete="off"> 
        <div class="form-group">
        <label for="Uname" class="control-label col-md-2">User Name:</label>
        <div class="col-md-8">
        <input type="text" name="Uname" class="form-control" placeholder="User Name" required >
        </div> 
        </div> 
        <div class="form-group">
        <label for="Fname" class="control-label col-md-2">First Name:</label>
        <div class="col-md-8">
        <input type="text" name="Fname" class="form-control" placeholder="First Name" required >
        </div> 
        </div>
        <div class="form-group">
        <label for="Uname" class="control-label col-md-2">Last Name:</label>
        <div class="col-md-8">
        <input type="text" name="Lname" class="form-control" placeholder="Last Name" required >
        </div>
        </div> 
        <div class="form-group">
        <label for="email" class="control-label col-md-2">Email Address:</label>
        <div class="col-md-8">
        <input type="email" name="email" class="form-control" placeholder="Email Address" required >
        </div>
        </div> 
        <div class="form-group">
        <label for="password" class="control-label col-md-2">Password:</label>
        <div class="col-md-8">
        <input type="password" name="password" class="form-control" placeholder="Password" autocomplete="new-password" required >
        </div>
        </div> 
        <div class="form-group">
        <div class="col-sm-offset-2">
        <button type="submit" name="submit" class="btn btn-info">Submit</button>
        </div>
        </div>
        </form>
        </div>
        <script src="style/js/jquery.js"></script>
        <script src="style/js/bootstrap.js"></script>
        </body>
        </html>

This is my insert.php file, i have inserted properly in database.

        <?php[enter image description here][1]
        include("conn.php");
        if (isset($_POST['submit']))
        {
        $uname=$_POST['Uname'];
        $fname=$_POST['Fname'];
        $lname=$_POST['Lname'];
        $email=$_POST['email'];
        $pass=$_POST['password'];

        $q="insert into student(Student_Uname,Student_Fname,Student_Lname,Email_Id,Password) values ('".$uname."', '".$fname."', '".$lname."', '".$email."', '".$pass."')"; 

        $res=mysqli_query($con,$q);
        }
        ?>
        <h3 align="center">YOU ARE MOVING VIEW PAGE</h3>
        <?php
        header("refresh:1; url=fetch.php");
        ?>

      [1]: https://i.stack.imgur.com/k8JdX.jpg

This is my fetched datatable output page so through this image you can understand more. i fulfill all requirement which are necessary for jQuery datatable. Where is the mistake?

doule6314
doule6314 在浏览器中直接使用而不是从php页面检查css和js文件是否正在加载
大约 3 年之前 回复

1个回答



错误表明Javascript和CSS文件的路径不正确。 </ p>

当使用 src =“datatable / media / js / dataTables.bootstrap.js”</ code>时,它说有一个名为 datatable <的子目录 / code>在 SAME </ strong>目录中,与PHP文件所在的目录相同。</ p>

但是,如果 root </ strong>中有“datatable”目录 >您想要使用前导斜杠的网站: src =“/ datatable / media / js / dataTables.bootstrap.js”</ code>。 前导斜线表示路径相对于我网站的根目录。</ p>
</ div>

展开原文

原文

The errors say that the paths to your Javascript and CSS files are not correct.

When using src="datatable/media/js/dataTables.bootstrap.js", it is saying that there is a subdirectory called datatable in the SAME directory as where your PHP file resides.

If however you have the "datatable" directory in the root of your website you want to use a leading forward slash: src="/datatable/media/js/dataTables.bootstrap.js" instead. The leading forward slash says the path is relative to the root of my website.

dongqiao9583
dongqiao9583 您还必须在datatables库之前加载jQuery库。 你也错过了这个参考
大约 3 年之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问
相关内容推荐