1. 首页
  2. 问答
  3. MySQL表自举响应

MySQL表自举响应

2015-11-30 131 views
0

我一直在试图让我的HTML/PHP的MySQL表在我的网站更加敏感，所以我集成的自举到它，但之后，我这样做了，并加入我的引导需要什么止跌”根本没有反应。所以，当我在我的桌面上，看着我的表它适合整个屏幕，但如果我尝试使用它我的Nexus 6手机上那简直是要大，这是很难看到该表具有信息，监守你必须即使我调整桌面上的浏览器大小，也不会改变大小。MySQL表自举响应

代码：

<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title>Domene informasjon</title> 

    <!-- Bootstrap --> 
    <link href="css/bootstrap.min.css" rel="stylesheet" /> 

    <!-- JQuery og Bootstrap JS --> 
    <script src="jquery/jquery-2.1.4.min.js" type="text/javascript"></script> 
    <script src="js/bootstrap.min.js" type="text/javascript"></script> 
    <script src="js/bootstrap.js" type="text/javascript"></script> 
</head> 
<body> 
<div class="container-fluid"> 
    <div class="row"> 
     <div class="col-xs-12"> 
      <div class="table-responsive"> 

      <?php 
      if(!isset($_GET['field'])) $field = 'ID'; else $field = $_GET['field']; 
      if(!isset($_GET['sorting'])) $sort = 'ASC'; else $sort = $_GET['sorting']; 

      $sql = "SELECT * FROM server1 ORDER BY " .$field." ".$sort; 

      if($sort == 'ASC') $sort = 'DESC'; else $sort = 'ASC'; 
      ?> 

<table id="sorting_table" class="table table-bordered"> 

<tr> 
    <th><a href="php.php?sorting=<?= $sort; ?>&field=ID">ID</a></th> 
    <th><a href="php.php?sorting=<?= $sort; ?>&field=Vsite">Vsite</th> 
    <th><a href="php.php?sorting=<?= $sort; ?>&field=Registrar">Registrar</a></th> 
    <th><a href="php.php?sorting=<?= $sort; ?>&field=Eier">Eier</a></th> 
    <th><a href="php.php?sorting=<?= $sort; ?>&field=NS">NS</a></th> 
    <th><a href="php.php?sorting=<?= $sort; ?>&field=A">A</a></th> 
    <th><a href="php.php?sorting=<?= $sort; ?>&field=MX">MX</a></th> 
    <th><a href="php.php?sorting=<?= $sort; ?>&field=Flyttet">Flyttet</a></th> 
    <th><a href="php.php?sorting=<?= $sort; ?>&field=Slettet">Slettet</a></th> 
    <th><a href="php.php?sorting=<?= $sort; ?>&field=Delt">Delt</a></th> 
    <th><a href="php.php?sorting=<?= $sort; ?>&field=Behkd">Behkd</a></th> 
    <th><a href="php.php?sorting=<?= $sort; ?>&field=Varenr">Varenr</a></th> 
    <th><a href="php.php?sorting=<?= $sort; ?>&field=Server">Server</a></th> 
    <th><a href="php.php?sorting=<?= $sort; ?>&field=Sistoppdatert">Sist oppdatert</a></th> 
</tr> 

<?php 
// kobling til databasen 
mysql_connect("localhost", "root", "ascent") or die (mysql_error()); 

//merke databasen 
mysql_select_db("dom_oversikt") or die(mysql_error()); 

//kjøring av query 
$rs = mysql_query($sql); 

//kvar rad blir til en tabbel 
while($row = mysql_fetch_array($rs)) { 

$color = ''; 

if (($row['Flyttet'] == "NEI") && ($row['Slettet'] == "JA") && ($row['Delt'] == "NEI")) $color ='#ff0000'; 
if ((($row['Flyttet'] == "NEI") && ($row['Slettet'] == "NEI") && ($row['Delt'] == "JA"))|| (($row['Flyttet'] == "JA") && ($row['Slettet'] == "NEI") && ($row['Delt'] == "JA"))) $color ='#FFFF00'; 
if (($row['Flyttet'] == "JA") && ($row['Slettet'] == "NEI") && ($row['Delt'] == "NEI")) $color ='#1E90FF'; 
if ((($row['Flyttet'] == "NEI") && ($row['Slettet'] == "NEI") && ($row['Delt'] == "JA")) || (($row['Flyttet'] == "NEI") && ($row['Slettet'] == "NEI") && ($row['Delt'] == "NEI"))) $color ='#3CB371'; 

    //Første kolone som skal vises 
    echo '<tr style="background-color: '. $color . '">'; 
    echo "<td>" . utf8_encode($row['ID']) . "</td>"; 
    echo "<td>" . utf8_encode($row['Vsite']) . "</td>"; 
    echo "<td>" . utf8_encode($row['Registrar']) . "</td>"; 
    echo "<td>" . utf8_encode($row['Eier']) . "</td>"; 
    echo "<td>" . utf8_encode($row['NS']) . "</td>"; 
    echo "<td>" . utf8_encode($row['A']) . "</td>"; 
    echo "<td>" . utf8_encode($row['MX']) . "</td>"; 
    echo "<td>" . utf8_encode($row['Flyttet']) . "</td>"; 
    echo "<td>" . utf8_encode($row['Slettet']) . "</td>"; 
    echo "<td>" . utf8_encode($row['Delt']) . "</td>"; 
    echo "<td>" . utf8_encode($row['Behkd']) . "</td>"; 
    echo "<td>" . utf8_encode($row['Varenr']) . "</td>"; 
    echo "<td>" . utf8_encode($row['Server']) . "</td>"; 
    echo "<td>" . utf8_encode($row['Sistoppdatert']) . "</td>"; 
    echo "</tr>"; 

} 
echo "</table>"; 


