Stampare il totale costo in base alla quantità prodotto

[NLSweb]

... ti consiglio di inserire tutti gli script in un file esterno JS e caricarlo all'inizio come fai per gli altri codici .

poi controllo bene che il codice sia trascritto bene (che non ci siano errori) .. ad esempio:

nel codice che mi hai postato (post#59)

la funzione AGGIUNGIalCARRELLO non e' chiusa }
la funzione CALCOLAsubTotale non c'e' !

...
verifica sempre che ID e CLASS sia presenti nella struttura HTML e negli SCRIPT con la stessa dicitura
...

quindi una volta che sei sicuro che il codice sia a posto e venga caricato , verifica nuovamente il funzionamento.

Si, alla fine poi sposto i codici in file esterno.

Qui è tutta notte che cerco di farlo funzionare, ho cambiato dei nomi per far combaciare il codice con i miei css, ma non funziona ancora.

[NLSweb]

Adesso gli SCRIPT ci sono , ma il DEBUG mi segnala che la funzione AGGIUNGIalCARRELLO non e' chiusa manca la parentesi graffa , come ti avevo gia' indicato !
e poi non hai messo
$("#contenutoCarrello").append(elementi);
dopo la definizione della variabile HTML

io ho fatto copia-incolla del tuo codice funzionante che è questo, di parentesi ne vedo 2

function AGGIUNGI(id){
   var nome = $("#descrizioneProdotto"+id+" .nome").html();
   var prezzo = parseFloat($("#descrizioneProdotto"+id+" .prezzo").val());
   AGGIUNGIalCARRELLO(id,nome,prezzo);  
   $(".ListaProdotti").show();
   $("#descrizioneProdotto"+id+" .aggiunto").show();
   $("#descrizioneProdotto"+id+" .aggiungi").hide();
   $("#inizio li:eq(2)").show();
   CALCOLAsubTotale(id);
   var totalequantita = parseInt($("#areacalcolo .totquantita").val());
   var totaleacquisto = parseFloat($("#areacalcolo .totspesa").val());
   totalequantita++;
   totaleacquisto+=prezzo;
   $("#areacalcolo .totquantita").val(totalequantita);
   $("#areacalcolo .totspesa").val(totaleacquisto);
   CARRELLO();
   $("#titolocarrello").html("Il tuo Carrello");
  } 

Che browser usi per il debug, come fai a verificare?

[NLSweb]

Nella funzione AGGIUNGIalCARRELLO e non AGGIUNGI !!

ecco cosa visualizza il debug

  
  function AGGIUNGIalCARRELLO(id,nome,prezzo){
 /*   var elementi = "<div class='merce' id='prodotto"+id+"'><div class='NomeProdotto'>"+nome+"</div><div class='PrezzoProdotto'>Prezzo €<input class='costo' type='number' name='costo' value='"+prezzo+"' disabled/>Quantita<input class='quantita' type='number' min='0' value='1' name='quantita' onchange='aggiornaQuantita("+id+")'/>Costo €<input class='subtotale' type='number' value='0' disabled/><button onclick='ELIMINA("+id+")'>Elimina</button></div></div>";
   $("#contenutoCarrello").append(elementi);  
  }  */
var elementi = "<div id='prodotto'"+id+"'><p class='nomeLibro'>"+nome+"<br><br><span class='moneyCarrello1'>€ </span><input class='moneyCarrello1 mod' id='input-number-mod' type='numberDE' name='moneyCarrello1' value='"+prezzo+"'><span class='quant'>Q.tà:</span> <input class='quantity' type='number' name='quantity' min='0' value='1'>&nbsp;&nbsp;= <span class='subTotale'>€ </span><input class='subTotale mod' id='input-number-mod' type='numberDE' name='subTotale' value='0'><input type='submit' class='input' name='puls' value='Elimina' onclick='ELIMINA("+id+")'></p></div>";

come puoi vedere manca la parentesi graffa per chiudere la funzione e la stringa di comando
$("#contenutoCarrello").append(elementi);
e' stata omessa.

io uso Firefox per il DEBUG

Ok, ora qualcosa inizia a funzionare, però ci sono dei simboli strani.

Col debugger di FF, tu entri e cosa selezioni, Analisi pagina, console...

[NLSweb]

premi F12 per aprire gli strumenti web developer , quindi quando premi un pulsante (tipo aggiungi al carello) , apri CONSOLE per verificare gli errori e usa DEBUGGER per analizzare il flusso dati


ora .. ad esempio vedo che ci sono ancora alcuni errori di trascrizione del codice...

ad esempio la <!--SECONDA PARTE PRODOTTI IN VENDITA--> apri il DIV ma non lo chiudi !

...

un altra cosa non hai inserito ONCHANGE nel INPUT Quantita' , quindi quando cambi la quantita' non succede niente !
controlla bene il codice che ti ho postato...


........


ancora un altro errore di trascrizione del codice

quando definisci la variabile elementi scrivi <div id='prodotto'"+id+"'> e' sbagliato !
va scritto cosi' : <div id='prodotto"+id+"'>

.. la differenza sta che dopo prodotto tu chiudi la definizione con un aprice e poi aggiungi id , invece la chiusura del apice deve essere dopo id .. infatti il tuo codice produce: <div id="prodotto" 1'="">

ed ecco perche' il pulsante elimina non funziona !

Io ho Mac, se premo F12, si alza il volume, comunque in Firefox entro in Strumenti-->Sviluppo web-->Debugger, ho impostato Console e cliccato su Aggiungi al carrello ma non esce niente.

Poi, tutta questa parte è commentata <!--SECONDA PARTE PRODOTTI IN VENDITA-->

Appaiono ancora sei simboli strani.

[NLSweb]

Poi, tutta questa parte è commentata <!--SECONDA PARTE PRODOTTI IN VENDITA-->

Non e' tutta commentata !! come ti dicevo apri il DIV ma non lo chiudi...

ecco come si presenta il codice... come vedi c'e' un div dopo il primo commento che hai aperto ma non chiuso
quindi o lo commenti anche quello o levi il commento dalla chiusura del div alla fine

<!--SECONDA PARTE PRODOTTI IN VENDITA-->
<div>

<!--<div id="descrizioneProdotto1">
<div class="nome">DESCRIZIONE PRODOTTO 1</div>
<button class="aggiungi" onclick="AGGIUNGI(1)">Aggiungi al Carrello</button>
<div class="aggiunto">Aggiunto!</div>
<input class="prezzo" type="number" name="prezzo" value="30.50" disabled/>
</div>

<div id="descrizioneProdotto2">
<div class="nome">DESCRIZIONE PRODOTTO 2</div>
<button class="aggiungi" onclick="AGGIUNGI(2)">Aggiungi al Carrello</button>
<div class="aggiunto">Aggiunto!</div>
<input class="prezzo" type="number" name="prezzo" value="37.20" disabled/>
</div>

<div id="descrizioneProdotto3">
<div class="nome">DESCRIZIONE PRODOTTO 3</div>
<button class="aggiungi" onclick="AGGIUNGI(3)">Aggiungi al Carrello</button>
<div class="aggiunto">Aggiunto!</div>
<input class="prezzo" type="number" name="prezzo" value="40.10" disabled/>
</div>

</div>-->

hai fatto le altre correzioni ?

Ho tolto il div

[NLSweb]

spero tu abbia fatto anche le altre correzioni ....

intanto ho trovato il perche' quando di aggiunge un elemento al carrello che lo scrive doppio....

nella funzione AGGIUNGI tu essegni alla variabile NOME ("#prodotto"+id+" .nomeLibro").html();

invece dovresti assegnarli secondo come hai strutturato la pagina ("#infoProdotto"+id+" .descrizione").html();

Ho corretto, ma ha me non serve stampare la classe descrizione che ho in index…non capisco

[NLSweb]

Attualmente nella pagina che mi hai likato , la sezione in fondo relativa al carrello
ha due parti:

- quella Nel carello con gli elementi che si aggiungono man mano che si clicca su "Aggiungi al Carrello"

- e poi hai una lista dei prodotti con tutti i campi input sempre visibile


attualmente quello che fai e copiare il contenuto della seconda parte e metterlo nella prima come NOME
quindi ti crea "l'effetto doppione"

cio' che vuoi e' che la variabile nome contenga una breve descrizione dell'elemento (il suo nome , il codice , etc.)
dati che sono contenuti in infoProdotto (la parte superiore della pagina)

difatto la lista dei prodotti con tutti i campi input sempre visibile dovresti cancellarla perche' non ti serve piu'..

...non serve stampare la classe descrizione....

la variabile nome deve contenere queste info (esempio)

Libro1 | ISBN 978-88-89292-55-1

------------------------------

vedo che il nome della classe che hai assegnato al campo input del sub totale e' subTotale mod
quindi nella funzione CALCOLAsubTotale devi cambiare la classe da subTotale a subTotale mod

Prima di fare le modifiche, spiegami una cosa: mi hai detto di cancellare la lista fissa che ho nel carrello, questa:

<!-- INIZIO CARRELLO --> 
<div class="listaProdotti">
<div id="contenutoCarrello"></div>
<div style="width: auto; height: auto; font-size: 2em; color: #008000; text-align: center;">Il tuo Carrello<br><p>è vuoto</p></div>
<br>
<div id="prodotto1">
<p class="nomeLibro">Libro1<span class="isbn">&nbsp;&nbsp;|&nbsp;&nbsp;ISBN 978-88-89292-55-1</span>
<br>
<br>
<span class="moneyCarrello">€ </span><input class="moneyCarrello1 mod" id="input-number-mod" type="numberDE" name="moneyCarrello1" value="18.00">
<span class="quant">Q.tà:</span> <input class="quantity" type="number" name="quantity" min="0" value="0">
&nbsp;&nbsp;= <span class="subTotale">€ </span><input class="subTotale mod" id="input-number-mod" type="numberDE" name="subTotale" value="0"><input type="submit" class="input" name="puls" value="Elimina" onclick="ELIMINA(1)">
</p>
</div>
... 

Se la tolgo, come fa poi il codice a trovarla e stamparla?

[NLSweb]

il codice non preleva i dati da quella lista

le informazioni che genera sono date dalla famosa funzione AGGIUNGIalCARRELLO

a cui passi gli argomenti ID prodotto , NOME prodotto , PREZZO prodotto

e la funzione crea (HTML formattato) che va ad aggiungere al CARRELLO

se provi a rivedere l'ultimo esempio che ho fatto , la lista non c'e' .. i dati vengono prelevati dalla schermata principale con l'elenco dei prodotti in vendita (per capirci quella con il pulsante Aggiungi al Carrello)

Si, ho visto, nel mio caso questi dati si trovano proprio qui, difatti se li tolgo non li stampa


<p class="nomeLibro">Libro7<span class="isbn">&nbsp;&nbsp;|&nbsp;&nbsp;ISBN 978-88-89292-55-7</span>

[NLSweb]

Per come impostato il carrello , cioe' che man mano che si aggiunge un articolo questo viene inserito e visualizzato nell'ordine di scelta da parte del cliente

questa parte non dovrebbe piu' esistere

screen shot 1

e i dati formattati da mettere nel carrello vengono prelevati da questa sezione

screen shot 2

....

se ti ricordi all'inizio (post#30) mi hai chiesto che i prodotti si aggiungessero nel carrello e quindi diventassero visibili
quindi avevamo una lista del prodotti in vendita con i campi input che visualizzavano se selezionati

poi nel post#38 mi hai chiesto che gli elementi venissero visualizzati nel carrello nell'ordine con cui si sceglievano
quindi ho dovuto riscrivere il codice ex-novo (che e' poi quello che stiamo usando adesso)

Si mi ricordo, in realtà non ci eravamo capiti, è adesso la sequenza che va bene.

Riguardo ai dati che ci sono nella lista fissa, non sarebbe meglio mettere tutto in un file esterno e richiamare i dati, visto che sono già pronti? C'è da modificare molto il codice?

Praticamente tutto questo blocco lo mettiamo nel file esterno, così rimane tutto assieme

<!-- INIZIO CARRELLO --> 
<div class="listaProdotti">
<div id="contenutoCarrello"></div>
<div id="prodotto1">
<p class="nomeLibro">Libro1<span class="isbn">&nbsp;&nbsp;|&nbsp;&nbsp;ISBN 978-88-89292-55-1</span>
<br>
<br>
<span class="moneyCarrello">&#8364; </span><input class="moneyCarrello1 mod" id="input-number-mod" type="numberDE" name="moneyCarrello1" value="18.00">
<span class="quant">Q.tà:</span> <input class="quantity" type="number" name="quantity" min="0" value="0">
&nbsp;&nbsp;= <span class="subTotale">&#8364; </span><input class="subTotale mod" id="input-number-mod" type="numberDE" name="subTotale" value="0"><input type="submit" class="input" name="puls" value="Elimina" onclick="ELIMINA(1)">
</p>
</div>

<div id="prodotto2">
<p class="nomeLibro">Libro2<span class="isbn">&nbsp;&nbsp;|&nbsp;&nbsp;ISBN 978-88-89292-55-2</span>
<br>
<br>
<span class="moneyCarrello">&#8364; </span><input class="moneyCarrello1 mod" id="input-number-mod" type="numberDE" name="moneyCarrello1" value="15.00">
<span class="quant">Q.tà:</span> <input class="quantity" type="number" name="quantity" min="0" value="0">
&nbsp;&nbsp;= <span class="subTotale">&#8364; </span><input class="subTotale mod" id="input-number-mod" type="numberDE" name="subTotale" value="0"><input type="submit" class="input" name="puls" value="Elimina" onclick="ELIMINA(2)">
</p>
</div>

<div id="prodotto3">
<p class="nomeLibro">Libro3<span class="isbn">&nbsp;&nbsp;|&nbsp;&nbsp;ISBN 978-88-89292-55-3</span>
<br>
<br>
<span class="moneyCarrello">&#8364; </span><input class="moneyCarrello1 mod" id="input-number-mod" type="numberDE" name="moneyCarrello1" value="22.00">
<span class="quant">Q.tà:</span> <input class="quantity" type="number" name="quantity" min="0" value="0">
&nbsp;&nbsp;= <span class="subTotale">&#8364; </span><input class="subTotale mod" id="input-number-mod" type="numberDE" name="subTotale" value="0"><input type="submit" class="input" name="puls" value="Elimina" onclick="ELIMINA(3)">
</p>
</div>

<div id="prodotto4">
<p class="nomeLibro">Libro4<span class="isbn">&nbsp;&nbsp;|&nbsp;&nbsp;ISBN 978-88-89292-55-4</span>
<br>
<br>
<span class="moneyCarrello">&#8364; </span><input class="moneyCarrello1 mod" id="input-number-mod" type="numberDE" name="moneyCarrello1" value="19.00">
<span class="quant">Q.tà:</span> <input class="quantity" type="number" name="quantity" min="0" value="0">
&nbsp;&nbsp;= <span class="subTotale">&#8364; </span><input class="subTotale mod" id="input-number-mod" type="numberDE" name="subTotale" value="0"><input type="submit" class="input" name="puls" value="Elimina" onclick="ELIMINA(4)">
</p>
</div>

<div id="prodotto5">
<p class="nomeLibro">Libro5<span class="isbn">&nbsp;&nbsp;|&nbsp;&nbsp;ISBN 978-88-89292-55-5</span>
<br>
<br>
<span class="moneyCarrello">&#8364; </span><input class="moneyCarrello1 mod" id="input-number-mod" type="numberDE" name="moneyCarrello1" value="17.00">
<span class="quant">Q.tà:</span> <input class="quantity" type="number" name="quantity" min="0" value="0">
&nbsp;&nbsp;= <span class="subTotale">&#8364; </span><input class="subTotale mod" id="input-number-mod" type="numberDE" name="subTotale" value="0"><input type="submit" class="input" name="puls" value="Elimina" onclick="ELIMINA(5)">
</p>
</div>

<div id="prodotto6">
<p class="nomeLibro">Libro6<span class="isbn">&nbsp;&nbsp;|&nbsp;&nbsp;ISBN 978-88-89292-55-6</span>
<br>
<br>
<span class="moneyCarrello">&#8364; </span><input class="moneyCarrello1 mod" id="input-number-mod" type="numberDE" name="moneyCarrello1" value="18.00">
<span class="quant">Q.tà:</span> <input class="quantity" type="number" name="quantity" min="0" value="0">
&nbsp;&nbsp;= <span class="subTotale">&#8364; </span><input class="subTotale mod" id="input-number-mod" type="numberDE" name="subTotale" value="0"><input type="submit" class="input" name="puls" value="Elimina" onclick="ELIMINA(6)">
</p>
</div>

<div id="prodotto7">
<p class="nomeLibro">Libro7<span class="isbn">&nbsp;&nbsp;|&nbsp;&nbsp;ISBN 978-88-89292-55-7</span>
<br>
<br>
<span class="moneyCarrello">&#8364; </span><input class="moneyCarrello1 mod" id="input-number-mod" type="numberDE" name="moneyCarrello1" value="13.10">
<span class="quant">Q.tà:</span> <input class="quantity" type="number" name="quantity" min="0" value="0">
&nbsp;&nbsp;= <span class="subTotale">&#8364; </span><input class="subTotale mod" id="input-number-mod" type="numberDE" name="subTotale" value="0"><input type="submit" class="input" name="puls" value="Elimina" onclick="ELIMINA(7)">
</p>
</div>

<div id="prodotto8">
<p class="nomeLibro">Libro8<span class="isbn">&nbsp;&nbsp;|&nbsp;&nbsp;ISBN 978-88-89292-55-8</span>
<br>
<br>
<span class="moneyCarrello">&#8364; </span><input class="moneyCarrello1 mod" id="input-number-mod" type="numberDE" name="moneyCarrello1" value="20.12">
<span class="quant">Q.tà:</span> <input class="quantity" type="number" name="quantity" min="0" value="0">
&nbsp;&nbsp;= <span class="subTotale">&#8364; </span><input class="subTotale mod" id="input-number-mod" type="numberDE" name="subTotale" value="0"><input type="submit" class="input" name="puls" value="Elimina" onclick="ELIMINA(8)">
</p>
</div>

<span style="font-size: 1.1em;">TOTALE:</span><span class="totale"> &#8364;</span> <input class="totale mod" id="input-number-mod" type="numberDE" name="totale">
</div><!--listaProdotti-->
<!-- FINE CARRELLO --> 

[NLSweb]

sinceramente non comprendo perche' tu voglia mantenere quella lista....

ma se proprio vuoi... e vuoi usare quei dati.. allora non c'e' bisogno di metterli in file esterno (complicando ancora di piu' il codice) , basta nasconderli (renderli invisibili) e nella funzione AGGIUNGIalCARRELLO invece di generare il codice HTML si copia quello presente nella lista.

praticamento avendo noi ID andremo a leggere il contenuto HTML e lo trascriveremo nell'ordine corretto

esempio: (avendo gia' tutte le info bastera' avere come argomento funzione ID)

 function AGGIUNGIalCARRELLO(id){
   var elementi = $("prodotto"+id).html();
   var elemInCarello = "<div id='merce'"+id+"'></div>";

   $("#contenutoCarrello").append(elemInCarello);  
   $("#merce"+id).append(elementi);  
  } 

chiaramente il DIV contenutoCarrello conterra' tutti i prodotti messi nel carrello (che adesso avranno come id="merceX")

pero' per rendere invisibile la lista , o assegni una classe uguale per tutti i DIV id="prodottoX" e la definisci invisibile
oppure il div contenutoCarrello lo devi spostare fuori dalla lista e rendi invisibile tutta la lista


e speriamo bene....

Spiegami, un attimo, dici che non serve quella lista? Se non serve non la mettiamo così non modifico il codice.

Però almeno questo bisogna metterlo, che dici?

<p class="nomeLibro">Libro7<span class="isbn">&nbsp;&nbsp;|&nbsp;&nbsp;ISBN 978-88-89292-55-7</span>

[NLSweb]

Come ti dicevo nel post#77 quelle info dovrebbero essere messe nella schermata principale dove hai la foto del libro , il titolo , il ISBN , la descrizione , il prezzo e il pulsante AGGIUNGI al CARRELLO


l'idea e che tu genere la schermata principale prelevando i dati dal DB con un file PHP
quindi quella lista e' ridondante , nel carrello metterai solo gli elementi che l'utente sceglie..

Non ho ancora collegato il DB, così va bene? Però non lo richiama

<div id="infoProdotto8">
<p class="nomeLibro">Libro8<span class="isbn">&nbsp;&nbsp;|&nbsp;&nbsp;ISBN 978-88-89292-55-8</span>
<div class="libri8"><img style="width:180px; height:254px;" src="immagini/libro8x.jpg" alt="libro8" title="Arn"></div><div class="descrizioneBig8"><div class="descrizione">76756756755656 ghffhg hgfh fhgfhg fhgf hgfhgf hfg</div>
<button type="submit" class="button" name="aggiungi" value="aggiungi" onclick="AGGIUNGI(8)">Aggiungi al carrello</button>
<div class="aggiunto">Aggiunto!</div>
<div class="prezzo">€ 20,00 | pag. 178 | ISBN 978-88-89292-55-8</div></div>
</div> 

[NLSweb]

allora .. nella schermata principale puoi avre due soluzioni possibili
1) tipo il codice da te postato , e passi direttamente i dati al pulsante
2) puoi lasciare tutto il codice come lo avevi prima ma aggiungi sotto due campi input invisibili

in pratica a noi servo tre dati : 1) ID del prodotto 2) NOME del prodotto 3) PREZZO del prodotto
che sono quelli che passiamo come argomenti funzione a AGGIUNGIalCARRELLO

