Context Home I need to validate the multiple check box. You must validate the second checkbox.
DoubtHomeWhereandhowdothesevalidations?InphporjavaScript?
ValidationLogic
Codes:
LocationModality:Displaysthemultiplecheckboxontheedita.blade.phppage
<!--IniciodomodaldeLocalidades--><divclass="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-->
File project-cadNovesLocations.js to register new localities (call phpActiveSources method)
$("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;
});
Method localesActive of class ProjectController.php: register new locales
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 file-locations.js to move the data from the check box
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"));
};