Duvida Javascript básico.
26/02/2018
0
Duvida Javascript.
Bom dia, estou com uma duvida relacionado a função on change mais tabela.
Estou usando o metodo on change em conjunto com um select e uma tabela.
Exemplo :
O colaborador abre um formulário e nele aparece 1 campo combo box, nele pode-se selecionar 2 informações Sim ou Não.
Se o colaborador escolhe sim não acontece nada, se ele escolhe não é apresentado para ele 3 locais de preenchimento, (Produtos adquiridos, preço do produto e prazo de pagamento).
HTML
Bom dia, estou com uma duvida relacionado a função on change mais tabela.
Estou usando o metodo on change em conjunto com um select e uma tabela.
Exemplo :
O colaborador abre um formulário e nele aparece 1 campo combo box, nele pode-se selecionar 2 informações Sim ou Não.
Se o colaborador escolhe sim não acontece nada, se ele escolhe não é apresentado para ele 3 locais de preenchimento, (Produtos adquiridos, preço do produto e prazo de pagamento).
$(document).ready(function(){ //Chama o evento após selecionar um valor $(''#novo_cliente'').on(''change'', function() { //Verifica se o valor é igual a 1 e mostra a divCnpj if ( this.value == ''novo_client_n'') { $("#info_cli_antig").show(); } //Se não for nem 1 nem 2 esconde as duas else{ $("#info_cli_antig").hide(); } }); });
HTML
<head> <script type="text/javascript" src="esp_cliente.js"></script> </head> <body> <div class="fluig-style-guide"> <form name="form" role="form"> <div class="panel panel-default" id="pn_aberturaProjetEmbala"> <div class="panel-heading"> <h3 class="panel-title">Abertura de projetos de embalagem </h3> </div> <div class="panel-body"> <div class="col-md-3"> <label class="control-label">Novo Cliente</label> <select id="novo_cliente"> <option value="">Selecione</option> <option value="novo_client_s">Sim</option> <option value="novo_client_n">Nao</option> </select> </div> <div class="table-responsive" style="display: none;" name="info_cli_antig" id="info_cli_antig"> <table class="table table-striped table-bordered" tablename="tb_info_cli_antig" id="tb_info_cli_antig" deleteicon="/ecm_resources/resources/assets/images/delete_24_Original.png"> <thead> <tr> <th>Informacoes</th> </tr> </thead> <tbody> <tr> <td> <label class="control-label">Produtos adquirios</label> <input type="text" id="pro_adquir" name="pro_adquir" class="form-control"> </td> <td> <label class="control-label">preco do produto</label> <input type="text" id="prec_produt" name="prec_produt" class="form-control"> </td> <td> <label class="control-label">prazo de pagamento</label> <input type="text" id="praz_pag" name="praz_pag" class="form-control"> </td> </tr> </tbody> </table> </div> </form> </div> </body>
Danilo
Curtir tópico
+ 0
Responder
Post mais votado
26/02/2018
Tente desta forma:
<code>
$("#novo_cliente).on("change", function(){
if($(this).val() == "novo_client_n"){
$("#info_cli_antig").show();
} else {
$("#info_cli_antig").hide();
}
});
</code>
O único erro que percebi foi no uso do $(this).val() que vc colocou this.value. Confira também estas aspas, pois está parecendo que vc usou duas aspas simples e não aspas duplas.
Espero ter ajudado.
<code>
$("#novo_cliente).on("change", function(){
if($(this).val() == "novo_client_n"){
$("#info_cli_antig").show();
} else {
$("#info_cli_antig").hide();
}
});
</code>
O único erro que percebi foi no uso do $(this).val() que vc colocou this.value. Confira também estas aspas, pois está parecendo que vc usou duas aspas simples e não aspas duplas.
Espero ter ajudado.
Nathália Hirth
Responder
Mais Posts
27/02/2018
Danilo
Bom dia Galera.
Felizmente consegui resolver com muita pesquisa e ajuda de um outros fórums.
Porem venho aqui para informar como foi resolvido.
JAVASCRIPT
HTML
Obrigado a todos que me ajudaram.
Felizmente consegui resolver com muita pesquisa e ajuda de um outros fórums.
Porem venho aqui para informar como foi resolvido.
JAVASCRIPT
function show(){ if($('#novo_cliente').val()=="novo_client_n") document.getElementById("tb_novo_client").style.display="block"; if($('#novo_cliente').val()=="novo_client_s") document.getElementById("tb_novo_client").style.display="none"; if($('#novo_cliente').val()=="") document.getElementById("tb_novo_client").style.display="none"; }
HTML
<div class="panel panel-default" id="pn_aberturaProjetEmbala"> <div class="panel-heading"> <h3 class="panel-title">Abertura de projetos de embalagem </h3> </div> <div class="panel-body"> <div class="col-md-4"> <label class="control-label">Novo Cliente</label> <select id="novo_cliente" onchange="show()"> <option value="">Selecione</option> <option value="novo_client_s">Sim</option> <option value="novo_client_n">Não</option> </select> </div> <div id="tb_novo_client" style='display:none;'> <table> <thead> <tr> <th >Informacoes</th> </tr> </thead> <tbody> <tr> <td> <label class="control-label">Produtos adquirios</label> <input type="text" id="pro_adquir" name="pro_adquir" class="form-control" > </td> <td> <label class="control-label">preco do produto</label> <input type="text" id="prec_produt" name="prec_produt" class="form-control" > </td> <td> <label class="control-label">prazo de pagamento</label> <input type="text" id="praz_pag" name="praz_pag" class="form-control" > </td> </tr> </tbody> </table> </table> </div>
Obrigado a todos que me ajudaram.
Responder
27/02/2018
Danilo
Tente desta forma:
<code>
$("#novo_cliente).on("change", function(){
if($(this).val() == "novo_client_n"){
$("#info_cli_antig").show();
} else {
$("#info_cli_antig").hide();
}
});
</code>
O único erro que percebi foi no uso do $(this).val() que vc colocou this.value. Confira também estas aspas, pois está parecendo que vc usou duas aspas simples e não aspas duplas.
Espero ter ajudado.
<code>
$("#novo_cliente).on("change", function(){
if($(this).val() == "novo_client_n"){
$("#info_cli_antig").show();
} else {
$("#info_cli_antig").hide();
}
});
</code>
O único erro que percebi foi no uso do $(this).val() que vc colocou this.value. Confira também estas aspas, pois está parecendo que vc usou duas aspas simples e não aspas duplas.
Espero ter ajudado.
Infelizmente desta forma não consegui, obter resultado.
Porem Obrigado da mesma forma.
Responder
Clique aqui para fazer login e interagir na Comunidade :)