6

Sou novo no que se relaciona à JavaScript e precisava de saber que código posso utilizar para esta situação:

Por exemplo, eu tenho uma coluna denominada "Produto" que é do tipo escolha e eu queria que ao selecionar uma opção dessa coluna por exemplo "chocolate" automaticamente na outra coluna denominada "tipo" fosse colocado o tipo do produto neste caso "doces".

<script type = "text/javascript">
    document.getElementById('id').style.display = 'none'; 
    function NovaFuncaoDespesas()
    {
    var Despesas = document.getElementById('id') ;
    var Rubrica = document.getElementById('Rubrica');
    var rubrica=Rubrica.options[Rubrica.selectedIndex].text;

    if(rubrica=="Ativos Tangíveis Específicos")
    {
       Despesas.options[1].disabled=true;   
    }
    if(rubrica!="Ativos Tangíveis Específicos")
    }
</script>
5
  • Coloca o que você tem até agora para servir de base para a resposta.
    – David
    20/11/2015 às 10:50
  • Você já possui todas as categorias e os produtos no lado cliente? ou precisa consultar os produtos da categoria selecionada no servidor? se precisa consultar, o que está usando no servidor? C#, Java, Node, PHP? 20/11/2015 às 11:38
  • Neste eu estou a trabalhar numa pagina sharepoint e então através do site do mesmo posso iditar usando javascript ou outro 20/11/2015 às 14:45
  • André, dá uma olhada aqui: pt.stackoverflow.com/q/76939/129 e vê se resolve o teu problema. Senão coloca o HTML para podermos perceber o melhor o teu problema.
    – Sergio
    21/11/2015 às 9:26
  • @AndreBrandao, o SharePoint tem isso nativo, ou via SharePointDesigner. Veja se vc não está tentando reinventar a roda. 25/11/2015 às 20:08

2 Respostas 2

1

Você poderia utilizar KnockoutJS para fazer isso.

  var tipoProduto = [{
    id: 1,
    descricao: "Frutas"
  }, {
    id: 2,
    descricao: "Produto de Limpeza"
  }, {
    id: 3,
    descricao: "Carnes"
  }];

  var produtos = [{
    nome: "Banana",
    tipo: 1
  }, {
    nome: "Maça",
    tipo: 1
  }, {
    nome: "Sabão em pó",
    tipo: 2
  }, {
    nome: "Alcatra",
    tipo: 3
  }, {
    nome: "Frango",
    tipo: 3
  }, {
    nome: "Porco",
    tipo: 3
  }];

  var ViewModel = function() {
    var self = this;
    //inicializa as listas com a data(pode ser dados carregados através de um serviço
    self.produtos = ko.mapping.fromJS(produtos);
    self.tipoProduto = ko.mapping.fromJS(tipoProduto);

    self.tipoSelecionado = ko.observable();

    self.produtosFiltrados = ko.computed(function() {
      return ko.utils.arrayFilter(self.produtos(), function(i) {
        if (self.tipoSelecionado() == undefined) return;
        return i.tipo() == self.tipoSelecionado();
      });
    });
  }

  var viewModel = new ViewModel();
  ko.applyBindings(viewModel);
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout.mapping/2.4.1/knockout.mapping.min.js"></script>


<select data-bind="options:tipoProduto, optionsValue: 'id',optionsText:'descricao', optionsCaption:'Selecione um tipo de produto',value:$root.tipoSelecionado"></select>
<select data-bind="options:$root.produtosFiltrados(), optionsText:'nome'"></select>

0

Se você tem uma tabela Produtos, onde cada registro possui um campo nome e tipo, e o campo tipo seja apenas um campo de texto (não seleção), você pode fazer isso:

var lista = document.getElementById('produtos').getElementsByTagName('li');

lista = [].slice.call(lista); // lista é um HtmlCollection, para podermos iterar temos de transformá-lo em um array
  
lista.forEach(function(item) {
  var produto_radio = item.getElementsByTagName('input')[0];
  var produto_nome = produto_radio.value;
  var produto_tipo = item.getElementsByClassName('tipo')[0].innerHTML;
  var tipo_target = document.getElementById('tipo_target');
  produto_radio.onclick = function() {
    tipo_target.innerHTML = produto_tipo;
  };
});
<ul style="list-style-type: none;" id="produtos">
  <li>
    <input type="radio" name="produto" value="Chocolate">Chocolate
    <span class="tipo" style="display:none;">Doces</span>
  </li>
  <li>
    <input type="radio" name="produto" value="Detergente">Detergente
    <span class="tipo" style="display: none;">Produtos de Limpeza</span>
  </li>
</ul>

<h2 id="tipo_target">Selecione um produto</h2>

Mas se você quer relacionar duas tabelas (uma de produtos e outra de tipos) você terá de ter um relacionamento um para muitos. Assim, na tabela produtos no campo tipo, você deverá ter o código do tipo. E na função onclick você seleciona a opção entre os tipos, referente ao código do tipo.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .