таблицы и раскрывающиеся списки в HTML

#php #html #fuelphp

Вопрос:

Я создал следующую таблицу в HTML/PHP. Я должен сделать так, чтобы, когда пользователь выбирает цвет из выпадающего списка, он не мог быть выбран в последующих выпадающих списках. Если это произойдет, верните последнее измененное выпадающее меню к предыдущему выбранному значению. В настоящее время кажется, что я не могу вернуть его туда, где цвет возвращается обратно.

 <title>Color Coordinate</title>

<style>

table, th, td {

border: 1px solid black;

border-collapse: collapse;

}

</style>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<script>

$(document).ready(function () {

var values = [];

$(".color").on("change", function () {

$('.color').each(function () {

values.push(this.value);

});

var iRepeatedCount = 0;

for (var i = 0; i < values.length; i  ) {

if (this.value == values[i]) {

iRepeatedCount  = 1;

}

}

if (iRepeatedCount > 1) {

this.value = "";

}

})

});

</script>

</head>

<body>

<h1>Color Coordinate Generation</h1>

<?php

$rowcol = $_GET["rowcol"];

$numColor = $_GET["numColor"];

echo "<table style='width:80%'>";

for($i = 0; $i < $numColor; $i  ) {

echo "

<tr>

<td style = 'width: 20%'><label for='color'></label>";

?>

<select name="color" id="color">

<option value='red'>Red</option>

<option value='orange'>Orange</option>

<option value='yellow'>Yellow</option>

<option value='green'>Green</option>

<option value='blue'>Blue</option>

<option value='purple'>Purple</option>

<option value='grey'>Grey</option>

<option value='brown'>Brown</option>

<option value='black'>Black</option>

<option value='teal'>Teal</option>

</select>

<?php

echo "</td>

<td style = 'width: 80%'> </td>

</tr>";

}

echo "

</table>";

?>

<br>

<br>

<?php

$alphabet = ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z"];

echo "<table style='width:100%'>";

echo "<td> </td>";

for($i = 0; $i < $rowcol; $i  ) {

echo "

<td style = 'width: 2%'>";

echo $alphabet[$i];

}

echo "</td>";

for($i = 1; $i <= $rowcol; $i  ) {

echo "<tr>

<td style = 'width: 2%'>";

echo $i;

for($j = 0; $j <$rowcol; $j  ) {

echo "

<td style = 'width: 2%'>";

}

}

echo "</td></tr>";

?>

</body>

</html>```