11496 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

Mon titre n'ai pas très clair mais j'aimerai votre aide pour comprendre/apprendre comment faire pour créer un script qui me permette de changer le background d'une div ou plutôt la id css d'une div en fonction d'un résultat affiché sur la page.

Dans mon exemple j'utilise la dernière version de prestashop, je souhaiterai changer l'id du panier en fonction du nombre d'article qu'il y a dedans.

En français : Si il y a 0 produit dans le panier afficher l'id css numéro 1 sinon afficher l'id css numéro 2, ou si le panier est >=1 afficher l'id numéro 2 sinon afficher l'id numéro 1.

<!-- Block user information module HEADER -->
<div {if $cart_qties >0 } id="header_user" {if $PS_CATALOG_MODE}class="header_user_catalog"{/if} {else} id="header_user2" {if $PS_CATALOG_MODE}class="header_user_catalog"{/if}{/if}>
	<ul id="header_nav">
		{if !$PS_CATALOG_MODE}
		<li id="shopping_cart">
			<a href="{$link->getPageLink($order_process, true)|escape:'html'}" title="{l s='View my shopping cart' mod='blockuserinfo'}" rel="nofollow">{l s='Cart' mod='blockuserinfo'}
			<span class="ajax_cart_quantity{if $cart_qties == 0} hidden{/if}">{$cart_qties}</span>
			<span class="ajax_cart_product_txt{if $cart_qties != 1} hidden{/if}">{l s='Product' mod='blockuserinfo'}</span>
			<span class="ajax_cart_product_txt_s{if $cart_qties < 2} hidden{/if}">{l s='Products' mod='blockuserinfo'}</span>
			<span class="ajax_cart_total{if $cart_qties == 0} hidden{/if}">
				{if $cart_qties > 0}
					{if $priceDisplay == 1}
						{assign var='blockuser_cart_flag' value='Cart::BOTH_WITHOUT_SHIPPING'|constant}
						{convertPrice price=$cart->getOrderTotal(false, $blockuser_cart_flag)}
					{else}
						{assign var='blockuser_cart_flag' value='Cart::BOTH_WITHOUT_SHIPPING'|constant}
						{convertPrice price=$cart->getOrderTotal(true, $blockuser_cart_flag)}
					{/if}
				{/if}
			</span>
			<span class="ajax_cart_no_product{if $cart_qties > 0} hidden{/if}">{l s='(empty)' mod='blockuserinfo'}</span>
			</a>
		</li>
		{/if}
		<li id="your_account"><a href="{$link->getPageLink('my-account', true)|escape:'html'}" title="{l s='View my customer account' mod='blockuserinfo'}" rel="nofollow">{l s='Your Account' mod='blockuserinfo'}</a></li>
	</ul>


Je vous remercie d'avance pour vos réponses,
Modifié par Office (01 Mar 2014 - 17:44)
Modérateur
Ca lu,

Un panier se gère plutôt côté serveur avec les sessions. Une fois fait, tu peux rajouter une couche JS. Comme je ne connais pas Prestashop, je ne peux pas t'aider.

Prestashop utilise un moteur de template (beurk comme pratique). Avec ce pseudo langage, tu devrais pouvoir t'en sortir ou sinon il faudra gérer cela dans le contrôleur et envoyer ça dans la vue. Est ce que le panier est rempli ?

En php pure, ça donnerait un truc du style :

	if(count($_SESSION['panier']) > 0){
		$classeColor = 'colorer';
	}

Sinon en lisant le code du moteur de template, essaie d'ecrire ceci :

<div id="{if $cart_qties >0 }header_user{else}header_user2{/if}" class="{if $PS_CATALOG_MODE}header_user_catalog{/if}">



#header_user{color:red}
#header_user2{color:green}

Modifié par niuxe (02 Mar 2014 - 01:17)