pick up input values

Question

pick up input values

Navigation

#1 by (1 votes)

1

I needed to create a code to generate inputs dynamically, below is the code: HTML

<div id="divProdutoBase" style="display:none;">
    Telefone: <input type="text" id="produto[]" name="produto[]" ng-model="telefones" />

    <input type="button" value="Remover" onclick="produtoList.remove(this.parentNode)" />
</div>

<h1>Formulário</h1>
<div id="divProdutoList">
</div>
<input type="button" value="Adicionar Produto" onclick="produtoList.insert()" />

<input type="button" value="fones" ng-click="fones()" />

JS

<script>
// fora do fiddle, você pode trocar a linha abaixo por "var produtoList = {"
var produtoList = {
    'init': function () {
        this.divProdutoList = document.getElementById('divProdutoList');
        this.divProdutoBase = document.getElementById('divProdutoBase');
    },

    'insert': function () {
        var newDiv = this.divProdutoBase.cloneNode(true);
        newDiv.style.display = '';
        console.log('newDiv => ', newDiv);
        this.divProdutoList.appendChild(newDiv);
    },

    'remove': function (el) {
        el.parentNode.removeChild(el);
    }
};
produtoList.init();

This is working fine, my question is how to get input values, I tried using the following method:

  $scope.fones = function () {
    var fff = document.getElementById('produto[]').value;
    alert(fff);
    alert(JSON.stringify(fff));
}

But it did not work

javascript html angularjs input

asked by anonymous 03.11.2016 / 11:18

1 answer

Editing in the ListView JSP Two houses after the comma

score 1 · Answer 1

If you are using angular, as the last piece of code posted in the question suggests, the value will be in the variable used in ng-model. Then it would look like this:

$scope.fones = function () {
  var fff = $scope.telefones;
  alert(fff);
  alert(JSON.stringify(fff));
}

EDIT 1

In the following way your code will seem to work correctly:

<!DOCTYPE html>
<html lang="">
  <head>
    <title>Teste</title>
  </head>
  <body id="body">
        Produto: <input type="text" id="produto[]" name="produto[]"/>
        Valor: <input type="text" name="valor[]" />
        <input type="button" value="Remover" onclick="produtoList.remove(this.parentNode)" />
    <form>
        <h1>Formulário</h1>
        <div id="divProdutoList">
        </div>
        <input type="button" value="Adicionar Produto" onclick="produtoList.insert()" />
        <input type="button" value="Testar" onclick="produtoList.teste()" />
    </form>

    <script type="text/javascript">
      produtoList = {
          'init': function()
          {
              this.divProdutoList = document.getElementById('divProdutoList');
              this.divProdutoBase = document.getElementById('divProdutoBase');
          },

          'insert': function()
          {
              var newDiv = this.divProdutoBase.cloneNode(true);
              newDiv.style.display = '';
              console.log('newDiv => ', newDiv);
              this.divProdutoList.appendChild(newDiv);
          },

          'remove': function(el)
          {
              el.parentNode.removeChild(el);
          },
          'teste': function()
          {
            alert(document.getElementById("produto[]").value);
          }
      };
      produtoList.init();
    </script>
  </body>
</html>