2

これを達成するための解決策を見つけるのに苦労しています。データベースからのデータが入力された HTML フォームがあります。テーブルは 6 つの列で構成され、1 つの列は「ステータス」という名前で、その下の各セルにドロップダウン メニューがあります。ユーザーがドロップダウンから値を選択すると、メニューは「保留中」、「承認済み」、「不承認」の 3 つの値で構成され、その行のすべてのセルの色が変わります (緑 - 承認済み、黄色 - 保留中、赤 - 不承認)。

これまでの私のコードは次のとおりです。

<?php
$result = mysql_query("SELECT * FROM Orders")
or die (mysql_error());
?>
<table class="table1" style="background-color:#ffffff;" >
<h4>Purchase Orders</h4>
<tr>
<th>Order Number</th>
<th>Order Date</th>
<th>Ordered By</th>
<th>Supplier</th>
<th>Total Price</th>
<th>Status</th>
</tr>
<?php
while($row=mysql_fetch_array($result)){
echo "</td><td>";
echo $row['Orderno'];
echo "</td><td>";
echo $row['Orderdate'];
echo "</td><td>";
echo $row['Orderedby'];
echo "</td><td>";
echo $row['Supplier'];
echo "</td><td>£";
echo $row['totalprice'];
echo "</td><td>";
echo '  <select id="'.$row['Orderno'].'" onchange="myJSFunction(this)">
<option></option>
<option>Approved</option>
<option>Pending</option>
<option>Disapproved</option>                  
</select>';
echo "</td></tr>";
}
echo "</table>";
?>

誰かが私を正しい方向に向けることができれば幸いです。色の変化ごとに 3 つの関数を作成し、それらを各オプション値に適用する方法。Orderno に適用すると、その行のすべてのセルが影響を受けますか?

4

2 に答える 2

1

質問にjQueryのタグを付けていないことは承知していますが、オプションの場合は、これを使用できます。

$(document).ready(function() {
    var color = ['none', 'green', 'yellow', 'red'];
    $('table.table1').on('change','select', function() {
        $(this).parents('tr').css('background', color[$(':selected', this).index()]);
    });​
});

jsFiddle の例

于 2012-08-29T20:25:09.897 に答える
0

これを試してください(jsFiddle):

function myJSFunction(element)
{
    var row = element.parentNode.parentNode;

    switch(element.options[element.selectedIndex].innerHTML)
    {
        case "Pending":
            row.style.background = "#FF7E00";
            break;
        case "Approved":
            row.style.background = "green";
            break;
        case "Disapproved":
            row.style.background = "red";
            break;
        default:
            row.style.background = "white";
    }
}
于 2012-08-29T19:36:07.537 に答える