javascript - attribute - tooltip bootstrap css
Limite el número de páginas que se muestran en la paginación de bootstrap 3 (4)
Tengo varias páginas web en mi sitio web que usan la paginación de bootstraps (bootstrap 3), pero necesito saber cómo limitar el número de páginas que se muestran en ella (por ejemplo, mostrar las páginas 1 a 10 solamente).
Si luego selecciona la página 2, se mostraría la página 11 y así sucesivamente.
¿Cómo haces esto?
Sé que probablemente sea Java / Jquery, pero se agradece cualquier ayuda. y si se puede hacer sin tener que usar Java / Jquery, entonces será mejor.
A continuación se muestra una captura de pantalla de mi paginación.
Como puede ver, hay 12 páginas visualizadas, me gustaría que las páginas 11 y 12 permanezcan ocultas hasta que se seleccione la página 2 o la página siguiente, luego se mostrarán las páginas 11 y las páginas una se ocultarán, y así sucesivamente.
Esta pregunta fue hecha hace mucho tiempo, pero surgió mientras buscaba una respuesta.
Especificar max-size=''X''
funcionó para mí. La etiqueta de paginación bootstrap se vería así:
<pagination class="pagination-sm" total-items="1000" items-per-page="10" max-size="10">
</pagination>
Espero que esto ayude a alguien.
Hay un plugin jquery para trabajar con bootstrap, que resuelve este problema: http://esimakin.github.io/twbs-pagination/ Eche un vistazo a la sección "opciones de páginas visibles".
Puede encontrar más / otras soluciones con google y bootstrap 3 pagination many pages
.
Puede probar reviews.maxPages
como se muestra a continuación:
<pagination
total-items="reviews.count"
ng-model="reviews.pageNo"
max-size="reviews.maxPages"
boundary-links="true"
rotate="false"
num-pages="reviews.noPages"
ng-change="changePageTo(reviews.pageNo)"></pagination>
Suponiendo que su página se muestra en el lado del servidor (PHP, Ruby, Java, etc.) es probable que desee renderizar la paginación correctamente en el lado del servidor.
Resolví este problema no hace mucho tiempo en PHP, tenía una función que se llamaba para cada número de página que decidía si ese número se debería representar (o algo más).
Fue algo como ésto
if the page number is < 3, render the page number
if the page number is within +-2 of the current page, render the page number
if the page number is > the total number of pages -3 render the page number
if the last page number wasn''t rendered and dots haven''t already been rendered render dots ''...'' do indicate a gap
else do nothing
Espero que esto te indique el camino correcto