1

現在、mysql にクエリを実行すると、すべてのデータが HTML テーブルに表示されます。例:

会員番号 | 名前 | 姓 | 住所 | 年齢 | 国籍 | ID | カード | 職業..

問題は、すべてのコンテンツが圧迫され、HTML テーブルにうまく表示されないことです。

会員番号、名前、姓だけを表示したいと思います。会員番号をクリックすると、すべてのデータがきちんと表示されます。

JavaScript を使用する必要があるかどうかはわかりませんが、少なくともすべてのデータをきれいに表示する方法についての手がかりを教えていただければ幸いです。

ありがとう

4

4 に答える 4

1

1 つのオプションは、jQuery とdatatablesを使用することです。

通常の HTML と一緒に使用すると、テーブルはすぐに並べ替え、ページ付け、スタイル設定などのテーブルに変換されます。もちろん、適用する設定を選択できます。

入力に応じて CSS と共にデータをレンダリングする独自の PHP テーブル クラスまたはスクリプトを作成することもできます。次に、PHP 配列を使用してこれらのパラメーターを指定できます。たとえば、次のようになります。

PHP:

SQL クエリ スクリプトが最終的に次のようなテーブル データを返すとします。

$tbl_data = array(
   0 => array("nr" => "10", "name" => "John", "surname" => "Smith", "address" => " Plaza Hotel Room 12", "age" => "44", "nat" => "Syldavian", "id" => "12345", "card" => "MasterCard", "prof" => "Pet Washer"),
   1 => array("nr" => "11", "name" => "Captain", "surname" => "Haddock", "address" => "Marlinspike Hall", "age" => "55", "nat" => "British", "id" => "133455", "card" => "Discovery", "prof" => "Captain")

);

次に、次のように入力パラメーターを指定できます。

$arr_cols = array("nr" => "Membership Number", "name" => "Name", "surname" => "Surname", "address" => "Address", "age" => "Age", "nat" => "Nationality", "id" => "ID", "card" => "Card", "prof" => "Profession");

$arr_align = array("nr" => "center", "name" => "left", "surname" => "left", "address" => "left", "age" => "center", "nat" => "center", "id" => "center", "card" => "left", "prof" => "left");

$lst_show = array("nr", "name", "surname");

このテーブル ビュー メソッドは、特定の入力に関係なく、常に使用できます。

$html = "<table class='grid'>\n";
// headings
foreach ($arr_cols as $key => $title) {
    if (in_array($key, $lst_show))
        $html .= "<tr><th>$title</th></tr>\n";
} 
//rows
foreach ($tbl_data as $arr_row) {
   foreach ($arr_row as $key => $data) {
     if (in_array($key, $lst_show)) {
        $align = !empty($arr_align[$key]) ? " align='" . $arr_align[$key] . "'" : '';
        $html .= "<tr><td$align>$data</td></tr>\n";
    }
  }
}
$html .= "</table>\n";

echo $html;

CSS:

table.grid {border:1px solid blue; etc.}
table.grid th {etc.}
table.grid td {etc.}
于 2012-05-06T07:56:18.797 に答える
1

私の理解が正しければ、各会員の会員番号、名前、姓を表示する HTML テーブルが必要です。会員番号をクリックすると、残りの詳細が表示されます。Javascript を使ってその部分を行うというシュールな夢は正しいと思います。

次のようになります (疑似コードを許してください - foreach 構文を思い出せません):

echo "<table id='data'>";
foreach ($row in $sqltable)
{
  echo "<tr>";
  echo "<td><a onclick='displaymoreinfo'>".$row['id']."</a></td>";
  echo "<td>".$row['name']."</td>";
  echo "<td>".$row['surname']."</td>";
  echo "</tr>";    
} 
echo "</table>";

次に、この人がここに持っているようなことをしたファイルの上部にjavascriptメソッドが必要です: http://viralpatel.net/blogs/2009/03/dynamically-add-remove-rows-in-html -table-using-javascript.html

-ローラ

于 2012-05-06T07:50:58.440 に答える
1

私はそのようなタスクのための定義リストの大ファンですが、同じ効果のためにそれを表と組み合わせることができます。ここにデモがあります：

http://jsfiddle.net/crazytonyi/rZfKg/

于 2012-05-06T08:01:45.940 に答える
0

簡単に言えば、データを出力し、ユーザーの操作に基づいて表示される情報を変更したい場合は、JavaScript が必要になるということです。具体的には、この種のことには jQuery をお勧めします。HTML と CSS を使用してデータを適切に表示する方法を工夫し、JavaScript/jQuery で見栄えを良くする必要があります。

ただし、「きれいに」提示することはかなり主観的です。何を表示したいか、どのようにレイアウトするかを決定する必要があり、それはすべて CSS と HTML になります。私はすぐにあなたに言います。

于 2012-05-06T07:32:28.787 に答える