//stenge database koblingen 
mysql_close(); 
?> 
      </div> 
     </div> 
    </div> 
</div> 

</body> 
</html>

来源

2015-11-30 Leifus

+1

这是一个真正的CSS和HTML的问题，并已完全使用PHP和MySQL。 –

+1

完全符合@MagnusEriksson同意，你应该考虑使用你的表的样本数据到时尚，然后删除这些假数据给PHP逻辑集成。 –

+0

这isent关于风格，我只是试图让它响应与MySQL表 – Leifus

回答

0

这是你的代码，我做了你需要的改变（你仍然必须下载插件文件并将其上传到服务器）：

<html> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 
     <title>Domene informasjon</title> 

     <!-- Bootstrap --> 
     <link href="css/bootstrap.min.css" rel="stylesheet" /> 
    <!-- added css restable plugin--> 
    <link href="css/restable.min.css" rel="stylesheet" /> 
<!-- end plugin css--> 
     <!-- JQuery og Bootstrap JS --> 
     <script src="jquery/jquery-2.1.4.min.js" type="text/javascript"></script> 
     <script src="js/bootstrap.min.js" type="text/javascript"></script> 
     <script src="js/bootstrap.js" type="text/javascript"></script> 
<!-- added js restable plugin--> 
    <script src="js/jquery.restable.js" type="text/javascript"> 