esempio soluzione 1:

<div class="libri1"><img style="width:180px; height:254px;" src="immagini/libro1x.jpg" alt="libro1" title="Arn"></div><div class="descrizioneBig1"><div class="descrizione">Questa è tutta la raccolta in italiano dei libri del prof. Arnold Ehret. Se può interessarti, nell'introduzione di ogni libro troverai informazioni sulla sua vita.
Come puoi vedere, ci sono libri anche di altri autori, libri, che dopo averli letti, ho ritenuto fossero un buon complemento a quelli di Ehret. Buona lettura.</div>
<button type="submit" class="button" name="aggiungi" value="aggiungi" onclick="AGGIUNGI(1,"libro1","18,00")">Aggiungi al carrello</button>
<div style="display: none;" class="aggiunto">Aggiunto!</div>
<div class="prezzo">€ 18,00 | pag. 192 | ISBN 978-88-89292-55-1</div></div> 

esempio soluzione 2:

<div class="libri1"><img style="width:180px; height:254px;" src="immagini/libro1x.jpg" alt="libro1" title="Arn"></div><div class="descrizioneBig1"><div class="descrizione">Questa è tutta la raccolta in italiano dei libri del prof. Arnold Ehret. Se può interessarti, nell'introduzione di ogni libro troverai informazioni sulla sua vita.
Come puoi vedere, ci sono libri anche di altri autori, libri, che dopo averli letti, ho ritenuto fossero un buon complemento a quelli di Ehret. Buona lettura.</div>
<button type="submit" class="button" name="aggiungi" value="aggiungi" onclick="AGGIUNGI(1)">Aggiungi al carrello</button>
<div style="display: none;" class="aggiunto">Aggiunto!</div>
<div class="prezzo">€ 18,00 | pag. 192 | ISBN 978-88-89292-55-1</div></div>
<input type="text" class="NOME1" value="LIBRO1" />
<input type="text" class="PREZZO1" value="18,00" /> 

