PHP OO Como seleccionar datos multiplo de 3 en una sentencia

[jim3481]

Hola, tengo una base de datos que muestra productos, estos productos son mostrados de 3 en 3, ose acada 3 productos mostrados se aumenta el <div style="clear:both"></div> para que baje el cuadro .. mi duda es como hago para cambiar el $style a un valor diferente del tercer producto, luego del sexto, del noveno ... (multiplo de 3)?

Código PHP:

  $i = 0; 
 while ($Qproducts->next()) { 
     if(($i % 3 == 0) && ($i != 0)) 
        $this->_content .= '<div style="clear:both"></div>'; 
        
     $osC_Product = new osC_Product($Qproducts->valueInt('products_id')); 
 
$this->_content .= '<div class="whats_new_cont '.$style.' "></div>'; 
    $i++; 
           
        }  
   

No se si me hize entender, espero su ayuda o una idea ... Gracias

[rigobcastro]

No entiendo muy bien lo que quieres hacer ya que tendrías que nombrar las clases que vas a usar según el rango. Pero te voy a dar una buena opcion dado lo comprendido.

Digamos que se te genera un HTML de la siguiente forma. Por cierto yo usaría br en vez de un div para el clear.

Código HTML:

<div class="style">Producto 1</div>
<div class="style">Producto 2</div>
<div class="style">Producto 3</div>
<br class="clear">
<div class="style">Producto 4</div>
<div class="style">Producto 5</div>
<div class="style">Producto 6</div>
<br class="clear">
<div class="style">Producto 7</div>
<div class="style">Producto 8</div>
<div class="style">Producto 9</div>
<br class="clear"> 

Ya generado esto puedes usar CSS3 para arreglar la clase style según los multiplos desde su index con el selector :nth-child().

Código CSS:

/* Global, afecta a todos los div con la clase style */
.style{
    background-color:red;
}
/* Afecta a todos los div multiplos de 3 iniciando en 0 (1 en numeración real) */
.style:nth-child(3n+0){
    background-color:green;
}
/* Afecta a todos los div multiplos de 3 iniciando en 7 (6 en numeración real) */
.style:nth-child(3n+7){
    background-color:blue;
}
 

Esto es muy poderoso pero lamentablemente es para navegadores modernos y no sirve en internet explorer. Sin embargo tenemos javascript para solucionar el problema y quitarnos ese dolor de cabeza. Claro usando jQuery y Selectivizr . Que solo al llamarlas a la página, activan pseudo-clases css3 en navegadores no soportados.

Descargas Selectivizr y la libreria que uses, la mas popular jQuery y las llamas en tu header.

Código HTML:

<script type="text/javascript" src="js/jquery.js"></script>
<!--[if (gte IE 6)&(lte IE 8)]>
  <script type="text/javascript" src="js/selectivizr.js"></script>  
<![endif]--> 

Con tan solo colocar esto el arreglo del CSS funcionará correctamente, no hay necesidad de crear funciones extras ni hacer nada engorroso con plugins o algo así.

Yo te aconsejo que trabajes esto de este metodo y no desde el servidor osea PHP. Es una buena practica dejar lo que es del DOM para que se trabaje allá mismo, osea lo de CSS con CSS y lo de javascript con javascript.

No tienes necesidad de crear varias clases porque por ejemplo podrias con PHP hacer un array con las clases ejemplo, style_1, style_2 ... style_10 y según el multiplo adicionarla con condicionales, incluso un switch serviria para eso. Pero esto si tu deseas cambiar a futuro te generaría problemas, en cambio con el CSS no necesitas hacer nada mas engorroso a futuro y preocuparte por los nombres del estilo.

Espero hayas comprendido esta parte, puedes probar todo esto y generar consultas si lo deseas. Incluso yo adicionaría el clear con CSS o jQuery también.

Saludos!

[jim3481]

Gracias rigobcastro por la ayuda pero aun no le doy solucion a mi problema, mira hize lo q me pediste y este fue el resultado para 6 productos:

Código HTML:

<div class="style">Producto 1</div> <--- background red
<div class="style">Producto 2</div> <--- background red
<div class="style">Producto 3</div> <--- background green
<br class="clear">
<div class="style">Producto 4</div> <--- background red
<div class="style">Producto 5</div> <--- background green
<div class="style">Producto 6</div> <--- background red
<br class="clear">
 

y el resultado que yo deseo ya sea para 6 productos o mas:

Código HTML:

<div class="style">Producto 1</div> <--- background red
<div class="style">Producto 2</div> <--- background red
<div class="style">Producto 3</div> <--- background green
<br class="clear">
<div class="style">Producto 4</div> <--- background red
<div class="style">Producto 5</div> <--- background red
<div class="style">Producto 6</div> <--- background green
<br class="clear"> 
.
.
.
<div class="style">Producto 13</div> <--- background red
<div class="style">Producto 14</div> <--- background red
<div class="style">Producto 15</div> <--- background green
<br class="clear">
 

espero me puedas ayudar ya sea mediante php o css..

gracias

[jim3481]

please anybody could u help me out here !...

[chwc]

por que no pruebas mediante php + css

Código PHP:

$i = 0; 
 while ($Qproducts->next()) { 
     if(($i % 3 == 0) && ($i != 0)) 
        $this->_content .= '<div style="clear:both"></div>'; 
        
     $osC_Product = new osC_Product($Qproducts->valueInt('products_id')); 
 
$this->_content .= '<div class="whats_new_cont '.$style.' estilocolor'.($i % 3).'"></div>'; 
    $i++; 
           
        }
 

css

Código CSS:

.estilocolor0{
background-color:red;
}
.estilocolor1{
background-color:green;
}
.estilocolor2{
background-color:blue;
}
 

saludos