<!-- restable--> 
</script> 
    </head> 
    <body> 
    <div class="container-fluid"> 
     <div class="row"> 
      <div class="col-xs-12"> 
       <div class="table-responsive"> 

       <?php 
       if(!isset($_GET['field'])) $field = 'ID'; else $field = $_GET['field']; 
       if(!isset($_GET['sorting'])) $sort = 'ASC'; else $sort = $_GET['sorting']; 

       $sql = "SELECT * FROM server1 ORDER BY " .$field." ".$sort; 

       if($sort == 'ASC') $sort = 'DESC'; else $sort = 'ASC'; 
       ?> 

    <table id="sorting_table" class="table table-bordered"> 

    <tr> 
     <th><a href="php.php?sorting=<?= $sort; ?>&field=ID">ID</a></th> 
     <th><a href="php.php?sorting=<?= $sort; ?>&field=Vsite">Vsite</th> 
     <th><a href="php.php?sorting=<?= $sort; ?>&field=Registrar">Registrar</a></th> 
     <th><a href="php.php?sorting=<?= $sort; ?>&field=Eier">Eier</a></th> 
     <th><a href="php.php?sorting=<?= $sort; ?>&field=NS">NS</a></th> 
     <th><a href="php.php?sorting=<?= $sort; ?>&field=A">A</a></th> 
     <th><a href="php.php?sorting=<?= $sort; ?>&field=MX">MX</a></th> 
     <th><a href="php.php?sorting=<?= $sort; ?>&field=Flyttet">Flyttet</a></th> 
     <th><a href="php.php?sorting=<?= $sort; ?>&field=Slettet">Slettet</a></th> 
     <th><a href="php.php?sorting=<?= $sort; ?>&field=Delt">Delt</a></th> 
     <th><a href="php.php?sorting=<?= $sort; ?>&field=Behkd">Behkd</a></th> 
     <th><a href="php.php?sorting=<?= $sort; ?>&field=Varenr">Varenr</a></th> 
     <th><a href="php.php?sorting=<?= $sort; ?>&field=Server">Server</a></th> 
     <th><a href="php.php?sorting=<?= $sort; ?>&field=Sistoppdatert">Sist oppdatert</a></th> 
    </tr> 

    <?php 
    // kobling til databasen 
    mysql_connect("localhost", "root", "ascent") or die (mysql_error()); 

    //merke databasen 
    mysql_select_db("dom_oversikt") or die(mysql_error()); 

    //kjøring av query 
    $rs = mysql_query($sql); 

    //kvar rad blir til en tabbel 
    while($row = mysql_fetch_array($rs)) { 

    $color = ''; 

    if (($row['Flyttet'] == "NEI") && ($row['Slettet'] == "JA") && ($row['Delt'] == "NEI")) $color ='#ff0000'; 
    if ((($row['Flyttet'] == "NEI") && ($row['Slettet'] == "NEI") && ($row['Delt'] == "JA"))|| (($row['Flyttet'] == "JA") && ($row['Slettet'] == "NEI") && ($row['Delt'] == "JA"))) $color ='#FFFF00'; 
    if (($row['Flyttet'] == "JA") && ($row['Slettet'] == "NEI") && ($row['Delt'] == "NEI")) $color ='#1E90FF'; 
    if ((($row['Flyttet'] == "NEI") && ($row['Slettet'] == "NEI") && ($row['Delt'] == "JA")) || (($row['Flyttet'] == "NEI") && ($row['Slettet'] == "NEI") && ($row['Delt'] == "NEI"))) $color ='#3CB371'; 

     //Første kolone som skal vises 
     echo '<tr style="background-color: '. $color . '">'; 
     echo "<td>" . utf8_encode($row['ID']) . "</td>"; 
     echo "<td>" . utf8_encode($row['Vsite']) . "</td>"; 
     echo "<td>" . utf8_encode($row['Registrar']) . "</td>"; 
     echo "<td>" . utf8_encode($row['Eier']) . "</td>"; 
     echo "<td>" . utf8_encode($row['NS']) . "</td>"; 
     echo "<td>" . utf8_encode($row['A']) . "</td>"; 
     echo "<td>" . utf8_encode($row['MX']) . "</td>"; 
     echo "<td>" . utf8_encode($row['Flyttet']) . "</td>"; 
     echo "<td>" . utf8_encode($row['Slettet']) . "</td>"; 
     echo "<td>" . utf8_encode($row['Delt']) . "</td>"; 
     echo "<td>" . utf8_encode($row['Behkd']) . "</td>"; 
     echo "<td>" . utf8_encode($row['Varenr']) . "</td>"; 
     echo "<td>" . utf8_encode($row['Server']) . "</td>"; 
     echo "<td>" . utf8_encode($row['Sistoppdatert']) . "</td>"; 
     echo "</tr>"; 

    } 
    echo "</table>"; 


    //stenge database koblingen 
    mysql_close(); 
    ?> 
       </div> 
      </div> 
     </div> 
    </div> 

    <!--call the plugin--> 
    <script> 
     $(document).ready(function(){ 
      $('#sorting_table').ReStable({ 
      rowHeaders: true, // Table has row headers? 
      maxWidth: 480 // Size to which the table become responsive 
     }); 
     }) 
    </script> 

    </body> 
    </html>

来源

2015-12-03 10:16:46 Franco

+0

哦，它现在可以工作，但是我在表格中有多少数据，你真的必须永远滚动才能得到你想要的信息，不过谢谢你。 – Leifus

+0

但通过这种方式您的桌子是移动友好的。如果你有大桌子，你总会遇到这个问题。但这不是一个大问题。对于大型表格，您需要实施一些分页，以便用户每次只能获取一小部分数据。这很容易做到。如果你觉得这个有用，请不要忘记接受这个答案。 – Franco

0

注：给你的表中的行头！ （我想你知道该怎么做）

下载这个jQuery插件：

http://www.jqueryscript.net/table/Lightweight-jQuery-Responsive-Table-Plugin-ReStable.html

将这个在你的头标记的jQuery后（这是假设你上传这些文件中的CSS和JS文件夹。）

<link href="css/jquery.restable.min.css" rel="stylesheet" type="text/css">');<script src="js/jquery.restable.min.js"></script>'

把这个在你的页面的底部：

$(document).ready(function() {  
    $('#sorting_table').ReStable({ 
     rowHeaders: true, // if you want keep the row headers, else false. 
     maxWidth: 480 // Size to which the table become responsive 
    }); 
});

你完成了。调整浏览器大小，你将得到一个很好的响应表！

优点：对于现在如果你是工作非常有桌子就可以使每个表响应只用三行代码。

来源

2015-12-01 08:10:16 Franco

+0

然后这意味着我不再需要为我的网站引导，因为我尝试使用它使它首先响应。 @Franco – Leifus

+0

您仍然可以使用引导程序来设置您的网站。你可以用它做出所有其他html元素的行为响应，但你不必如果你不喜欢它。正如我已经告诉你的，请将标题添加到您的表格中！不要忘了bootstrap是您网站的强大组件。如果您发现我的答案对您有用，请不要忘记接受它。谢谢。如果您需要任何帮助，请告诉我。 – Franco

+0

我做了你可以做的事情，但是我不能看到以前诚实的事情有什么不同。随着responsivnes，你有任何其他想法？@Franco – Leifus

相关问题

 相关问题