1

ボタンの「詳細」をクリックすると、table2を開くスクリプトがあります。

 <script>
  $(document).ready(function() {

       $('#Table1 tr').click(function(event){

         $('#Table2').show();
         alert($(this).attr('id'));
       });
     });

</script>

そしてこれが私のコード

 <table id= "Table1" width='100%' border='1' cellspacing='0' cellpadding='0'>
    $sql2=..
    $sql3 = blabla ;
    while($row3 =mysql_fetch_array($sql3)){
    $sql4 = mysql_query (" SELECT $ww as place FROM data WHERE $ww =".$row3[$ww]." and  id_user = ".$userid." ");
    $row4 = mysql_fetch_array($sql4) ;
    $string = "<blink > here  </blink>" ;

    $wnumber = $row3[$ww] ;

     echo "<tr id= '".$wnumber."'><td  style= 'text-align : center ;'>Week ".$row3[$ww]."
              </td>" ;
     echo "<td >".(int) $row3["percent"] ."% </td>";
     echo "<td > "?><?php if($row4['place'] == 
     $row3[$ww] and $row2['id'] == $userid ){ echo $string ; } else { echo "";} ;?><?php
     "</td>";
     echo "<td ><button class='showr'>More Details</button> </td></tr>";
    //More Details when clicking on this buttom it open the table2
     }
   </tr>
 </table>

これは2番目のテーブルです

 <?php
    echo "<div id= 'Table2' style= 'display:none;'>";
    echo "<table width='100%' border='1' cellspacing='0' cellpadding='0'>";
    echo "<th> Week ".$wnumber."</th>";
    echo "<th>try2</th>";
    echo "<tr ><td>day</td>";
    echo "<td>fff</td></tr>";
    echo "</table></div>";
 ?>

*私は今、5つの尻を持つ5つの列を持っています. *今起こっていることは、すべての下部をクリックすると、同じ '$wnumber' がエコーされ、6 と言うことができます。- 行の最後の ID で動作する最後のボタンのみ。*私が欲しいのは、すべてのボトムが正しい「$wnumber」をエコーする行IDで動作することです*私が試したのは（divで変数を作成する）です

   echo "<div id= '".$wnumber."' style= 'display:none;'>";

それ以外の

    echo "<div id= 'Table2' style= 'display:none;'>";

しかし、うまくいきませんでした。

それが明確で、解決策があることを願っています。

編集：このソースコード

   <script src="http://code.jquery.com/jquery-latest.js"></script>


    <script>
    $(document).ready(function() {

   $('#Table1 tr').click(function(event){

     $('#Table2').show();
     alert($(this).attr('id'));
   });
 });

  </script>

  <br />
  <table id= "Table1" width='100%' border='1' cellspacing='0' cellpadding='0'>
  <th >Weeks</th>
 <th ><p></p></th>

 <th > Your place</th>
 <th > More Details</th>
<tr>
 <tr id= '1'><td  style= 'text-align : center ;'>Week 1</td><td style= 'text-align : 
  center ;'>33% </td><td  style= 'text-align : center ;'> <td style= 'text-align :  
  center ;'><button class='showr'>More Details</button></td></tr><tr id= '6'><td   
  style= 'text-align : center ;'>Week 6</td><td style= 'text-align : center ;'>33%   
  </td><td  style= 'text-align : center ;'> <td style= 'text-align : center   
  ;'><button  
  class='showr'>More Details</button></td></tr><tr id= '13'><td  style= 'text-align:   
  center ;'>Week 13</td><td style= 'text-align : center ;'>33% </td><td  style=   
  'text-align : center ;'> <blink style= 'color:#990000 ;font-weight: bolder;' >  69   
  here </blink><td style= 'text-align : center ;'><button class='showr'>More   
  Details</button></td></tr></tr>

 </table>
 <br />
 <div id= 'Table2' style= 'display:none;'><table width='100%' border='1'  
  cellspacing='0' cellpadding='0'><th> Week 13</th><th>try2</th><tr ><td>day</td>  
  <td>fff</td></tr></table></div>
  <br /><br /> <br />
4

3 に答える 3

1

