PHP - (#) Cargar información sólo al clickearla (Ajaxloader/PHP)

 
Vista:
Imágen de perfil de Mike

(#) Cargar información sólo al clickearla (Ajaxloader/PHP)

Publicado por Mike (55 intervenciones) el 15/08/2015 00:00:09
Hola. ¿Qué tal? Les comento mi situación. Tengo una especie de panel (adjunto una imagen y su respectivo código, que es como viene por defecto el nav) con varias opciones, en cada una de ellas le muestran, lógicamente, distintos datos al usuario. Me he dado cuenta que tras ir agregándole más información y consultas PHP a cada una de los apartados en el nav la página (sólo esa en especial, donde se encuentra el nav) está tardando un poquito más que antes en cargar.
He leído y también visto, en algunos casos, en Internet, que varios desarrolladores lo que hacen es colocar un ajaxloader. Así es, al parecer es algo como si no cargaran todos los apartados del nav excepto el activo o principal hasta que no se los clickee. ¿Puede ser esto así? Y recién cuando son clickeados, se cargan, aparece el ajaxloader (en algunos casos, con el típico texto de "Cargando") y finalmente muestra la información.

bLz0say

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<div class="panel-body">
                            <!-- Nav tabs -->
                            <ul class="nav nav-tabs">
                                <li class="active"><a aria-expanded="true" href="#home" data-toggle="tab">Home</a>
                                </li>
                                <li class=""><a aria-expanded="false" href="#profile" data-toggle="tab">Profile</a>
                                </li>
                                <li><a href="#messages" data-toggle="tab">Messages</a>
                                </li>
                                <li><a href="#settings" data-toggle="tab">Settings</a>
                                </li>
                            </ul>
 
                            <!-- Tab panes -->
                            <div class="tab-content">
                                <div class="tab-pane fade active in" id="home">
                                    <h4>titulo home</h4>
                                    <p>contenido home</p>
                                </div>
                                <div class="tab-pane fade" id="profile">
                                    <h4>titulo profile</h4>
                                    <p>contenido profile</p>
                                </div>
                                <div class="tab-pane fade" id="messages">
                                    <h4>titulo messages</h4>
                                    <p>contenido messages</p>
                                </div>
                                <div class="tab-pane fade" id="settings">
                                    <h4>titulo settings</h4>
                                    <p>contenido settings</p>
                                </div>
                            </div>
                        </div>

Agradecería que me orienten un poco, muchas gracias.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder