Question

我有一个用Odoo动态生成的文档。我有n个div，里面可以有不同类型，复选框，文本，数字等的输入框。

现在，当用户更改一个字段时，我会调用rpc调用后端并存储更改后的视图的值。

但这是一个问题，因为客户端服务器非常慢....并且每次向db写入数据都需要花费大量时间....而且这是一个检查表，并不理想。

解决方案： 现在，我想让用户更改他想要的所有字段，然后使用“更新”按钮为所有更改的视图进行写操作。

问题我不精通javascript，也不知道如何实现。现在，我认为将所有生成的行放在标签form内，然后当用户单击按钮javascritp form_id.submit()进行“ Update”调用时，找到一种方法来检索输入的所有不同名称并存储值。

还有更好的方法吗？诸如此类：如果用户更改一个字段而不是调用存储新数据，则将所有信息放入字典，列表，数组或其他内容中……当用户按Update时，我将读取此结构并将所有数据存储在其中

编辑词典词典：

dict= {
    id_line:{key:values, key:values}
    id_line:{key:values, key:values}
    ...
    }

Answer 1

您可以执行以下操作，将您的值压入数组：

var dataToSend = [];
var inputFields = document.querySelectorAll('#myform input');
    inputFields.forEach(function(inputField) {
      switch(inputField.type) {
        case 'text':
        case 'number':
          dataToSend.push({ 
            inputName: inputField.name, value: inputField.value 
          });
          break
        case 'checkbox':
          dataToSend.push({ 
            inputName: inputField.name, value: inputField.checked
          });
          break
        default:
          break
      }
    });

您将首先创建一个空数组，然后在窗体字段中查询其中的所有输入元素。根据浏览器的不同，这可能会返回支持forEach方法的可迭代NodeList，或者可能会返回其原型上不具有forEach方法的NodeList。

为简单起见，我们仅假设浏览器支持它。从这里开始，您需要做的就是确定当前正在迭代的输入字段的类型，然后使用其名称和值动态创建一个对象，并将其推入先前构造的数组中。

迭代完成后，结果应如下所示：

[
  { inputName: '...', value: '...' },
  { inputName: '...', value: '...' },
  { inputName: '...', value: '...' }
]

如果您担心NodeList不支持forEach方法，可以参考post以获得更多信息，并对此主题进行一些其他Google搜索。

P.S。这里的代码是一个示例，因此显然要确保您的switch语句涵盖您正在处理的所有输入形式

替代解决方案： 张贴者还询问您是否可以将这些数据不存储在数组中，而是作为带有嵌套对象实体的对象存储。所以这是解决方案

var dataToSend = {};
var inputFields = document.querySelectorAll('#myform input');
    inputFields.forEach(function(inputField) {
      switch(inputField.type) {
        case 'text':
        case 'number':
          dataToSend[inputField.name] = { 
            inputName: inputField.name, 
            value: inputField.value
          }
          break
        case 'checkbox':
          dataToSend[inputField.name] = { 
            inputName: inputField.name, 
            value: inputField.value
          }
          break
        default:
          break
      }
    });

这应该为您提供这种类型的结果：

{
  someFieldName: {...},
  someFieldName2: {...},
  someFieldName3: {...}
}

JavaScript中的数据结构，用于存储文档

1 个答案: