Javascript 将参数从表单传递到函数 -->更新数据库

Question

任何人都可以帮忙吗？我有一个动态生成的表单，提交时它应该将值发送到函数并将它们添加回数据库。我在让它工作时遇到了真正的问题，看起来很简单： 1. 表单 --> 2.提交收到--> 3.更新功能。代码如下：

动态生成的表单：

   function renderResults(tx, rs) {
    e = $('#status');
    e.html("");
    for(var i=0; i < rs.rows.length; i++) {
      r = rs.rows.item(i);
  var f = $("<form>" +
"<input type=\"hidden\" name=\"rowId\" value=\"" + r.id + "\" />" +
"<input value=\"" + r.name + "\" name=\"name\" />" +
"<input value=\"" + r.amount + "\" name=\"amount\" />" +
"<input type=\"submit\" />" +
"</form>");
e.append("id: " + r.id, f);
f.submit(function(e)
{
updateRecord(this.rowId.value, this.name.value, this.amount.value);
});

        }
  }

处理表单提交并传递给函数：

$('#theform').submit(function() {
updateRecord($('#thename').val(), $('#theamount').val());

});

设置值的函数：

function updateRecord(id, name, amount) {
db.transaction(function(tx) {

       tx.executeSql('UPDATE groupOne SET (name, amount) VALUES (?, ?) WHERE id=?', [name, amount, id], renderRecords);

  });
}     

数据库更新代码将 id 设置为 4 作为测试，只是为了看看第 4 行是否发生任何情况，我已经摆弄这条线很长时间才让它工作。如果我将其设置为：

tx.executeSql('UPDATE groupOne SET name = 4, amount = 5 WHERE id=?', [id], renderRecords);

它将使用设置值，但有人可以帮助我将表单值放入其中吗？

Answer 1

您的 jQuery 选择器中缺少行 ID。您正在传递：

$('#thename').val();

但您的字段的 id 为 "thename" + r["id"]：

'<input type="text" ... id="thename' + r['id'] + '" ...>'

您需要通过传递完整的输入 id 来获取您的值。

$("#thename" + rowId).val();

编辑：仔细查看您的代码，我注意到您正在创建具有相同 id 的多个表单，这是无效的 html。我现在看到每条记录都有一张表格。很好，只需从表单及其输入中丢失 id 即可。相反，请使用输入名称。

var f = $("<form>" +
    "<input type=\"hidden\" name=\"rowId\" value=\"" + r.id + "\" />" +
    "<input name=\"name\" />" +
    "<input name=\"amount\" />" +
    "<input type=\"submit\" />" +
    "</form>");
e.append("id: " + r.id, f);
f.submit(function(e)
{
    updateRecord(this.rowId.value, this.name.value, this.amount.value);
});