Question

我想知道实现这一目标的最佳方法。我有一个表格，它嵌入在一个显示订单列表的表格中。我有一个包含三个项目的下拉列表。当用户选择其中一个选项并点击更新时，“待定”'已批准'和'已拒登'会更改该单个行的状态。我想要的是整个表格行根据已选择的项目改变颜色。

我知道这可以使用我必须工作的jQuery来实现，但我需要它以便根据选项值应用类。我可以使用PHP吗？并将一个类应用于选项值服务器端，以便当用户刷新页面时，单个表格单元格将保持突出显示？

echo '<tr>';
    echo '<td><input type="text" readonly=true name="order_no['.$i.']" value="' . $row['Orderno'] . '"/></td>';
    echo '<td><input type="text" readonly=true name="order_date['.$i.']" value="' . $row['Orderdate'] . '"/></td>';
    echo '<td><input type="text" readonly=true name="order_ordered_by['.$i.']" value="' . $row['Orderedby'] . '"/></td>';
    echo '<td><input type="text" readonly=true name="order_supplier['.$i.']" value="' . $row['Supplier'] . '"/></td>';
    echo '<td><input type="text" readonly=true name="order_total_price['.$i.']" value="' . $row['totalprice'] . '"/></td>';
    echo '<td><input type="text" readonly=true name="order_requested_by['.$i.']" value="' . $row['requestedby'] . '"/></td>';
    echo '<td>';
    echo '<select name="order_status['.$i.']" id="id" onchange="showUser(this.value)" >';
    echo '<option value = "Pending"   name="order_status['.$i.']" class = "pending"' . ($row['status'] == 'Pending' ? ' selected=selected' : '') . '>Pending</option>';
    echo '<option value = "Approved"  name="order_status['.$i.']" class = "approved"' . ($row['status'] == 'Approved' ? ' selected=selected' : '') . '>Approved</option>';
    echo '<option value = "Disapproved" name="order_status['.$i.']" class ="disapproved"' . ($row['status'] == 'Disapproved' ? ' selected=selected' : '') . '>Disapproved</option>';
    echo '</select>';
    echo '<td><input type="checkbox" name="order_selected['.$i.']"/></td>';
    echo '</td>';
    echo '</tr>';

Answer 1

您可以将状态用作班级名称。

<?php echo '<tr class="' . $status . '"><td>...</td></tr>'; ?>

$status是您提交的选择框的值。

编辑：

为了便于使用，我更新了您的代码：

<tr class="<?php echo $status; ?>">
    <td>
        <input type="text" readonly=true name="order_no[<?php echo $i; ?>]" value="<?php echo $row['Orderno']; ?>"/>
    </td>
    <td>
        <input type="text" readonly=true name="order_date[<?php echo $i; ?>]" value="<?php echo $row['Orderdate']; ?>"/>
    </td>
    <td>
        <input type="text" readonly=true name="order_ordered_by[<?php echo $i; ?>]" value="<?php echo $row['Orderedby']; ?>"/>
    </td>
    <td>
        <input type="text" readonly=true name="order_supplier[<?php echo $i; ?>]" value="<?php echo $row['Supplier']; ?>"/>
    </td>
    <td>
        <input type="text" readonly=true name="order_total_price[<?php echo $i; ?>]" value="<?php echo $row['totalprice']; ?>"/>
    </td>
    <td>
        <input type="text" readonly=true name="order_requested_by[<?php echo $i; ?>]" value="' . $row['requestedby'] . '"/>
    </td>
    <td>
        <select name="order_status[<?php echo $i; ?>]" id="id" onchange="showUser(this.value)" >
            <option value = "Pending"   name="order_status[<?php echo $i; ?>]" class = "pending"'<?php echo $row['status'] == 'Pending' ? ' selected=selected' : ''; ?>>Pending</option>
            <option value = "Approved"  name="order_status[<?php echo $i; ?>]" class = "approved"'<?php echo $row['status'] == 'Approved' ? ' selected=selected' : ''; ?>>Approved</option>
            <option value = "Disapproved" name="order_status[<?php echo $i; ?>]" class ="disapproved"'<?php echo $row['status'] == 'Disapproved' ? ' selected=selected' : ''; ?>>Disapproved</option>
        </select>
    </td>
    <td>
        <input type="checkbox" name="order_selected[<?php echo $i; ?>]"/>
    </td>
</tr>

您应该考虑为您的选择值和表行使用不同的类。

可能的CSS标记可能是：

table tr.Pending
{
    background-color: #FF0000;
} 
...

编辑2：我添加了一些代码，可能是您呈现页面的方式：

<?php for($i = 0; $i < count($_POST["order_no"]); $i++) :?>    
    <tr class="<?php echo $_POST["order_status"][$i]; ?>">
        <td>
            <input type="text" readonly=true name="order_no[<?php echo $i; ?>]" value="<?php echo $row['Orderno']; ?>"/>
        </td>
        <td>
            <input type="text" readonly=true name="order_date[<?php echo $i; ?>]" value="<?php echo $row['Orderdate']; ?>"/>
        </td>
        <td>
            <input type="text" readonly=true name="order_ordered_by[<?php echo $i; ?>]" value="<?php echo $row['Orderedby']; ?>"/>
        </td>
        <td>
            <input type="text" readonly=true name="order_supplier[<?php echo $i; ?>]" value="<?php echo $row['Supplier']; ?>"/>
        </td>
        <td>
            <input type="text" readonly=true name="order_total_price[<?php echo $i; ?>]" value="<?php echo $row['totalprice']; ?>"/>
        </td>
        <td>
            <input type="text" readonly=true name="order_requested_by[<?php echo $i; ?>]" value="' . $row['requestedby'] . '"/>
        </td>
        <td>
            <select name="order_status[<?php echo $i; ?>]" id="id" onchange="showUser(this.value)" >
                <option value = "Pending"   name="order_status[<?php echo $i; ?>]" class = "pending"'<?php echo $row['status'] == 'Pending' ? ' selected=selected' : ''; ?>>Pending</option>
                <option value = "Approved"  name="order_status[<?php echo $i; ?>]" class = "approved"'<?php echo $row['status'] == 'Approved' ? ' selected=selected' : ''; ?>>Approved</option>
                <option value = "Disapproved" name="order_status[<?php echo $i; ?>]" class ="disapproved"'<?php echo $row['status'] == 'Disapproved' ? ' selected=selected' : ''; ?>>Disapproved</option>
            </select>
        </td>
        <td>
            <input type="checkbox" name="order_selected[<?php echo $i; ?>]"/>
        </td>
    </tr>
<?php endforeach; ?>

但要小心显示从客户端收到的数据。你应该先检查它。

Answer 2

您可以使用PHP的会话来保持应用哪个类，并检查会话值，因此每次刷新页面时，您都会得到您的值。

Answer 3

我认为jquery是使用会话的最佳方式。您可以添加id（这应该是唯一的，您可以使用来自数据库的唯一ID）和class <tr>使用jquery更新<tr>类，如$("#tr_id").addClass("class_name");

选择下拉项时，将CSS添加到单个表行？

3 个答案: