Клиент.Тип вот код:
<!DOCTYPE html>
<html>
<head>
<title>Сайт</title>
<style>
body
{
background: #f6e8d7;
}
#helpMe
{
background: #f0f0f0;
width: 400px;
padding: 10px;
border: 2px solid #000;
}
input[type="submit"]
{
border: 4px inset #100;
cursor: url(WorldOfWarCraft/arrow.cur),pointer;
}
p b
{
color:orange;
border: 1px inset #100;
box-shadow: 0 0 10px rgba(0,0,0,0.5);
background: #808080;
outline-style: outset;
}
img.rightfoto
{
margin: 0px;
float: right ;
}
.active {
border: 1px solid red;
color: red;
}
</style>
</head>
<body>
<img class="img.rightfoto" src="image.png" " >
<form method="GET" action="handler.php" class="formWithValidation" style="float: left;">
<fieldset class="fieldset" style="width: 400px;">
<h3 style="font-family: fantasy;font-stretch: inherit;font-weight: 0;" >ЗАГОЛОВОК </h5>
<h5> 210001 <h3>
<p><b name="textX"> X</b> </p>
<div id="helpMe">
<input type="button" class='checkboxxx' name="InputX" onclick="change(-2)" value="-2">
<input type="button" class='checkboxxx' name="InputX" onclick="change(-1.5)" value="-1.5">
<input type="button" class='checkboxxx' name="InputX" onclick="change(-1)" value="-1">
<input type="button" class='checkboxxx' name="InputX" onclick="change(-0.5)" value="-0.5">
<input type="button" class='checkboxxx' name="InputX" onclick="change(0)" value="0">
<input type="button" class='checkboxxx' name="InputX" onclick="change(0.5)" value="0.5">
<input type="button" class='checkboxxx' name="InputX" onclick="change(1)" value="1">
<input type="button" class='checkboxxx' name="InputX" onclick="change(1.5)" value="1.5">
<input type="button" class='checkboxxx' name="InputX" onclick="change(2)" value="2">
</div>
<Br>
<input type="hidden" id="InputX" name="InputX" value="" />
<p><b> Y</b></p>
<p><input type="text" class="Y" maxlength="5" size="6" name="InputY" placeholder=" От -3 до 3"></p>
<p><b> R</b></p>
<p>
<p><input type="text" class="RRR" maxlength="5" size="6" name="InputR" placeholder=" От 1 до 4"></p>
</p>
<p><input type="submit" class="validateBtn" ></p>
</fieldset>
</form>
<script>
var SMSx;
var SMSy;
var SMSr;
var conditionX=0;
var form=document.querySelector('.formWithValidation');
var button=document.querySelectorAll('.checkboxxx');
function change(value)
{
document.getElementById("InputX").value= value;
}
for (var buttoned of button)
{
buttoned.addEventListener('click', function (event)
{
var X=event.clientX;
var Y=event.clientY;
button.forEach(i =>
i.classList.remove('active'));
this.classList.toggle('active');
});
};
function showError(container, errorMessage) {
var msgElem = document.createElement('span');
msgElem.className = "error-message";
msgElem.innerHTML = errorMessage;
container.appendChild(msgElem);
}
function resetError(container) {
if (container.lastChild.className == "error-message") {
container.removeChild(container.lastChild);
}
}
form.addEventListener('submit', function (event)
{
resetError(document.querySelector('.fieldset') );
var elems = form.elements;
if (elems.InputY.value)
{
var reg=/^\d+[,]\d*$|^\d+$/ ;
if(reg.test(elems.InputY.value))
{
SMSy=""
}
else
{
SMSy="Ошибка заполнения Y";
event.preventDefault() ;
}
}
else
{
SMSy=" Заполните Y <Br>";
event.preventDefault() ;
}
if ((elems['InputX'][0].classList.contains('active'))||(elems['InputX'][1].classList.contains('active'))||
(elems['InputX'][2].classList.contains('active'))||(elems['InputX'][3].classList.contains('active'))||
(elems['InputX'][4].classList.contains('active'))||(elems['InputX'][5].classList.contains('active'))||
(elems['InputX'][6].classList.contains('active'))||(elems['InputX'][7].classList.contains('active'))
||(elems['InputX'][8].classList.contains('active')))
{
SMSx=""
}
else
{
SMSx="<p style=\"font-size: 120%; font-family: monospace; color: #cd66cc\">Заполните X </p> ";
event.preventDefault() ;
}
if (elems.InputR.value)
{
var reg=/^\d+[,]\d*$|^\d+$/ ;
if(reg.test(elems.InputR.value))
{
SMSr=""
}
else {
SMSr="Ошибка заполнения R";
event.preventDefault() ;
}
}
else
{
SMSr=" Заполните R <Br>";
event.preventDefault() ;
}
showError(document.querySelector('.fieldset') , SMSx+SMSy+SMSr);
});
</script>
</body>
</html>
И надо значения X,R,Y записать в куки по 10 раз(10 разных вводов)