con la prima soluzione la funzione AGGIUNGI si modifica cosi

function AGGIUNGI(id,nome,prezzo){
   var costo = parseFloat(prezzo);
   AGGIUNGIalCARRELLO(id,nome,costo);  

   $(".ListaProdotti").show();
   $("#prodotto"+id+" .aggiunto").show();
   $("#prodotto"+id+" .aggiungi").hide();
   $("#inizio:eq(2)").show();
   CALCOLAsubTotale(id);
   var totalequantita = parseInt($("#areacalcolo .totquantita").val());
   var totaleacquisto = parseFloat($("#areacalcolo .totspesa").val());
   totalequantita++;
   totaleacquisto+=prezzo;
   $("#areacalcolo .totquantita").val(totalequantita);
   $("#areacalcolo .totspesa").val(totaleacquisto);
   CARRELLO();
   $("#titolocarrello").html("Il tuo Carrello");
  } 

con la seconda soluzione la funzione AGGIUNGI si modifica cosi

function AGGIUNGI(id){
   var nome = $(".NOME"+id).val();
   var prezzo = parseFloat($(".PREZZO"+id).val());  
   AGGIUNGIalCARRELLO(id,nome,prezzo);  

   $(".ListaProdotti").show();
   $("#prodotto"+id+" .aggiunto").show();
   $("#prodotto"+id+" .aggiungi").hide();
   $("#inizio:eq(2)").show();
   CALCOLAsubTotale(id);
   var totalequantita = parseInt($("#areacalcolo .totquantita").val());
   var totaleacquisto = parseFloat($("#areacalcolo .totspesa").val());
   totalequantita++;
   totaleacquisto+=prezzo;
   $("#areacalcolo .totquantita").val(totalequantita);
   $("#areacalcolo .totspesa").val(totaleacquisto);
   CARRELLO();
   $("#titolocarrello").html("Il tuo Carrello");
  } 

