Регистрация
Город Таланта
HEEG.HTML
Город Таланта
Может на вашем сайте можно создать такую регистрацию с более простыми способами?
Надо, чтобы данные этой формы заносились в таблицу регистрации https://docs.google.com/spreadsheets/d/14B0gM46V-GWElrd-WK7SZOdvHqL8MG8K_w1B5H1oIwE/edit?gid=0#gid=0
Столбцы таблицы: " * " - Обязательно для заполнения. если без звездочки, то необязательно. словом "обязательно" не обозначаем, только в случае не заполнения.
A) id * - порядковый номер начиная от 001 (сотки, десятки, единицы) Заносится в таблицу автоматически. в анкету не показывается.
B) tags* - пропуск
C) ФОТО - вставляется фотография. Если не заполняется пользователем, то ставится стандартная фотография https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIUrAV14os2CIWAuPmgK5iHW2wYzpVasSutDhUfDa4yCvsrJvyBuMDY09VzFI0tXBg8DRRd_ry__4Y_7A_DUZYG9hva5dCgu06GR-OK1dNgpBwCruzjwPcmtnaMbzkx6pBY9a0ECRiy8403c1b3kHu4ODpM_CBl9fXQIm6KH_5TZcK-v-hklMMTIOcHQmq/s16000/2%20%D0%BC%D0%B0%D0%BB%D0%B5%D0%BD%D1%8C%D0%BA%D1%8F-min.png фотография на гугл диске не сохраняется, а минуя гугл диск отправляется на страницу https://www.blogger.com/blog/page/edit/3861904685073664485/5780904911884061469?hl=ru а ссылка фото отправляется в таблицу в колонку "C".
Заполнение столбцов:
D) ФИО*
E) ID слово*
F) Пол*
G) Дата рождения*
H) Возраст* - (вставляется в анкету высчитывается из даты рождения. Обновляется в каждый день рождения.) В анкете не указывается.
I) Город проживания*
J) Телефон
K) Телеграм
L) Вотсап
M) Соцсеть (вк, ок, фейсбук)
N) E-mail*
D) Гражданство*
P) Национальность*
Q) О себе
R) Интересы
S) От кого пришел* - вносится id слово
Спасибо за регистрацию. Ваша анкета проверится ближайшее время.
_________________________________________________________
На сайте гугл есть такой код.
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Регистрация</title>
<style>
body { font-family: Arial, sans-serif; background: #f4f4f4; margin: 0; padding: 20px; color: #333; }
.container { max-width: 600px; margin: 0 auto; background: white; padding: 30px; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); }
h1 { text-align: center; color: #007bff; margin-bottom: 20px; }
.form-group { margin-bottom: 15px; }
label { display: block; font-weight: bold; margin-bottom: 5px; }
.required::after { content: "*"; color: red; }
input, select, textarea { width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 4px; }
input[type="file"] { padding: 5px; }
button { width: 100%; padding: 12px; background: #007bff; color: white; border: none; border-radius: 4px; cursor: pointer; font-size: 16px; }
button:hover { background: #0056b3; }
.status { margin-top: 20px; text-align: center; display: none; }
.error { color: red; }
.success { color: green; }
</style>
</head>
<body>
<div class="container">
<h1>Регистрация на сайте</h1>
<form id="registrationForm" enctype="multipart/form-data">
<div class="form-group">
<label for="fio" class="required">ФИО</label>
<input type="text" id="fio" name="fio" required>
</div>
<div class="form-group">
<label for="id_slovo" class="required">ID слово</label>
<input type="text" id="id_slovo" name="id_slovo" required>
</div>
<div class="form-group">
<label for="pol" class="required">Пол</label>
<select id="pol" name="pol" required>
<option value="">Выберите</option>
<option value="Мужской">Мужской</option>
<option value="Женский">Женский</option>
</select>
</div>
<div class="form-group">
<label for="data_rogdenia" class="required">Дата рождения</label>
<input type="date" id="data_rogdenia" name="data_rogdenia" required>
</div>
<div class="form-group">
<label for="gorod" class="required">Город проживания</label>
<input type="text" id="gorod" name="gorod" required>
</div>
<div class="form-group">
<label for="telefon">Телефон</label>
<input type="tel" id="telefon" name="telefon">
</div>
<div class="form-group">
<label for="telegram">Телеграм</label>
<input type="text" id="telegram" name="telegram">
</div>
<div class="form-group">
<label for="whats">Вотсап</label>
<input type="text" id="whats" name="whats">
</div>
<div class="form-group">
<label for="socset">Соцсеть (ВК, ОК, Фейсбук)</label>
<input type="url" id="socset" name="socset">
</div>
<div class="form-group">
<label for="email" class="required">E-mail</label>
<input type="email" id="email" name="email" required>
</div>
<div class="form-group">
<label for="grazhdanstvo" class="required">Гражданство</label>
<input type="text" id="grazhdanstvo" name="grazhdanstvo" required>
</div>
<div class="form-group">
<label for="nacionalnost">Национальность</label>
<input type="text" id="nacionalnost" name="nacionalnost">
</div>
<div class="form-group">
<label for="o_sebe">О себе</label>
<textarea id="o_sebe" name="o_sebe" rows="3"></textarea>
</div>
<div class="form-group">
<label for="interesy">Интересы</label>
<textarea id="interesy" name="interesy" rows="3"></textarea>
</div>
<div class="form-group">
<label for="otkogo" class="required">От кого пришел (ID слово)</label>
<input type="text" id="otkogo" name="otkogo" required>
</div>
<div class="form-group">
<label for="photo">Фотография (опционально)</label>
<input type="file" id="photo" name="photo" accept="image/*">
</div>
<button type="submit">Зарегистрироваться</button>
</form>
<div id="status" class="status"></div>
</div>
<script>
const form = document.getElementById('registrationForm');
const statusDiv = document.getElementById('status');
form.addEventListener('submit', async (e) => {
e.preventDefault();
statusDiv.style.display = 'block';
statusDiv.className = 'status';
statusDiv.textContent = 'Отправка...';
const formData = new FormData(form);
const data = {};
// Конверсия photo в base64
if (formData.get('photo')) {
const file = formData.get('photo');
const base64 = await toBase64(file);
data.photo = base64;
}
// Сбор остальных полей
formData.forEach((value, key) => {
if (key !== 'photo') data[key] = value;
});
// Отправка POST
try {
const response = await fetch('https://script.google.com/macros/s/AKfycbz5IbP12AY_hqoQ-sv3VDRLIN585mIAUoU2L7te59iL9ZReCP2Q3cTJf7N2vqpNn-wpiA/exec', { // Здесь вставлена ваша ссылка
method: 'POST',
body: new URLSearchParams({ formData: JSON.stringify(data) })
});
const result = await response.json();
if (result.status === 'success') {
statusDiv.className = 'status success';
statusDiv.textContent = result.message;
form.reset();
} else {
throw new Error(result.message);
}
} catch (error) {
statusDiv.className = 'status error';
statusDiv.textContent = 'Ошибка: ' + error.message;
}
});
function toBase64(file) {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = () => resolve(reader.result);
reader.onerror = reject;
});
}
</script>
</body>
</html>
