1
Context
I need to validate the multiple checkbox. It is necessary to validate the second checkbox.
Doubt
Where and how do these validations? In php or Java?
Logic of Validation
Codes:
Locality modal: displays the multiple checkbox of the page edita.blade.php
<!--Inicio do modal de Localidades-->
<div class="modal fade modal-default" id="modalLocalidade" aria-hidden="true" aria-labelledby="examplePositionCenter"
role="dialog" tabindex="-1">
<div class="modal-dialog modal-center">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
<h4 class="modal-title">Localidades</h4>
</div>
<div class="modal-body">
<div class="form-group col-md-18" style="display:flex">
<select multiple class="esq col-md-6" name="localidadesAtivas" required>
@foreach($localidadesAtivas as $localidadeAtiva)
<option value="{{$localidadeAtiva->id}}" {{$localidadeAtiva->id == $projeto->localidade_id ? 'selected' : ''}}>{{$localidadeAtiva->localidade}}</option>
@endforeach
</select>
<div style="display:flex; flex-direction:column">
<button class="dir">▶</button>
<button class="esq">◀</button>
</div>
<select multiple class="dir col-md-6" name="localidadesAtivasSelects">
@foreach($localidadesProjeto as $localidadeProjeto)
<option value="{{$localidadeProjeto->id}}" {{$localidadeProjeto->id == $projeto->localidade_id ? 'selected' : ''}}>{{$localidadeProjeto->localidade}}</option>
@endforeach
</select>
</div>
</div><!--Fim do modal-body-->
<div class="modal-footer">
<center>
<a id="btnSalvar" type="button" class="btn btn-primary cadNovaLocalidade" data-dismiss="modal" align="center" style="width: 300px; height: 40px">Salvar</a>
</center>
</div>
</div>
</div>
</div>
<!--Fim do modal de Localidades-->
Project-cadNovasLocations.js file to register new locales (calls the php locale methodFeatures)
$("input[name='numProjeto']").val();
$("select[name='localidadesAtivasSelects'] option:selected").val();
});
//Ajax para autorizar documentação , e atualizar a página após a ação
$('.cadNovaLocalidade').click(function () {
var idProjeto = $("input[name='numProjeto']").val();
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
var localidades = new Array();
$("select[name='localidadesAtivasSelects'] option:selected").each(function(){
localidades.push($(this).val());
})
$.ajax({
url: "/projetos/localidadesAtivas",
type: "GET",
data: {numProjeto: idProjeto, localidadesAtivasSelects: localidades},
dataType: "json"
}).done(function (response) {
console.log(response);
if (response.success) {
setTimeout(() => {
alert ('Sucesso ao Cadastrar Novas Localidades');
window.location.reload();
}, 4000);
}
else {
alert("Erro ao Cadastrar Novas Localidades");
}
}).fail(function (response) {
alert ("Erro ao Cadastrar Novas Localidades");
});
return false;
});
Locality methodLiving the Projectocontroller.php class: register new localities
public function localidadesAtivas(Request $request, Projeto $projeto)
{
$projeto = $projeto->find($request->numProjeto);
if (!$projeto)
return response()->json(['error' => 'Projeto não encontrado'], 404);
//Deleta as localidades existentes
DB::table('localidades_projeto')->where('projeto_id', '=', $projeto->id)->delete();
//Salva as novas localidades
$projeto->localidades_projeto()->attach($request->localidadesAtivasSelects);
return response()
->json([
'success' => 'Sucesso ao cadastrar novas localidades'
]);
}
Project-localities.js file to move the data from the checkbox
function mover(fonte, destino) {
var selecionados = fonte.querySelectorAll("option:checked");
for ( var i = 0 ; i < selecionados.length ; i++ ) {
fonte.removeChild(selecionados[i]);
destino.appendChild(selecionados[i]);
}
}
document.querySelector("button.dir").onclick = function() {
mover(document.querySelector("select.esq"),
document.querySelector("select.dir"));
};
document.querySelector("button.esq").onclick = function() {
mover(document.querySelector("select.dir"),
document.querySelector("select.esq"));
};
what exactly do you need? Validate if you have selected items? number of items?.... In my opinion the initial validation in javascript and a basic (for example, if you have selected items) in server-side.
– aa_sp
It is about validating the selected items, the second checkbox.
– Ruama
@aa_sp It is necessary to make 3 types of validations: 1. if the size of the arrays is equal, 2. if the size of the arrays is different, 3. if the data of the arrays is equal.
– Ruama
@aa_sp . Correcting validations: 1. size of arrays = 0 (does nothing), 2. Size of arrays are different (deletes database data and saves final array), 3. Size of arrays are equal (deletes database data and saves final array).
– Ruama