Duvida Javascript básico.
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
Curtidas 0
Melhor post
Nathália Hirth
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.
GOSTEI 2
Mais Respostas
Danilo
26/02/2018
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.
GOSTEI 0
Danilo
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.
Infelizmente desta forma não consegui, obter resultado.
Porem Obrigado da mesma forma.
GOSTEI 0