0

Hola como estan tengo el siguiente problema: Tengo una Ventana Modal mediante la cual hago un insert a una tabla de mi base de datos y luego cargo esos datos en un Select de mi vista blade, todo me funciona bien solo que no se como hacer para que luego de hacer el insert y se cierre el modal el select se actualize automaticamente sin necesidad de recargar la vista. Estoy trabajando con ajax y query, tengo el ajax asi:

$('#saveBtn').click(function (e) {
          e.preventDefault();
          $(this).html('Enviando...');
          $.ajax({
            data: $('#productForm').serialize(),
            url: "{{ route('logistica.despachos.causas.store') }}",
            type: "POST",
            dataType: 'json',
            success: function (data) {
                $('#productForm').trigger("reset");
                $('#ajaxModel').modal('hide');
                table.draw();
                swal.fire({
                    //position: 'top-end',
                    title: 'Registro Exitoso!',
                    text: "El Cargo ha sido almacenado en la Base de Datos.",
                    icon: 'success',
                    showConfirmButton: false,
                    timer: 1800
                });
            },
            error: function (data) {
                console.log('Error:', data);
                $('#saveBtn').html('Ha ocurrido un error...');
            }
            });
        });

el select en la vista:

<div class="row">
                                        <div class="col-lg-5">
                                            <label for="causa_id">Causa Visita</label>
                                            <div class="form-group">
                                                <div class="input-group">
                                                    <select name="causa_id" id="causa_id" class="form-control" required>
                                                        <option value="" selected disabled>--Seleccione Causa--</option>
                                                            @foreach ($causas as $causa)
                                                                <option value="{{ $causa->id}}"> {{$causa->codigo .' --  '.$causa->causa}}</option>
                                                            @endforeach
                                                    </select>
                                                <span class="input-group-btn">
                                                    <a class="btn btn-success btn-sm" href="javascript:void(0)" id="createNewProduct"><i class="fas fa-plus-circle"></i></a>
                                                </span>
                                                </div>
                                             </div>
                                        </div>

Atento a sus comentarios y agradecido de antemano

1 respuesta 1

0

Tienes que hacer un llamado a una pagina que controle los resultados de tu HTML.

Este ejemplo es de PHP, ej: HtmlSelect.php

  if(isset($_POST['get']) && $_POST['get'] == 'selectInfo'){
     $html = "<option value='1'>1</option>
        <option value='2'>2</option>";
     echo $html;
  }

JS

$.post('HtmlSelect.php', {
  get: 'selectInfo'
}, function(response){
  $("#causa_id").html(response);
});

Cabe resaltar que en el archivo PHP debes volver a hacer la consulta sobre la base de datos para reconstruir tus "option"

Tambien recuerda que puedes incluir la sessión JS dentro de tu "success" o puedes crear una función independiente para ella (Recomdado) y la llamas dentro de "success"

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.