-------------------------------------------------
facendo attenzione che a tutti gli script gli sia assegnata la corretta class e id......

function AGGIUNGIalCARRELLO(id,nome,prezzo){
var elementi = "<div id='prodotto"+id+"'><p class='nomeLibro'>"+nome+"<br><br>
<span class='moneyCarrello1'>€ </span>
<input class='moneyCarrello1 mod' id='input-number-mod' type='numberDE' name='moneyCarrello1' value='"+prezzo+"' />
<span class='quant'>Q.tà:</span>
<input class='quantity' type='number' name='quantity' min='0' value='1' onchange='aggiornaQuantita("+id+")' />
&nbsp;&nbsp;= <span class='subTotale'>€ </span>
<input class='subTotale mod' id='input-number-mod' type='numberDE' name='subTotale' value='0' />
<input type='submit' class='input' name='puls' value='Elimina' onclick='ELIMINA("+id+")'></p></div>";
 $("#contenutoCarrello").append(elementi);  
 } 

function CALCOLAsubTotale(id){
   var valore = parseFloat($("#prodotto"+id+" .moneyCarrello1 mod").val());
   var quantita = parseFloat($("#prodotto"+id+" .quantity").val());
   var subtotale = valore * quantita;
   $("#prodotto"+id+" .subTotale mod").val(subtotale);
} 

