DataTables下拉菜单从MySQL数据库中提取多个列

时间:2014-07-28 18:55:04

标签: php jquery mysql datatables

我想知道是否可以在表格的Associated Floor Plans部分添加一个下拉列表。在这个下拉列表中,我想添加存储在数据库中的其他URL。我是否会在数据库中创建一个新列来调用存储在Google云端硬盘中的其他网址,以及如何创建显示与该网格相关联的所有文件的下拉列表。

这是一个非常特别的问题,因为它会将数据库中的其他项目调用到本质上是同一列的内容。

感谢您的实例。另外,请随意批评我在代码中使用的方法。

<?php
$con = mysql_connect("localhost", "root", "root");
if(!$con){
die("Error: ".mysql_error());
}
mysql_select_db("Test_Data", $con);
$result = mysql_query("SELECT * FROM Test_DataSet");
?>
<html>
<head>
<title>TEST TABLE</title>
<meta http-equiv="Content-Type" content="text/hmtl; charset=UTF-8">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script src="DataTables-1.10.1/media/js/jquery.js" type="text/javascript"></script>
<script src="DataTables-1.10.1/media/js/jquery.DataTables.js" type="text/javascript"></script>
<script type="text/javascript" src="fancybox/lib/jquery.mousewheel-3.0.6.pack.js"></script>
<link rel="stylesheet" href="fancybox/source/jquery.fancybox.css" type="text/css" media="screen" />
<script type="text/javascript" src="fancybox/source/jquery.fancybox.pack.js"></script>
<link rel="stylesheet" href="fancybox/source/helpers/jquery.fancybox-buttons.css" type="text/css" media="screen" />
<script type="text/javascript" src="fancybox/source/helpers/jquery.fancybox-buttons.js"></script>
<script type="text/javascript" src="fancybox/source/helpers/jquery.fancybox-media.js"></script>
<link rel="stylesheet" href="/fancybox/source/helpers/jquery.fancybox-thumbs.css" type="text/css" media="screen" />
<script type="text/javascript" src="/fancybox/source/helpers/jquery.fancybox-thumbs.js"></script>


<style type="text/css">
    @import "DataTables-1.10.1/media/css/jquery.dataTables.css";
</style>
<style type="text/css">
@import "DataTables-1.10.1/examples/resources/bootstrap/3/dataTables.bootstrap.css";
</style>


<script type="text/javascript" charset="UTF-8">
    $(document).ready(function(){
        $('#datatables').dataTable();
    })
</script>
<script type="text/javascript">
    $(document).ready(function() {
        $(".fancybox").fancybox();
    });
</script>

<script>
    $(document).ready(function() {
        $(".various").fancybox({
            maxWidth    : 1600,
            maxHeight   : 1200,
            fitToView   : true,
            width       : '100%',
            height      : '100%',
            autoSize    : true,
            closeClick  : false,
            openEffect  : 'none',
            closeEffect : 'none'
        });
});
</script>


<script>
    jQuery(document).ready(function () {
        $('a.modalGeneric').fancybox({
            type: 'iframe',
            fitToView: true,
            autoSize: true,
            openEffect: 'fade',
            openSpeed: 'slow'
        });
});
</script>
<style> iframe{border: none; width: 20}</style>
</head>
<body>
<div>
     <table id="datatables" class="hover" cellspacing="0" width="100%">
         <thead>
             <tr>
                <th>Building</th>            
                <th>Floor</th>
                <th>Number of AP</th>
                <th>Associated Floor Plans</th>
                <th>View on WebPage</th>
             </tr>
         </thead>
         <tbody>
            <?php
            while($row = mysql_fetch_assoc($result)){
            ?>
            <tr class ="odd gradeX">
                <td><?php echo $row['Building']; ?></td>             
                <td><?php echo $row['Floor']; ?></td>
                <td><?php echo $row['Number_Of_AP']; ?></td>
                <td><?php echo '<a class="various fancybox.iframe”  href="'.$row['Associated_Floor_Plans'].'" target="_blank">'.$row['Associated_Floor_Plans'].'</a>';?></td>
                <td><?php echo '<a class="various fancybox.iframe” href="'.$row['View_On_Webpage'].'" target="_blank">View in AMP<'.$row['View_On_Webpage'].'</a>';?></td>
            </tr>
            <?php
            }
        ?>
        </tbody>
    </table>
  </div>
 </body>
 </html>

0 个答案:

没有答案