汇总表格的输入并使用表格提交总计

Question

我想创建一个表单。在此表单中，用户最多可输入 12 个数字的值。这些数字的总数在输入时更新并显示在屏幕上。然后在提交表单的时候，把合计和表单一起提交。

我让它工作，以便显示和更新总数，但总数永远不会与表单一起提交。

如果我将其从隐藏类型更改为文本类型并手动更改总数并提交表单，则将提交总数。但是，如果总计由 JavaScript 自动更改，则不会随表格一起提交。

Answer 1

要使用 AngularJS 受益，您需要使用控制器和双向绑定示例：

app.controller('appCtrl', function(){
      $scope.total = 0;
      $scope.annual = 0;
    $scope.totalkWh = function totalkWh()
    {
        total = 0;
        var months = document.getElementsByName('kWh');

        for (var i = 0; i < months.length; i++)
        {
           total += parseInt(months[i].value) || 0;
        }
         $scope.total = "Total Annual Usage: " + total + " kWh";
         $scope.annual = total;
   }
})

您的视图将类似于

<input type="hidden" data-ng-model="annual" value="{{ value }}" data-ng-required="false">
<div>{{total}}</div>

希望对您有所帮助

汇总表格的输入并使用表格提交总计

Summing Inputs of Form and Submit Total with Form

javascript

mongodb

angularjs

mean-stack