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

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

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