Problems editing a Laravel line

Question

Problems editing a Laravel line

Navigation

#1 by (0 votes)

1

Thank you in advance for reading, and I hope that if you are not bothered, you could guide me to solve this problem.

I have a form called a server, in that form I enter the important data, including the server and the version it has.

The first field brings me the operating systems, and from the system that is chosen, the second field lists the versions of that system.

up to that point all right

The problem comes when I want to edit a server that I have already registered, because, unfortunately, I do not load the version of the operating system stored previously.

This is the code of the my form, I have to put the version in that way, since if I put it with the {!! Form that I used for the operating system field, the ajax I created did not work for me to work as I needed it (That the version field is filled according to the operating system that I choose).

FATHER ELEMENT:

 {!! Form::mySelect('id_so', 'Sistema Operativo: ', App\SistemasOperativos::pluck('nombre', 'id')->toArray(), null, ['id' => 'so', 'class'=>'chosen', 'placeholder' => 'Escoge una opción']) !!}

SON ELEMENT

            <br>
          <label class="chosen" for="nombre">Version Sistema operativo</label>
          <br>
            <select name="id_version" id="version" style="width: 100%">
               <option value="">Selecciona un sistema operativo primero</option>
            </select>
          <br>

This is the ajax

<script> 
    var rutaConsulta = "{{ route('admin.ruta.consulta.so') }}"; 
    $(document).ready(function(){ 
    selectChange(); 
    }); 

    function selectChange(){ 
    $('#so').on('change', function(e){ 
    var idSo = $(this).val(); 
    ajaxSelect(idSo); 
    }); 
    } 

    function ajaxSelect(id)
    { 
        $.ajax({ 
        type: 'POST', 
        headers: { 
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') 
        },   
        url: rutaConsulta, 
        data: {id: id}, 
        dataType: 'json', 
        beforeSend: function(){ 
        } 
        }).done(function(response) { 
        var html = '<option value="">Selecciona una opción</option>'; 
        $.each(response.versiones, function(i, elem){ 
        html += '<option value="'+ elem.id +'">'+ elem.version +'</option>' 
        }); 
        $('#version').html(html); 
        }).fail(function(data) { 

        }); 
    }
</script>

This is the controller ....

  public function update(Request $request, $id)
    {

        $item = Servidores::findOrFail($id);
        $item->update($request->all());
        //return back()->withSuccess(trans('app.success_update'));
        return redirect()->route(ADMIN.'.servidoresRoute.index')->withSuccess(trans('app.success_update'));
    }

public function edit($id)
{
    $item = Servidores::findOrFail($id);
    return view('admin.servidoresVistas.edit', compact('item'));
}

public function index()
{
    $items = Servidores::with('parentServidores','servidores2','roles','so','versionn','marcas','modelos','tipos','estados','usos')->get();

    return view('admin.servidoresVistas.index', compact('items'));
}


public function consultarVersiones(Request $request)
{
   $id_so = $request->id;
   $versiones = SoVersiones::where('id_so', $id_so)->get();

   $respuesta = array();
   $respuesta['versiones'] = $versiones->toArray();   
   return response()->json($respuesta);
}


public function consultarModelos(Request $request) 
{ 
    $id_marca = $request->id; 
    $modelos = Modelos::where('id_marca', $id_marca)->get(); 


    $respuesta = array(); 
    $respuesta['modelos'] = $modelos->toArray(); 
    return response()->json($respuesta); 
}



 /**
 * Show the form for creating a new resource.
 *
 * @return \Illuminate\Http\Response
 */
public function create()
{
   $sistemas = SistemasOperativos::orderBy('nombre','asc')->get();
   $marcas = Marcas::orderBy('nombre','asc')->get();  
   return view ('admin.servidoresVistas.create', compact('sistemas','marcas'));
}

/**
 * Store a newly created resource in storage.
 *
 * @param  \Illuminate\Http\Request  $request
 * @return \Illuminate\Http\Response
 */
public function store(Request $request)
{
    Servidores::create($request->all());

    //return back()->withSuccess(trans('app.success_store'));
    return redirect()->route(ADMIN.'.servidoresRoute.index')->withSuccess(trans('app.success_store'));

}

If I put the version field in this way

{!! Form::mySelect('id_version', 'Version: ', App\SoVersiones::pluck('version', 'id')->toArray(), null, ['id' => 'version', 'class'=>'chosen', 'placeholder' => 'Escoge una opción']) !!}

If you bring me the version, but the ajax does not work for me

I wish you could help me, I've already given it a thousand laps and this issue has stalled me,

I thank you for reading.

edit:

This is the whole page

<?php $title = isset($item) ? $item->name: "Agregar nuevo Servidor" ?>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>

{!! Form::myInput('text', 'hostname', 'Hostname', ['required']) !!}
{!! Form::myInput('text', 'ip', 'IP', ['required']) !!}
{!! Form::myInput('text', 'cpu', 'CPU', ['required']) !!}
{!! Form::myInput('number', 'cores', 'Cores', ['required']) !!}
{!! Form::myInput('number', 'ram', 'Ram (MB)', ['required']) !!}
{!! Form::myInput('number', 'disco', 'Disco (GB)', ['required']) !!}
{!! Form::mySelect('id_rol', 'Rol', App\Roles::pluck('nombre', 'id')->toArray(), null, ['class'=>'chosen', 'placeholder' => 'Escoge una opción']) !!}






<div class="row">
  <div class="col-sm-12">
    <div class="box" style="border:1px solid #d2d6de;">
      <div class="box-body" style="margin:10px;">

          {!! Form::mySelect('id_so', 'Sistema Operativo: ', App\SistemasOperativos::pluck('nombre', 'id')->toArray(), null, ['id' => 'so', 'class'=>'chosen', 'placeholder' => 'Escoge una opción']) !!}

            <br>
          <label class="chosen" for="nombre">Version Sistema operativo</label>
          <br>
            <select name="id_version" id="version" style="width: 100%">
               <option value="">Selecciona un sistema operativo primero</option>
            </select>
          <br>

      </div>
    </div>
  </div>
</div>


           {!! Form::mySelect('id_version', 'Version: ', App\SoVersiones::pluck('version', 'id')->toArray(), null, ['id' => 'version', 'class'=>'chosen', 'placeholder' => 'Escoge una opción']) !!}


    <script> 
        var rutaConsulta = "{{ route('admin.ruta.consulta.so') }}"; 
        $(document).ready(function(){ 
        selectChange(); 
        }); 

        function selectChange(){ 
        $('#so').on('change', function(e){ 
        var idSo = $(this).val(); 
        ajaxSelect(idSo); 
        }); 
        } 

        function ajaxSelect(id)
        { 
            $.ajax({ 
            type: 'POST', 
            headers: { 
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') 
            },   
            url: rutaConsulta, 
            data: {id: id}, 
            dataType: 'json', 
            beforeSend: function(){ 
            } 
            }).done(function(response) { 
            var html = '<option value="">Selecciona una opción</option>'; 
            $.each(response.versiones, function(i, elem){ 
            html += '<option value="'+ elem.id +'">'+ elem.version +'</option>' 
            }); 
            $('#version').html(html); 
            }).fail(function(data) { 

            }); 
        }
    </script>

{!! Form::mySelect('id_tipo', 'Tipo', App\Tipos::pluck('nombre', 'id')->toArray(), null, ['required','class'=>'chosen', 'placeholder' => 'Escoge una opción']) !!}

{!! Form::mySelect('id_uso', 'Uso', App\Usos::pluck('nombre', 'id')->toArray(), null, ['required','id' => 'listaUsos', 'class'=>'chosen', 'placeholder' => 'Escoge una opción']) !!}

<div class="requerido-con-virtual">
    <div class="row">
    <div class="col-sm-12">
      <div class="box" style="border:1px solid #d2d6de;">
        <div class="box-body" style="margin:10px;">

{!! Form::mySelect('id_padre', 
               'Servidor padre:', 
                App\Servidores::select(DB::raw("ip AS ip"), "id")->where('id_uso', '=', 1)-> pluck('ip', 'id')->toArray(),       
                null, 
               ['class'=>'requerido-con-virtual', 'style' => 'width: 100%;', 'placeholder' => 'Escoge una opción']) !!}
        </div>
      </div>
    </div>
  </div>
</div>


<!-- MARCA Y MODELO -->

<div class="requerido-con-fisico">

        <div class="row">
      <div class="col-sm-12">
        <div class="box" style="border:1px solid #d2d6de;">
            <div class="box-body" style="margin:10px;">


              <div class="row">
                <div class="col-sm-12">
                  <div class="box" style="border:1px solid #d2d6de;">
                    <div class="box-body" style="margin:10px;">

                        {!! Form::mySelect('id_marca', 'Marca: ', App\Marcas::pluck('nombre', 'id')->toArray(), null, ['id' => 'marca', 'class'=>'chosen', 'placeholder' => 'Escoge una opción']) !!}

                    <label class="col-sm-5" for="nombre">Modelo</label>
                    <select name="id_modelo" id="modelo" style="width: 100%"> 
                    <option value="70" name=id_modelo>Selecciona un modelo primero</option> 
                    </select>

                    <br>
                    </div>
                  </div>
                </div>
              </div>

                    <script> 
                      var rutaConsulta2 = "{{ route('admin.ruta.consulta.mod') }}"; 
                      $(document).ready(function(){ 
                      selectChange2(); 
                      }); 

                      function selectChange2(){ 

                        $('#marca').on('change', function(e){ 
                        var idMarca = $(this).val(); 
                        ajaxSelect1(idMarca); 
                        }); 
                        } 

                      function ajaxSelect1(id){ 
                        $.ajax({ 
                        type: 'POST', 
                        headers: { 
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') 
                        } ,
                        url:  rutaConsulta2, 
                        data: {id: id}, 
                        dataType: 'json', 
                        beforeSend: function(){ 
                        } 
                        }).done(function(response) { 
                        var html = '<option value="">Selecciona una opción</option>'; 
                        $.each(response.modelos, function(i, elem){ 
                        html += '<option value="'+ elem.id +'">'+ elem.modelo +'</option>' 
                        }); 
                        $('#modelo').html(html); 
                        }).fail(function(data) { 

                        }); 
                        }
                    </script>

                {!! Form::myInput('text', 'mac', 'Mac: ', ['class' => 'requerido-con-fisico', 'style' => 'width: 100%;']) !!}
                {!! Form::myInput('text', 'serial', 'Serial: ', ['class' => 'requerido-con-fisico', 'style' => 'width: 100%;']) !!}
                {!! Form::mySelect('ubicacion', 'Ubicación: ', config('variables.ubicacion')) !!}
                {!! Form::myInput('text', 'propietario', 'Propietario: ', ['class' => 'requerido-con-fisico', 'style' => 'width: 100%;']) !!}

          </div>
        </div>
      </div>
    </div>
  </div>

{!! Form::mySelect('id_estado', 'Estado', App\Estados::pluck('nombre', 'id')->toArray(), null, ['class'=>'chosen', 'placeholder' => 'Escoge una opción']) !!}

{!! Form::myInput('text', 'observacion', 'Observacion', ['required']) !!}


 <script>
     $(function() 
      {
      $("#listaUsos").change(function()
        {
          if($("option:selected", this).text() == 'Fisico')
          {
              $(".requerido-con-fisico").show();
              $(".requerido-con-virtual").hide();
            }
            else
            {
              $(".requerido-con-fisico").hide();
              $(".requerido-con-virtual").show();                
            }
        });
      });
  </script>

javascript ajax laravel-5 postgresql

asked by Omar Noa 23.11.2018 в 18:24

source

1 answer

Slash Screen Android Studio disproportionate laravel Validator :: make

score 0 · Accepted Answer

you can do so and implement some improvements only:

var rutaConsulta = "{{ route('admin.ruta.consulta.so') }}";

$(document).ready(function() {

    function _ajax(url, data) {
        var response = $.ajax({
                type: 'POST',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                url: url,
                data: data,
                dataType: 'json'
            })
            .fail(function(data) {
                alert('ups errror ${data}');
            });
        return response;
    }

    $('.box-body').on('change', 'select[id="version"]', function(e) {
         let element = "#version";
        _ajax(rutaConsulta, { "id": $(this).val() }).done(function(response) {

            var html = '<option value="">Selecciona una opción</option>';

            $.each(response.versiones, function(i, elem) {
                html += '<option value="' + elem.id + '">' + elem.version + '</option>'
            });
            $(element).html(html);
        });
    });


    $('.box-body').on('change', 'select[id="marca"]', function(e) {
        element = "#version";
        _ajax(rutaConsulta, { "id": $(this).val() }).done(function(response) {

            var html = '<option value="">Selecciona una opción</option>';
            $.each(response.versiones, function(i, elem) {
                html += '<option value="' + elem.id + '">' + elem.version + '</option>'
            });
            $(element).html(html);
        });
    });

});

explanation:
this is with the help of jquery event delegation:
jquery event delegation
being elements that are loaded dynamically are not the doom when loading the page for the first time so if we try to do this: $("element") simply not find them with event delegatin what we do is that I tell him to reread the document from of the father that exists since he loads the% dom_co% in search of new children:

$("elemento_padre").on("change" ,"elemento_hijo",function(e){ console.log(e.target)});

now to specify what we will select more clearly we say that the son we want must be a select with id="x" thanks to the selected attributes:
Attribute selector
that allows us to do this $("elemento_padre")