Tengo tablas llamadas: 1) requisiciones_de_compra; 2) liquidaciones. Suponiendo que tengo 100 datos tanto para solicitudes de compra como para liquidaciones.

En nuestra aplicación, tenemos todas las listas de usuarios y cuando el cliente hizo clic en un determinado usuario, aparecerá un modal.

En este modal puede ver todos los registros de ese usuario y también hay 2 pestañas. 1) pestaña Solicitud de compra; 2) Pestaña Liquidaciones.

Solicitud de compra es la pestaña activa una vez que el cliente hizo clic en el usuario determinado y aquí es donde busco los datos de las solicitudes de compra.

Ahora lo que quiero es que no quiero cargar los 100 datos de solicitudes de compra y liquidaciones al mismo tiempo.

Quiero cargar las liquidaciones, por ejemplo cuando hice clic en la pestaña de liquidaciones.

Pregunta: ¿Por qué mi evento de clic no funciona?

panel de pestañas

 <ul class="nav nav-pills"> <li class="nav-item" style="width: 10%"> <a class="nav-link active" data-toggle="pill" href="#purchases-payments-tab">Purchases/Payments</a> </li> <li class="nav-item" style="width: 10%"> <a class="nav-link" data-toggle="pill" href="#liquidations-tab">Liquidations</a> </li>

JavaScript

 <script type="text/javascript"> function getPurchasesPayments(vendor_id,start_date,end_date){ // .... code } $(document).ready(function(){ var vendor_id = "<?= $vendor->id; ?>"; var start_date = "<?= $start_date;?>"; var end_date = "<?= $end_date;?>"; if ($('.purchases-payments').length > 0) { $('div').click('.purchases-payments',function(e){ // $('.purchases-payments').click(function(e){ $('.purchases-payments-details').html(''); getPurchasesPayments(vendor_id,start_date,end_date); e.preventDefault(); return false; }) } if ($('.liquidations').length > 0) { $('div').click('.liquidations',function(e){ // $('.liquidations').click(function(e){ alert('test'); e.preventDefault(); return false; }) } // if ($('.liquidations').hasClass('active')) { // alert('liquidations active'); // } })