BG Development Форуми -> html post to googlesheets

BG Development · За реклама · За контакти

Помощ

Търсене

Потребители

Календар

Правила

Здравей! ( Включване | Регистриране )

BG Development Форуми -> Програмиране -> HTML/CSS/JavaScript/VBScript

html post to googlesheets, js

Абонирай се за темата | Изпрати адреса на темата на приятел | Принтирай темата

peterhoff

Публикувано на: 14-05-2022, 11:20

Име: Петко Иванов
Група: Потребител
Ранг: Активен

Мнения: 240
Регистриран на: 25.07.11

Здравейте, имам една простичка форма за попълване с input тагове от bootstrap, който успях да вържа да submit-ва към една таблица в google sheets.
input таговете ги получавам в таблицата, но имам и един dropdown list с имена и искам, когато избера име просто да го изпише в дадената клетка след submit.

ето и кода, който имам.
HTML:

CODE

!doctype html>
<html lang="bg">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<link href="style.css" rel="stylesheet">
<title>YavlenaTeam</title>
</head>
<body>

<form method="POST" class="row g-3" name="google-sheet">
<div class="input-group mb-3">
<label class="input-group-text" for="inputGroupSelect01">Имена</label>
<select class="form-select" name="brokers">
<option selected>Изберете брокер</option>
<option value="1">1 име</option>
<option value="2">2 име</option>
<option value="3">3 име</option>
<option value="4">4 име</option>
<option value="5">5 име</option>
<option value="6">6 име</option>
</select>
</div>
<div class="form-floating mb-3" name="client">
<input type="text" class="form-control" name="client" placeholder="Име на клиента">
<label for="floatingInput" name="client">Име на клиента</label>
</div>
<div class="col-md-6" name="deposit">
<label for="inputEmail4" class="form-label" name="deposit">Депозит</label>
<input type="date" class="form-control" name="deposit">
</div>
<div class="col-md-6" name="depositReturn">
<label for="inputPassword4" class="form-label" name="depositReturn">Депозит - Връщане</label>
<input type="date" class="form-control" name="depositReturn">
</div>

<div class="row g-3" name="contract">
<div class="col-md-6" name="contracts">
<label for="inputEmail4" class="form-label" name="contract">Предварителен договор</label>
<input type="date" class="form-control" name="contract">
</div>
<div class="col-md-6" name="notary">
<label for="inputPassword4" class="form-label" name="notary">Изповядване</label>
<input type="date" class="form-control" name="notary">
</div>
<div class="col-md-6" name="teamWork">
<label for="inputEmail4" class="form-label" name="teamWork">Сътрудничество</label>
<input type="text" class="form-control" name="teamWork">
</div>
<div class="col-md-6" name="partners">
<label for="inputPassword4" class="form-label" name="partners">Външен брокер</label>
<input type="text" class="form-control" name="partners">
</div>

<div class="form-floating mb-3" name="commission">
<input type="number" class="form-control" name="commission" placeholder="Име на клиента">
<label for="floatingInput" name="commission">Комисион в евро без ДДС</label>
</div>
<button type="submit" name="submit" class="btn btn-primary">Изпрати</button>
</form>

<script type="text/javascript">

const scriptURL = 'https://script.google.com/macros/s/AKfycbxcZlumVaYGBoHu2NwPCQO5P7OW5lRsapeeDCOPghAsrp01sUQTDEHYtvkQU6leH2KX0g/exec'
const form = document.forms['google-sheet']

form.addEventListener('submit', e => {
e.preventDefault()
fetch(scriptURL, { method: 'POST', body: new FormData(form)})
.then(response => alert("You have successfully submitted."))
.catch(error => console.error('Error!', error.message))
})
</script>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
</body>
</html>

Code.gs:

CODE

var sheetName = 'Sheet1'
            var scriptProp = PropertiesService.getScriptProperties()

            function intialSetup () {
             var activeSpreadsheet = SpreadsheetApp.getActiveSpreadsheet()
             scriptProp.setProperty('key', activeSpreadsheet.getId())
            }

            function doPost (e) {
             var lock = LockService.getScriptLock()
             lock.tryLock(10000)

             try {
                  var doc = SpreadsheetApp.openById(scriptProp.getProperty('key'))
                  var sheet = doc.getSheetByName(sheetName)

                  var headers = sheet.getRange(1, 1, 1, sheet.getLastColumn()).getValues()[0]
                  var nextRow = sheet.getLastRow() + 1

                  var newRow = headers.map(function(header) {
                   return header === 'brokers' ? document.getElementById("mySelect").value : e.parameter[header]
                  })

                  sheet.getRange(nextRow, 1, 1, newRow.length).setValues([newRow])

                  return ContentService
                   .createTextOutput(JSON.stringify({ 'result': 'success', 'row': nextRow }))
                   .setMimeType(ContentService.MimeType.JSON)
             }

             catch (e) {
                  return ContentService
                   .createTextOutput(JSON.stringify({ 'result': 'error', 'error': e }))
                   .setMimeType(ContentService.MimeType.JSON)
             }

             finally {
                  lock.releaseLock()
             }
            }

моля да ми подскажете къде бъркам

peterhoff	Публикувано на: 15-05-2022, 16:57
Име: Петко Иванов Група: Потребител Ранг: Активен Мнения: 240 Регистриран на: 25.07.11	Никой ли незнае?

Антон Яначков

Публикувано на: 22-05-2022, 01:30

Име: Антон Яначков
Група: Потребител
Ранг: Почетен член

Мнения: 2637
Регистриран на: 27.07.16

QUOTE (peterhoff @ 15-05-2022, 16:57)

Никой ли незнае?

За да ти се зареди избраното, трябва формата да го вземе от някъде при зареждане.
Аз бих изпратил избраното към някоя клетка на таблицата при субмитването и при новото зареждане на формата бих го прочел от набелязаната клетка в таблицата.

Но таблицата може да се забави и затова при зареждането на формата е добре да осигуриш някаква време задръжка или нещо по-хитро с някакъв флаг, който да ти гарантира случващото се.

Това мнение е било редактирано от Антон Яначков на 22-05-2022, 01:35

DarkOne	Публикувано на: 22-05-2022, 09:13
Име: Александър Петков Група: Администратор Ранг: Почетен член Мнения: 3665 Регистриран на: 30.01.04	Не ми се чете html + js, но принципно ако има някакъв проблем да се вземе стойността от <select>, може с js да се прехвърля в <input type="hidden"> и да си действаш както с другите <input>-и. -------------------- The man who learns only what others know is as ignorant as if he learns nothing. The treasures of knowledge are the most rare, and guarded most harshly. -- Chronicle of the First Age

1 потребители преглеждат тази тема в момента (1 гости, 0 анонимни потребители)

Потребители, преглеждащи темата в момента:

« Предишна тема | HTML/CSS/JavaScript/VBScript | Следваща тема »

BG Development Форуми -> Програмиране -> HTML/CSS/JavaScript/VBScript