Pai x Filho Fluig - Dicas de Uso.

Como somar números dentro do pai x filho do fluig

Exemplo de como somar itens dentro da tabela pai x filho do fluig.


/**
 * 
 * Criar três campos do tipo input chamados n1, n2 e total em uma tabela pai x filho
 * Opção 01 - Criar um botão para calcular e chamar o evento onclick='calcular(this);'
 * Opção 02 - Nos campos n1 e n2 adicionar um evento onchange='calcular(this);'
 */



function calcular(obj){
    var util = new Util();
    var i = util.IndicePaiFilho(obj);

    var n1 = util.ItensPaiFilho("input","n1", i).val();
    var n2 = util.ItensPaiFilho("input","n2", i).val();

    util.ItensPaiFilho("input","total", i).val(n1 + n2);


}



//Classe Utilidade
class Util {


     // Obter os campos pai x filho do formulário.
     ItensFormulario(field_type,field_name){
        return $(`${field_type}[name='${field_name}']`) ;
      }

    //Envia o campo e ele retorna o indice do campo.
    IndicePaiFilho(obj){
     return  $(obj).attr('name').split("___")[1] ;
    
    }
    
    // Obter os campos pai x filho do formulário.
    ItensPaiFilho(field_type,field_name,field_index){
      return $(`${field_type}[name='${field_name}___${field_index}']`) ;
    }
    
    
    
    }

Como manipular um elemento do tipo select dentro do pai x filho do fluig com javascript?



 window.onload = function(){
 
 
    //varrer todo campo com o ID abaixo
   select=$("select[id*='sel_campo___'] ");

   //Quebrar todos os campos em um array.
   select.toArray().forEach((k,v)=>{
       
     //imprimir o objeto K
    console.log(k);

    //analisar o valor do campo.
    if(k.value=='sim'){  
       //para cada campo analisar a opção do campo select.   
       for(i=0;i<k.options.length;i++){
        
       //imprimir o objeto K que é o principal
       console.log(k[i]); 

       // obter o Index da tabela pai x filho daquele elemento
       var i = $(k).attr('id').split("___")[1];
       
       // acessar outro campo qualquer do campo pai x filho
       console.log($("input[name="campoQualquer___" + i).val() ); 

       
        if(k[i].value!='conforme'){
         k[i].disabled='disabled';
    }
   }
     }else if(k.value=='nap'){     
   for(i=0;i<k.options.length;i++){
      console.log(k[i]); 
      if(k[i].value!='tratado'){
         k[i].disabled='disabled'       
     }
   }
 }
 

 });
 }
 }