08.09.2019, 19:27
|
|
Интересующийся
|
|
Регистрация: 24.07.2019
Сообщений: 21
|
|
|
Сохранение данных в куки
Есть некая форма,в которой пользователь заполняет 3 поля.Надо сохранять,допустим , 10 результатов ввода.Как лучше это сделать?
Я думаю с cookie работать,но не пойму как мне туда массив добавлять наиболее удобным способом
|
|
08.09.2019, 19:50
|
|
Профессор
|
|
Регистрация: 14.01.2015
Сообщений: 12,990
|
|
|
Кто заведовать ими должен, сервер или клиент? В любом случае запись будет строки, это будет json, просто у сервера и клиента различны функции для этого: РНР - json_encode(array), JS - JSON.stringify(array).
|
|
08.09.2019, 20:19
|
|
Интересующийся
|
|
Регистрация: 24.07.2019
Сообщений: 21
|
|
Клиент.Тип вот код:
<!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 разных вводов)
|
|
08.09.2019, 20:33
|
 |
Профессор
|
|
Регистрация: 20.12.2009
Сообщений: 1,714
|
|
|
Сообщение от stavatar@yandex.ru
|
|
И надо значения X,R,Y записать в куки по 10 раз(10 разных вводов)
|
Т. е. вы хотите чтобы была история предыдущего ввода?
|
Сообщение от stavatar@yandex.ru
|
|
Там же по условию координата X Должна быть именно Button и никакая другая
|
Там скорей всего имеется в виду радио кнопка, значение которой как раз таки и передаётся на сервер!
|
Сообщение от stavatar@yandex.ru
|
|
Сам сайт это задание по вузу и там по условию надо,что бы открывалась новая страница с результатом
|
Это не значит, что должно быть 2 файла, это скорей означает, что в одном файле описаны два вида.
Последний раз редактировалось Malleys, 08.09.2019 в 20:47.
|
|
08.09.2019, 21:01
|
|
Интересующийся
|
|
Регистрация: 24.07.2019
Сообщений: 21
|
|
Сообщение от Malleys
|
Т. е. вы хотите чтобы была история предыдущего ввода?
Там скорей всего имеется в виду радио кнопка, значение которой как раз таки и передаётся на сервер!
Это не значит, что должно быть 2 файла, это скорей означает, что в одном файле описаны два вида.
|
Вообще это две разных темы...
1)Да.10 предыдущих вводов(ну или 20,30 и т.д)
2)А вот и нет.Препод специально уточнил,что именно Button
3)Ну,вот задание.
Разработать PHP-скрипт, определяющий попадание точки на координатной плоскости в заданную область, и создать HTML-страницу, которая формирует данные для отправки их на обработку этому скрипту.
Параметр R и координаты точки должны передаваться скрипту посредством HTTP-запроса. Скрипт должен выполнять валидацию данных и возвращать HTML-страницу с таблицей, содержащей полученные параметры и результат вычислений - факт попадания или непопадания точки в область.
Я это так понял,что 2 файла. |
|
08.09.2019, 22:39
|
|
Профессор
|
|
Регистрация: 20.12.2009
Сообщений: 1,714
|
|
stavatar@yandex.ru, так в чём проблема у вас, чтобы это сделать? У вас получается один PHP-скрипт, который должен вывести сначала (т. е. когда кол-во GET-параметров равно нулю) форму, затем когда вы нажимаете отправить форму, у вас тот же PHP-скрипт проверяет, считает и выводит результат, записывает для истории в локальное хранилище результат.
А то, что вам человек сказал, что там должны быть кнопки, так это с точки зрения человека они выглядят как кнопки, а с точки зрения программиста это
<input type="radio" name="InputX" value="-2">
<input type="radio" name="InputX" value="-1.5">
<input type="radio" name="InputX" value="-1">
<input type="radio" name="InputX" value="-0.5">
<input type="radio" name="InputX" value="0">
<input type="radio" name="InputX" value="0.5">
<input type="radio" name="InputX" value="1">
<input type="radio" name="InputX" value="1.5">
<input type="radio" name="InputX" value="2">
Это так технически выглядит, а при помощи CSS вы можете их как угодно оформить.
Последний раз редактировалось Malleys, 08.09.2019 в 22:43.
|
|
08.09.2019, 23:02
|
|
Интересующийся
|
|
Регистрация: 24.07.2019
Сообщений: 21
|
|
|
Сообщение от Malleys
|
stavatar@yandex.ru, так в чём проблема у вас, чтобы это сделать? У вас получается один PHP-скрипт, который должен вывести сначала (т. е. когда кол-во GET-параметров равно нулю) форму, затем когда вы нажимаете отправить форму, у вас тот же PHP-скрипт проверяет, считает и выводит результат, записывает для истории в локальное хранилище результат.
А то, что вам человек сказал, что там должны быть кнопки, так это с точки зрения человека они выглядят как кнопки, а с точки зрения программиста это
<input type="radio" name="InputX" value="-2">
<input type="radio" name="InputX" value="-1.5">
<input type="radio" name="InputX" value="-1">
<input type="radio" name="InputX" value="-0.5">
<input type="radio" name="InputX" value="0">
<input type="radio" name="InputX" value="0.5">
<input type="radio" name="InputX" value="1">
<input type="radio" name="InputX" value="1.5">
<input type="radio" name="InputX" value="2">
Это так технически выглядит, а при помощи CSS вы можете их как угодно оформить.
|
1)Препод написал именно что просто тег button,а не radioButton и прочее такое.
2)"Скрипт должен выполнять валидацию данных и возвращать HTML-страницу с таблицей"
Я так понял,что должна открываться новая страница с таблицей
|
|
08.09.2019, 23:22
|
|
Профессор
|
|
Регистрация: 20.12.2009
Сообщений: 1,714
|
|
stavatar@yandex.ru,
|
Сообщение от stavatar@yandex.ru
|
|
Препод написал именно что просто тег button,а не radioButton и прочее такое.
|
Оно так не работает, значит преподаватель не разбирается в формах. Или он имел в виду радио кнопки, а сказал, как обычный человек, что это кнопки... Читайте документацию, там всё написано. https://developer.mozilla.org/ru/doc...nt/Input/radio
|
Сообщение от stavatar@yandex.ru
|
|
Я так понял,что должна открываться новая страница с таблицей
|
При помощи одного PHP-скрипта можно создать миллионы страниц.
Вот PHP-код, написанный по вашему описанию в посте №5... https://repl.it/@Malleys/SquigglyWelllitBsddaemon
Вот как он работает... https://squigglywelllitbsddaemon.malleys.repl.co/
|
|
08.09.2019, 23:37
|
|
Интересующийся
|
|
Регистрация: 24.07.2019
Сообщений: 21
|
|
Ну,вот препода текст:
1. В задании есть блок с картинкой и там рядом с ней написано какие интерактивные элементы должны использоваться в форме для ввода X,Y,R. Если там написано Button, то для каждого значения должна быть отдельная кнопка (тег <button> или около того. Checkbox'ы, RadioButton и прочее не использовать). Если там написан Text, то это обычный <input>
Большое спасибо,сейчас прочту.
Правда там надо не все делать на php...Там есть и еще и другие требования(я их на всякий случай в виде вложений кинул)
.Но думаю,на основе этого кода все сделаю.Большое спасибо!
Последний раз редактировалось stavatar@yandex.ru, 08.09.2019 в 23:45.
|
|
08.09.2019, 23:55
|
|
Профессор
|
|
Регистрация: 20.12.2009
Сообщений: 1,714
|
|
|
Сообщение от stavatar@yandex.ru
|
|
Если там написано Button, то для каждого значения должна быть отдельная кнопка (тег <button> или около того. Checkbox'ы, RadioButton и прочее не использовать)
|
Вы можете использовать кнопку <button> если вы хотите, чтобы значение не отправлялось на сервер. Как написано в спецификации HTML 5.2, кнопка (и её значение) включается в отправку формы только в том случае, если эта кнопка была использована для запуска процесса отправки формы. То, что вы хотите сделать, предполагает выбор из нескольких вариантов, а соответственно вам нужно использовать именно RadioButton, если вы хотите, чтобы из нескольких вариантов можно было выбрать только один, или же Checkbox, если вы хотите выбрать несколько вариантов. Button же, - либо запускает какое-либо действие на JavaScript (которого у вас нет, а соответственно, это бессмысленное использование, поскольку сама по себе кнопка ничего не делает) и не предполагает отправку значения на сервер, (<button type="button">)
- либо отправляет форму на сервер (и в таком случае значение такой кнопки тоже отправляется), (<button type="submit">)
- либо сбрасывает форму к её первоначальному состоянию. (<button type="reset">)
Последний раз редактировалось Malleys, 09.09.2019 в 00:01.
|
|
|
|
