Laravel with panel Laravel-admin

Question

I’m a beginner with Laravel and I’m using Laravel 5.3 with the Admin Panel called Laravel-admin (https://github.com/z-song/laravel-admin)

I need to get the answer of a radio button with Ajax before submitting the form.

The situation is so:

Do you use Medicines? () Yes ()No

If he dials Yes, then I have to ask what or what medications he takes.

select works and stores in a good way, but I can’t get the form that is generic for everyone to implement a div or something similar that depending on the answer I show or not the next question.

My current code is:

/**
 * Make a form builder.
 *
 * @return Form
 */
protected function form()
{
    return Admin::form(Aluno::class, function (Form $form) {

        $form->display('id', 'ID');
        $form->text('Matricula','Matrícula')->rules('required|min:5');
        $form->text('Nome','Nome do Aluno')->rules('required|min:4|max:50');

        $form->radio('ReacaoAlergica','Possui reação alérgica a algum medicamento?')->options([1=>'Sim',0=>'Não'])->ajax('/Admin/Extensions/Tools/remedios');
        // Se a resposta for Não então a próxima linha não pode ser mostrada
        $form->multipleSelect('medicamentos')->options(Medicamento::all()->pluck('Nome', 'id'));



        $form->divide();

        $form->number('idRespFinanceiro','Cod. do Responsável Financeiro');
        $form->display('created_at', 'Criado Em');
        $form->display('updated_at', 'Atualizado Em');
    });
}

Does anyone have any idea how to help? Thanks to everyone.

Answer 1

A solution would be to do this control with javascript:

document.querySelectorAll('[name="ReacaoAlergica"]').forEach(function() {
  this.addEventListener('click', function() {
    div_medicamentos.style.display = ReacaoAlergicaS.checked ? '' : 'none';
  });
});

Possui reação alérgica a algum medicamento?
<div>
  <input type="radio" id="ReacaoAlergicaS" name="ReacaoAlergica" value="1">
  <label for="ReacaoAlergicaS">Sim</label>

  <input type="radio" id="ReacaoAlergicaN" name="ReacaoAlergica" value="0">
  <label for="ReacaoAlergicaN">Não</label>
</div>

<div id="div_medicamentos" style="display: none">
  <label for="quais"> </label>
  <select name="medicamentos" >
    <option>Escolha o medicamento</option>
    <option>A</option>
    <option>B</option>
    <option>C</option>
  </select>
</div>

In the example I first look for elements that have the name equal to Reacaoalergica then I loop with these elements to assign a click event, every time one of them is clicked I do a check to see if the yes option is checked, if she is I take the None property of the style so that the div appears, otherwise I add None so that it is hidden!

If you have used jQuery the example can decrease a little:

$('[name="ReacaoAlergica"]').click(function() {
    div_medicamentos.style.display = ReacaoAlergicaS.checked ? '' : 'none';
});

NOTE: You should put all ids and Names as I put in the example, so that the code works properly.