td不足している,を修正した後、あなたの html コードを試しましたtr。そして、各行/ボタンをクリックすると、div. PHPで適切なhtmlコードを形成していることを確認してくださいecho

于 2012-04-21T18:29:59.910 に答える
1

次のようなことを試してください：

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
    $(document).ready(function() {
        $('#Table1 tr').click(function(event){
            $('#details').find('#week' + $(this).attr('id')).show();
            // alert($(this).attr('id'));
        });
    });

</script>
<?php

$result = mysql_query($sql);

// save the results to an array so you can loop them twice
while($row = mysql_fetch_array($result)) :
    $rows[] = $row;
endwhile;

?>
<table id="table1">
    <tr>
        <th>heading</th>
        <th>heading</th>
        <th>heading</th>
        <th>heading</th>
    </tr>
    <?php foreach ($rows as $row) : // loop #1 to output the main table ?>
    <tr id="<?php echo $row['ww'] ?>">
        <td>value</td>
        <td>value</td>
        <td>value</td>
        <td><button type="button">More details</button></td>
    </tr>
    <?php endforeach; ?>
</table> <!-- end table 1 -->

<div id="details">
    <?php foreach ($rows as $row) : // loop #2 to output a table for each set of details ?>
    <table id="week<?php echo $row['ww'] ?>" style="display: none">
        <tr>
            <th>Week <?php echo $row['ww'] ?></th>
            <th>try2</th>
        </tr>
        <tr>
            <td>value</td>
            <td>value</td>
        </tr>
    </table>
    <?php endforeach; ?>
</div> <!-- end details -->
于 2012-04-21T18:53:58.593 に答える
0

コードをコピーして jsFiddle に貼り付けたところ、期待どおりに動作するようです。行をクリックすると、正しい ID でアラートが送信されます。

http://jsfiddle.net/JeeNN/

ここであなたの意図に欠けているものはありますか？

注 : インライン CSS をスキップして、テーブルに外部スタイルを追加することをお勧めします。また、有効な HTML が必須です。

アップデート：

先に進み、投稿したphpコードをフォーマットして、少し読みやすくしました。定義されていない変数がいくつかあり、他にもいくつかの問題がありますが、php ファイルで正しいと確信しています。

2 番目のテーブルを作成するために、もう一度ループを実行する必要があると思います。この 2 番目のループでは、2 番目のテーブルをループごとに 1 回エコー アウトします。最終的には一連のテーブル (行ごとに 1 つと最初のテーブル) になります。次に、ユーザーが各 ID をクリックすると、テーブルの可視性を入れ替えるだけです。

それはあなたが探しているものですか？そうでない場合は、質問を言い換えてみてください。

フォーマットされたコードは次のとおりです。

<table id="Table1" width='100%' border='1' cellspacing='0' cellpadding='0'>
<?php
$sql2 = [..];
$sql3 = [..];
$ww = ?;

while($row3 = mysql_fetch_array($sql3)){

    $sql4 = mysql_query ("SELECT $ww as place FROM data WHERE $ww =".$row3[$ww]." and  id_user = ".$userid." ");
    $row4 = mysql_fetch_array($sql4) ;
    $string = "<blink> here </blink>" ;

    $wnumber = $row3[$ww];

    echo "<tr id='".$wnumber."'>";
        echo "<td style='text-align:center;'>Week ".$row3[$ww]."</td>";
        echo "<td>".(int) $row3["percent"] ."% </td>";
        echo "<td>":
        if($row4['place'] == $row3[$ww] and $row2['id'] == $userid ){
            echo $string;
        } else {
            echo "&nbsp;";
        }
        echo "</td>";
        //More Details when clicking on this buttom it open the table2
        echo "<td ><button class='showr'>More Details</button></td>";
    echo "</tr>";
} ?>
</table>

<div id= 'Table2' style= 'display:none;'>
    <table width='100%' border='1' cellspacing='0' cellpadding='0'>
        <tr>
            <th> Week <?php echo $wnumber; ?></th>
            <th>try2</th>
        </tr>
        <tr>
            <td>day</td>
            <td>fff</td>
        </tr>
    </table>
</div>
于 2012-04-21T18:26:38.337 に答える