function aggiornaQuantita(id){
   var quantita = parseInt($("#prodotto"+id+" .quantity").val());
   var prezzo = parseFloat($("#prodotto"+id+" .moneyCarrello1 mod").val());
   var subtotale = quantita * prezzo;
   $("#prodotto"+id+" .subTotale mod").val(subtotale);
   calcolaCarrello();
  } 

function calcolaCarrello(){
   var totalequantita = 0;
   var totaleacquisto = 0;
   $(".subTotale mod").each(function(){
      totaleacquisto += parseFloat($(this).val());
   });   
   $(".quantity").each(function(){
      totalequantita += parseInt($(this).val());
   });
   $("#areacalcolo .totquantita").val(totalequantita);
   $("#areacalcolo .totspesa").val(totaleacquisto);
   CARRELLO();
  } 

Ho scelto la seconda, mi sembra meglio, ma qualcona non va, come vedi sotto il libro7 appaiono gli input. Sopra a sinistra ho messo il codice per l'importo nel Carrello

http://www.libridelbenessere.altervista.org/

Nella home

<div id="infoProdotto8">
<div class="libri8"><img style="width:180px; height:254px;" src="immagini/libro8x.jpg" alt="libro8" title="Arn"></div><div class="descrizioneBig8"><div class="descrizione">Questa è tutta la raccolta in italiano dei libri del prof. Arnold Ehret. Se può interessarti, nell'introduzione di ogni libro troverai informazioni sulla sua vita.
Come puoi vedere, ci sono libri anche di altri autori, libri, che dopo averli letti, ho ritenuto fossero un buon complemento a quelli di Ehret. Buona lettura.</div>
<button type="submit" class="button" name="aggiungi" value="aggiungi" onclick="AGGIUNGI(1)">Aggiungi al carrello</button>
<div style="display: none;" class="aggiunto">Aggiunto!</div>
<div class="prezzo">€ 18,00 | pag. 192 | ISBN 978-88-89292-55-8</div></div>
<input type="text" class="NOME8" value="LIBRO8">
<input type="text" class="PREZZO8" value="18,00">  
</div> 

 function AGGIUNGIalCARRELLO(id,nome,prezzo){
var elementi = "<div id='prodotto"+id+"'><p class='nomeLibro'>"+nome+"<br><br><span class='moneyCarrello1'>€ </span><input class='moneyCarrello1 mod' id='input-number-mod' type='numberDE' name='moneyCarrello1' value='"+prezzo+"'><span class='quant'>Q.tà:</span> <input class='quantity' type='number' name='quantity' min='0' value='1'>&nbsp;&nbsp;= <span class='subTotale'>€ </span><input class='subTotale mod' id='input-number-mod' type='numberDE' name='subTotale' value='0'><input type='submit' class='input' name='puls' value='Elimina' onclick='ELIMINA("+id+")'></p></div>";
 $("#contenutoCarrello").append(elementi);  
 }
    
  function CALCOLAsubTotale(id){
   var valore = parseFloat($("#prodotto"+id+" .moneyCarrello1").val());
   var quantita = parseFloat($("#prodotto"+id+" .quantity").val());
   var subtotale = valore * quantita;
   $("#prodotto"+id+" .subTotale").val(subtotale);
  }
  
  function AGGIUNGI(id){
   var nome = $(".NOME"+id).val();
   var prezzo = parseFloat($(".PREZZO"+id).val());  
   AGGIUNGIalCARRELLO(id,nome,prezzo);  

   $(".ListaProdotti").show();
   $("#prodotto"+id+" .aggiunto").show();
   $("#prodotto"+id+" .aggiungi").hide();
   $("#inizio:eq(2)").show();
   CALCOLAsubTotale(id);
   var totalequantita = parseInt($("#areacalcolo .totquantita").val());
   var totaleacquisto = parseFloat($("#areacalcolo .totspesa").val());
   totalequantita++;
   totaleacquisto+=prezzo;
   $("#areacalcolo .totquantita").val(totalequantita);
   $("#areacalcolo .totspesa").val(totaleacquisto);
   CARRELLO();
   $("#titolocarrello").html("Il tuo Carrello");
  } 

