Bom dia, estou tentando fazer um ValidateForm de uma tabela pai filho que foi criada dentro de um campo de escolha, como mostra o exempo abaixo:
<div class="form-group col-md-12">
<label for="porc_verba">Porcentagem da Verba</label><span
class="required text-danger"><strong>*</strong></span>
<div class="radio" id="porc_verba_painel">
<div class="col-md-3">
<input type="radio" id="porc_verba" name="porc_verba" onclick="if(document.getElementById('verba_porc_fixa').disabled==true){document.getElementById('verba_porc_fixa').disabled=false;document.getElementById('valor_fixo').value=''}if(document.getElementById('valor_fixo').disabled==false){document.getElementById('valor_fixo').disabled=true}if(document.getElementById('botaotabelaverba').disabled==false){document.getElementById('botaotabelaverba').disabled=true}"><label>Verba % Fixa</label> <input type="text" class="form-control" id="verba_porc_fixa" name="verba_porc_fixa" value="" placeholder="">
</div>
<div class="col-md-3">
<input type="radio" id="porc_verba" name="porc_verba" onclick="if(document.getElementById('valor_fixo').disabled==true){document.getElementById('valor_fixo').disabled=false;document.getElementById('verba_porc_fixa').value='';}if(document.getElementById('verba_porc_fixa').disabled==false){document.getElementById('verba_porc_fixa').disabled=true}if(document.getElementById('botaotabelaverba').disabled==false){document.getElementById('botaotabelaverba').disabled=true}"><label>Valor Fixo</label> <input type="text" class="form-control" id="valor_fixo" name="valor_fixo" value="" placeholder="">
</div>
<div class="col-md-6">
<input type="radio" id="porc_verba" name="porc_verba" value="% por Faixa Variável" onclick="if(document.getElementById('botaotabelaverba').disabled==true){document.getElementById('botaotabelaverba').disabled=false;document.getElementById('valor_fixo').value='';document.getElementById('verba_porc_fixa').value='';}if(document.getElementById('valor_fixo').disabled==false){document.getElementById('valor_fixo').disabled=true}if(document.getElementById('verba_porc_fixa').disabled==false){document.getElementById('verba_porc_fixa').disabled=true}">
<div class="form-group" id="TabelaPorcVerbVaril_Painel">
<table tablename="TabelaPorcVerbVaril"
id="TabelaPorcVerbVaril" class="table" noaddbutton="true">
<thead>
<tr class="tableHeadRow">
<th class="tableColumn">De</th>
<th class="tableColumn">Ate</th>
<th class="tableColumn">Porcentagem</th>
</tr>
</thead>
<tbody>
<tr class="tableBodyRow">
<td class="fs-v-align-middle"><div class="form-input">
<input type="text" id="DeTabela" name="DeTabela"
class="form-control" label="De">
</div></td>
<td class="fs-v-align-middle"><div class="form-input">
<input type="text" id="AteTabela" name="AteTabela"
class="form-control" label="Ate">
</div></td>
<td class="fs-v-align-middle"><div class="form-input">
<input type="text" id="PorcentagemTabela"
name="PorcentagemTabela" class="form-control"
label="Porcentagem">
</div></td>
</tr>
</tbody>
</table>
<button type="button" class="btn btn-primary"
onclick="wdkAddChild('TabelaPorcVerbVaril')"
id="botaotabelaverba">Nova Faixa</button>
</div>
</div>
</div>
</div>
E a validação estou tentando fazer da seguinte forma:
function validateForm(form) {
var porcentagem_variada = form.getChildrenIndexes("TabelaPorcVerbVaril");
var msg = "";
if (form.getValue("verba_porc_fixa") == ""
&& form.getValue("valor_fixo") == ""
&& porcentagem_variada.length < 1
|| form.getValue("verba_porc_fixa") == ""
|| form.getValue("valor_fixo") == ""
|| porcentagem_variada.length < 1) {
msg += " Campo Porcentagem da Verba não foi preenchido.";
}
if (msg != "") {
throw msg;
}
}
Porem a validação só esta funcionando quando é inserido algo na tabela, quando é inserido dentro de um dos outros dois campos ele apresenta a mensagem de erro. Como poderia fazer essa validação do campo para que caso um dos 3 seja preenchido ele permita passar e se nenhum deles for ele apresente o erro? Qual seria a forma correta de fazer?