Question

我正在尝试从API获取数据并将其发布到数据库，这是我手动输入数据时使用的表单。但是当您从API请求设置数据时 - 它会在页面上更新。虽然发布时显示为空白。

我正在使用

document.getElementById('Title').value = item.volumeInfo.title;

获取输入中的“值”。

和

    <div class="form-group">
            <label for="name">Authors</label>
            <input class="form-control" type="text" value="" id="Author" ng-model="book.Author" required="required"/>
        </div>

附加到表单。

<button class="btn btn-primary" ng-disabled="AddNewForm.$invalid ||
isUnchanged(book)" id="add-new-btn"
ng-click="New_Book(book)">Add</button>

为什么提交为空白？

Answer 1

您的表单元素通过其“name”属性提交其值...您是否输入元素生成名称属性？如果没有，这就是为什么它不起作用。

例如

<input name=“foo” value=“bar”/>

提交为：

?foo=bar

Answer 2

你的问题对我来说不够明确。但是我试图做一个快速的例子，让它尽可能通用，让你使用表单输入！

这是Live Preview

HTML

<form action="post" id="myForm">
   <input type="text" id="title">
   <input type="submit" value="Click To Update">
</form>

<h2 id="result"></h2>

的JavaScript

// Select our main elements (form, text input, result heading)
const form = document.getElementById("myForm");
const titleInput = document.getElementById("title");
const result = document.getElementById("result");

form.onsubmit = function(e) {

  // Don't refresh the page
  e.preventDefault();

  // Set the input value into the result heading
  result.innerHTML = titleInput.value;
}

此解决方案允许您在input和submitting表单后写任何内容。您可以在其他地方使用该数据。

使用Javascript设置输入值 - 不提交POST

2 个答案:

HTML

的JavaScript