1

データベースから学校名のリストを取得しています。ユーザーが学校名をクリックすると、ユーザーがクリックした学校名に関連する 2 ～ 3 個の他の属性を取得するコードが必要です。

単一の学校名リストの私のコード:

$query = mysql_query("Select schoolname, product, username, password from credentials c
join products p on p.productid = c.productid
join schools s on s.schoolid = c.schoolid
join icons i on i.productid = p.productid
order by s.schoolname");

echo '<ul>';
while($row = mysql_fetch_array($query))
{                   
echo "<li> <a href='#'>" . $row['schoolname'] . "</a> </li>";
}

エコー '';

現在の出力:

  • 学校A
  • 学校A
  • B校
  • B校
  • B校
  • スクールC
  • スクールC

期待される出力:

  1. 学校名は 1 回だけ表示されます (各学校名には 2 ～ 3 個の製品資格情報があるため、区別は機能しません)

    • 学校A
    • B校
    • スクールC

  2. ユーザーが学校をクリックする機能。次に、下の学校名が下に移動し (トグル効果)、ユーザーはクリックした学校の製品、ユーザー名、およびパスワードを表示できます (たとえば、ユーザーが学校 A をクリックした場合)。

    • 学校A
    • productname1、ユーザー名、パスワード

    • productname2、ユーザー名、パスワード

    • B校

    • スクールC
4

1 に答える 1

0

1) GROUP BY schoolname を使用する必要がありますが、これでは 1 つの一意の schoolname 行に対して 1 つの値しか得られないため、他のデータが失われる可能性があることに注意してください。また、すべてのデータを一度に取得し、製品の資格情報を失わないようにする場合は、複数の GROUP BY ステートメントが必要になる場合があります。

2) これを行う方法はほとんどありません。必要なすべてのデータを一度に取得し、学校名と非表示の製品名を含む html 出力を生成し、javascript を介してそれらを切り替えることができます。

<div class = "school-name">
    School name 1
    <div class = "product-name" style="display: none;">Product1</div>
    <div class = "product-name" style="display: none;">Product2</div>
    <div class = "product-name" style="display: none;">Product3</div>
</div>

そしてjavascript、私はそれのためにjqueryを使用しています

$(document).ready(function() {
    $('.school-name').on('click', function(e) {
        $(e.currentTarget).children('.product-name').show();
    }
});

このアプローチは、少量のデータがあればすぐにうまく機能します。それ以外の場合は、AJAX 呼び出しを使用して要素の子ノードを取得することをお勧めします。

于 2013-10-21T21:50:58.753 に答える