[英]Can't read the form elements
我無法獲得這三個字段的值; 它只返回一個空值(一個空格)。 id 在表單中正確設置。
<script> const data = { id: document.getElementById('idbook').value, name: document.getElementById('namebook').value, price: document.getElementById('pricebook').value }; function myFunction(){ const http = new easyHTTP; http.put('https://otg0gf6qw5.execute-api.us-east-2.amazonaws.com/books', data, function(err, post){ if(err) { console.log(err); } else { console.log(post); } }); </script>
<!DOCTYPE html>
<html>
<body>
<div class="container">
<form method="post" id="save" action="javascript:myFunction()">
<h1>Insert Book</h1>
<div class="field">
<label for="id">ID Book:</label>
<input type="text" id="idbook" name="id"/>
<small></small>
</div>
<div class="field">
<label for="id">Name Book:</label>
<input type="text" id="namebook" name="nameBook"/>
<small></small>
</div>
<div class="field">
<label for="id">Price Book:</label>
<input type="text" id="pricebook" name="priceBook"/>
<small></small>
</div>
<div class="field">
<button type="submit" class="full">SAVE BOOK</button>
</div>
</form>
</div>
當我輸入值並單擊保存時,我得到一個空的 json,即:
{"id":"","name":"","price":""}
有錯誤:
“一個或多個參數值無效。鍵屬性的 AttributeValue 不能包含空字符串值。鍵:id”
問題是腳本運行后您將立即從輸入字段中獲取值,因此您將獲得空字符串,因為此時的輸入為空。
要在提交表單后獲取輸入值,請將數據變量放在myFunction()
方法中,在發送數據之前讀取值很重要。
<script>
function myFunction() {
const data = {
id: document.getElementById('idbook').value,
name: document.getElementById('namebook').value,
price: document.getElementById('pricebook').value
};
const http = new easyHTTP;
http.put('https://otg0gf6qw5.execute-api.us-east-2.amazonaws.com/books', data, function(err, post) {
if(err) {
console.log(err);
} else {
console.log(post);
}
});
};
</script>
我不知道這是否是您的意思,但是當您按提交時,我確實讓數據保存在控制台日志中
<div class="container">
<form method="post" id="save" action="javascript:myFunction()">
<h1>Insert Book</h1>
<div class="field">
<label for="id">ID Book:</label>
<input type="text" id="idbook" name="id"/>
<small></small>
</div>
<div class="field">
<label for="id">Name Book:</label>
<input type="text" id="namebook" name="nameBook"/>
<small></small>
</div>
<div class="field">
<label for="id">Price Book:</label>
<input type="text" id="pricebook" name="priceBook"/>
<small></small>
</div>
<div class="field">
<button type="submit" class="full">SAVE BOOK</button>
</div>
</form>
<script>
function myFunction(){
const data = {
id: document.getElementById('idbook').value,
name: document.getElementById('namebook').value,
price: document.getElementById('pricebook').value
};
console.log(data);
}
</script>
</div></body></html>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.