Open Source Web Development Tutorials - Dev Shed
プロジェクト管理アプリケーションのHTMLを解析
(2008/11/27公開)
プロジェクト管理アプリケーションのHTML
今回はmain.phpに含まれるHTMLの部分に注目し、次にユーザーがプロジェクト詳細を閲覧するページを取り上げます。これは、プロジェクト管理アプリケーションの作成を学習する全7パートのパート2です。
main.phpスクリプトに含まれるHTMLの部分は、複雑ではありません。以下3つのヘッディングのある1つのテーブルで構成されます。
・プロジェクトの名前:プロジェクトの名前を一覧表示
・ステータス:各プロジェクトのステータスを一覧表示
・生成日:各プロジェクトの生成日を一覧表示
以下で、該当する部分を赤でハイライトしました。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><!-- InstanceBegin template="/Templates/PM_Main.dwt.php" codeOutsideHTMLIsLocked="false" -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<!-- InstanceBeginEditable name="doctitle" -->
<title>Untitled Document</title>
<!-- InstanceEndEditable -->
<!-- InstanceBeginEditable name="head" --><!-- InstanceEndEditable -->
<link href="Templates/main.css" rel="stylesheet" type="text/css" />
</head>
<body>
<table width="100%" border="0">
<tr>
<td width="33%"> </td>
<td width="28%"> </td>
<td width="39%">Logged in: <!-- InstanceBeginEditable name="login" --><? echo $_SESSION['name'];?> | <a href="logout.php">Logout</a><!-- InstanceEndEditable --></td>
</tr>
<tr>
<td colspan="3" bgcolor="#6699CC" class="headertxt">Project Management Software </td>
</tr>
<tr>
<td colspan="3"><!-- InstanceBeginEditable name="main" -->
<table width="100%" border="0">
<tr>
<td width="37%"><strong>Project Name </strong></td>
<td width="34%"><strong>Status</strong></td>
<td width="29%"><strong>Date Created</strong> </td>
</tr>
テーブルの次の部分は、ページのPHP部分で行われた確認の結果に基づいて作成されるので、動的です。コードを見てみましょう。
<?php if($level =="admin"){?>
<?php
if($num_admin > 0){
while($rowadmin = mysql_fetch_assoc($results)){
?>
<tr>
<td><a href="view_project.php?pid=<?php echo $rowadmin['pid']?>"><?php echo $rowadmin['title'];?></a></td>
<td><?php echo $rowadmin['status'];?></td>
<td><?php echo $rowadmin['create_dt'];?>
</td>
</tr>
<?php
}
}else{ ?>
<tr>
<td colspan="3"><p>There does not seem to be any projects registered in your name. Click on the "Create New Project" link to create a project.</p></td>
</tr>
<?php
}?>
<?php }else{?>
コードの解説
前ページのコードは実際に何をするのでしょうか?$レベル変数の確認結果に基づいて、テーブルの2列を表示しなくてはなりません。
<?php if($level =="admin"){?>
$level変数の値がadminの場合は、ページのPHP部分で実行したクエリーから返された値に基づいて、上記のコード部分が作成されて表示されます。Whileループに$num_admin変数を使って、関連するプロジェクトの名前、ステータス、生成日を読み出します。次に、このループによって生成された結果テーブル列に、これらの詳細を表示します。
<tr>
<td><a href="view_project.php?pid=<?php echo $rowadmin['pid']?>"><?php echo $rowadmin['title'];?></a></td>
<td><?php echo $rowadmin['status'];?></td>
<td><?php echo $rowadmin['create_dt'];?>
</td>
</tr>
また、プロジェクトの名前と動的なハイパーリンクが作成されている点に留意してください。ユーザーがこのリンクをクリックすると、関連するプロジェクトの詳細が表示されます。$num_admin変数の値がゼロ、すなわち、ユーザーに関する記録がまったく見つからない場合は、別の動的テーブル列が作成されて、以下のメッセージが表示されます。
}else{ ?>
<tr>
<td colspan="3"><p>There does not seem to be any projects registered in your name. Click on the "Create New Project" link to create a project.</p></td>
</tr>
<?php
}?>
$level変数の値が「normal」の場合も、前記とまったく同じイベントシーケンスが発生します。ただし、「while」ループに使う基本変数とクエリー結果の読み出しに使用する変数が異なります。また、読み出された記録はログインしたユーザーのIDに特定されています。すなわち、ログインしたユーザーのユーザーIDと同じユーザーIDを持つプロジェクトだけが読み出され、表示されます。
メインページに関しては、この程度で十分でしょう。次は、特定プロジェクトの詳細を閲覧するページです。実際には、上述の動的テーブルが生成するハイパーリンクをクリックすると、このページが開いて、プロジェクトの全詳細を一覧表示します。表示の内容は、プロジェクトに参加している要員数、各要員の氏名、プロジェクトに使用されるファイルの名前です。表示スクリーンは、以下の画像のとおりです。
Copyright © 2008 Ziff Davis Enterprise, Inc.
Originally appearing in the U.S. Edition of Dev Shed. All Rights Reserved.