[NLSweb]

hai inserito gli input nel LIBRO 8 ma hai assegnato al pulsante Aggiungi al Carrello ID 1 invece di 8

<button type="submit" class="button" name="aggiungi" value="aggiungi" onclick="AGGIUNGI(1)">Aggiungi al carrello</button>

cambia ID con quello del prodotto

<button type="submit" class="button" name="aggiungi" value="aggiungi" onclick="AGGIUNGI(8)">Aggiungi al carrello</button>

continui a non inserire nel campo input della quantita il codice onchange='aggiornaQuantita("+id+")'

senza quando vari la quantita' non si aggiornano i calcoli...

Mammamia, che succede NLSweb

[NLSweb]

hai messo un

margin-top: 920px;

al div Libri di altri autori

il div class="footer" ha un margin-top di 330px


ti consiglio di rendere invisibili i campi input NOME PREZZO style="visibility:hidden;"


---------------------

mi permetto di suggerirti di non usare i margin per posizionare gli elementi ..

usa position:relative e imposta semmai il top/left , bottom/right
il margin ed il padding , solo piu' che altro dei distanziatori..

Va meglio. Ok, che sistemiamo? Io direi di mettere a post0 i calcoli…ho provato a togliere i <li> quei 4 puntini ma poi non stampa più iò subtotale.

Ho formattato anche questo ma non lo stampa

$("#titolocarrello").html("<div style=\"width: auto; height: auto; font-size: 2em; color: #008000; text-align: center;\">Il tuo Carrello<p>è vuoto</p></div>");

[NLSweb]

per togliere i puntini usa questo CSS

ul{
list-style-type:none;
}

il codice il blu da postato qui sopra non e' corretto

$("#titolocarrello").html("Il tuo Carrello");

se usi i CSS

#titolocarrello{
 width:auto;height:auto; /* se sono tutte e due auto a che ti serve definirle ? */
 font-size: 2em; color: #008000; text-align: center;
}

se non usi i CSS

$("#titolocarrello").css({"font-size":"2em","color":"#008000","text-align":"center"});

..........e sopratutto

Mammamia, che succede NLSweb

DON'T PANIC

Anche se metto così, non appare quando il carrello è vuoto

$("#titolocarrello").css({"font-size":"2em","color":"#008000","text-align":"center"});

Come mai che quando ricarico la pagina, sotto le immagini appare la scritta rossa e poi sparisce? Non può rimanere?