4
I’m doing a validation example for a dynamic table and would like a bug help here. When I make the first insertion he gives right, when I change, he let insert and duplicate.
$("button").click(function() {
// alert('teste');
var cont = 0;
var count = $('#mytbody').children('tr').length;
var vIdEmpresa = $('#selectEmpresa option:selected').val();
var vEmpresa = $('#selectEmpresa option:selected').text();
if (!count) {
// console.log('vazio');
var linha = '<tr class="selected" id="linha' + cont + '">' +
'<td>' +
'<input class="idemp" type="hidden" name="idempresa[]" value="' + vIdEmpresa + '">' + vEmpresa +
'</td>' +
' </tr>'
cont++;
$('#mytbody').append(linha);
} else {
$(".idemp").each(function(index, value) {
var vText = console.log($(this).text());
if ($(value).val() == vIdEmpresa) {
console.log('Empresa ja foi adicionada!');
} else {
var linha = '<tr class="selected" id="linha' + cont + '">' +
'<td>' +
'<input class="idemp" type="hidden" name="idempresa[]" value="' + vIdEmpresa + '">' + vEmpresa +
'</td>' +
' </tr>'
cont++;
$('#mytbody').append(linha);
}
})
}
});
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<div class="container">
<div class="row">
<div class="col-md-10">
<select class="form-control" id="selectEmpresa">
<option value="1">Empresa 01</option>
<option value="2">Empresa 02</option>
<option value="3">Empresa 03</option>
</select>
</div>
<div class="col-md-2">
<button type="button" name="button">Adicionar</button>
</div>
<div class="col-md-12">
<br>
</div>
<div class="col-md-12">
<table class="table table-striped">
<thead>
<tr>
<th>Empresa</th>
</tr>
</thead>
<tbody id="mytbody">
</tbody>
</table>
</div>
</div>
</div>
Example
$("button").click(function() {
$('#selectEmpresa').change(function(){
$('#msg').html('');
});
var vIdEmpresa = $('#selectEmpresa option:selected').val();
var vEmpresa = $('#selectEmpresa option:selected').text();
var mensagem = $('#msg');
var linha = '<tr class="selected" id="linha' + vIdEmpresa + '">' +
'<td>' +
'<input class="idemp" type="hidden" name="idempresa' + vIdEmpresa + '" value="' + vIdEmpresa + '">' + vEmpresa +
'</td>' +
'<td>' +
`<select class="form-control" id="autoriza">
<option value="Sim">Sim</option>
<option value="Não">Não</option>
</select>`+
'</td>' +
'<td>' +
`<input type="checkbox" value="Sim">`+
'</td>' +
'<td>' +
`<input type="radio" name="teste" value="Sim"> Sim
<input type="radio" name="teste" value="Nao"> Não`+
'</td>' +
' </tr>'
if($("tr#linha" + vIdEmpresa).length === 0) {
$('#mytbody').append(linha);
} else {
$('#msg').html("<b class='text-danger'>⚠ Empresa " + vIdEmpresa + " já foi adicionada!</b>");
}
});
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<div class="container">
<div class="row">
<div class="col-md-10">
<select class="form-control" id="selectEmpresa">
<option value="01">Empresa 01</option>
<option value="02">Empresa 02</option>
<option value="03">Empresa 03</option>
</select>
</div>
<div class="col-md-2">
<button type="button" name="button">Adicionar</button>
</div>
<div class="col-md-12">
<span id="msg"></span><br>
</div>
<div class="col-md-12">
<table class="table table-striped">
<thead>
<tr>
<th>Empresa</th>
<th>Autoriza</th>
<th>Checa</th>
<th>Opção</th>
</tr>
</thead>
<tbody id="mytbody">
</tbody>
</table>
</div>
</div>
</div>
Use your browser developer’s console and note the error log it shows to help identify the issue.
– Giuliana Bezerra
thanks for the return. I am using it no error return, just duplicate everything.
– frodrigues
Your doubt was not very clear.
– LeAndrade
I’ll try to elaborate. When adding from select to table it cannot let you enter in duplicity, it needs to bar and inform the user that it has already been inserted.
– frodrigues