0

Tengo una consulta , como podria implementar un metodo ajax para que el buscador traiga la data en el ID que se le dice.(cabe resaltar que el que trae la data y el buscador estan en la misma pagina, la vista que carga todo esto es otra pagina)

$('.data-show-01').click(function (e) {
    e.preventDefault();

    var me = $(this),
        url = me.attr('href');

    getData(url)
});

function getData(url) {
    $.ajax({
        url: url,
        dataType: 'html',
        success: function (response) {
            $('#loadData').html(response);
        }
    });
};
// con esto traigo la data al carga la pagina html
//esta es la pagina que me trae la data

<div class="search">
    <form class="searchForm" action="{{ route( 'tipo',['estado' => Crypt::encrypt($estado_id),'tipo' => Crypt::encrypt($tipo_id)]) }}" method="get">
        <div class="u-relative">
            <input type="text" name='number' class="field__input" placeholder="Buscar por número de expediente">
            <button type='submit' class="searchForm__submit">
                <svg>
                    <use xlink:href="#search"></use>
                </svg>
            </button>
        </div>
    </form>
</div>

//  que llenarse el contenido aqui al momento
// de realizar una busqueda

  <div class="loadData" id="loadData">
                </div>

function getData(url) {
    $.ajax({
        url: url,
        dataType: 'html',
        success: function (response) {
            $('#loadData').html(response);
        }
    });
};

$('.data-show-01').click(function (e) {
    e.preventDefault();

    var me = $(this),
        url = me.attr('href');

    getData(url)
});

1
  • Quieres que cuando id me haga un foreach y me muestre todo eso? Commented el 19 jul. 2019 a las 20:11

2 respuestas 2

0

agrege este codigo

$(document).ready(function () {
    var form = $('.searchForm');

    form.bind('submit', function (e) {
       e.preventDefault();
        $.ajax({
            type: form.attr('method'),
            url: form.attr('action'),
            data: form.serialize(),
            success: function (data) {
                $('#loadData').html(data);
            }
        });
    });
});

espero sea de ayuda para los demas

1
  • Marca tu respuesta como aceptada, ayudarás a colaborar con la buena salud del sitio :D
    – fredyfx
    Commented el 19 jul. 2019 a las 20:18
0

Asi puedes obtener y mostrar lo que quieras buscar

  
  $('.data-show-01').click(function (e) {
    e.preventDefault();

    var me = $(this),
        url = me.attr('href');

    getData(url)
});

function getData(url) {
   
    $.ajaxSetup({

        headers: {

            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')

        }

    }); 
    var search=url;
    
        $.ajax({

           type:'get',
           url:'ruta',
          dataType:'json',
           data:{search:search},
           success:function(data){
           $('#loadData').html(data);

           },
           error:function(data){

           console.log("no funciona");

           }


        });
};

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.