Stampare il totale costo in base alla quantità prodotto

Dalla funzione AZZERA

elimina la riga $(".prezzo").hide();
le scritte rosse rimaranno visibili

per il titolocarrello non ho ancora capito dove sia il problema

MI CORREGGO !!
queste righe lasciale

$("#inizio").html("€ 0");
$("#inizio button)").hide();


correggi pero' la seconda !

$("#inizio button").hide();

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

un altro problema..

il pulsante "Aggiungi al Carrello"

Codice:

---

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

---

riscrivilo cosi'

Codice:

---

<button class="aggiungi" onclick="AGGIUNGI(7)">Aggiungi al carrello</button>

---

Come puoi vedere titolocarrello è a posto, le scritte rosse però non appaiono, ho tolto $(".prezzo").hide();

continui a non inserire nel campo input della quantita il codice onchange='aggiornaQuantita("+id+")'
senza quando vari la quantita' non si aggiornano i calcoli...


c'e' l'hai anche negli style CSS

Codice:

---

.prezzo{
 visibility:hidden;
}

---

rimuovilo

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

il sub totale non ti appare perche' non hai cambiato la classe allo script con subTotale mod !! (gia' detto nel post#83)

C'è l'ho, l'avevo messo

<input class='quantity' type='number' name='quantity' min='0' value='1' onchange='aggiornaQuantita("+id+")'>


********************

Scusa, devo cambiare la classe qui?

<input class='subTotale mod' id='input-number-mod' type='numberDE' name='subTotale' value='0'>

ok .. ho rimosso la cache e ricaricato ... adesso lo vedo !

...ricordati di sistemare le classi per gli script (il sub totale)


ci siamo quasi..sta prendendo piede : )

ora vado a dormire ... ciao

- Ok, ho sistemato le classi (ho aggiunto mod) ma non è ancora a posto.

- Il pulsante Aggiungi al Carrello non si blocca dopo il primo click

- Il tasto Aggiunto non appare quando clicco su Aggiungi al carrello.

- Qui io ho provato ad inserire il codice isbn così, però vorrei mettergli un css (solo al codice isbn)

<input style="display: none;" type="text" class="NOME8" value="LIBRO8" | ISBN 978-88-89292-55-8>

alla funzione AGGIUNGI cambia

Codice:

---

  $("#prodotto"+id+" .aggiunto").show();
  $("#prodotto"+id+" .aggiungi").hide();

---

con il giusto ID

Codice:

---

  $("#infoProdotto"+id+" .aggiunto").show();
  $("#infoProdotto"+id+" .aggiungi").hide();

---

se vuoi personalizzare isbn ti consiglio di creare un campo input a parte


perche' i campi input del carello hanno questo TYPE ????

Codice:

---

type='numberDE'

---

che cosa e' ?

Ho letto che numberDE accetta i decimali, ma non appaiono.

Ho notato che se metto nel carrello più libri e poi li elimino, al successivo Aggiungi si ripresentano di nuovo tutti nel carrello.

Posso creare un novo input per isbn, devo poi modificare anche la funzione AGGIUNGI?




**********************

isbn risolto

metti number o al massimo text , per i campi input , poi tanto usiamo parseFloat per ritornare un numero con decimali..

se inserisci un nuovo input per isbn , devi poi andarti a riprendere al dato

quidi alla funzione AGGIUNGI avrai una cosa tipo

Codice:

---

var isbn= $(".ISBN"+id).val();
...
AGGIUNGIalCARRELLO(id,nome,prezzo,isbn);

---

e nella funzione AGGIUNGIalCARRELLO la variabile elemento (HTML formattato) ci aggiungerai il tuo dato come lo desideri

isbn l'avevo risolto (almeno quello).

Ho dovuto mettere text, se mettevo number mostrava i pulsantini, però andava bene anche numberDE

prova a levare ID che hai messo al campo input del prezzo (nel carrello)
id='input-number-mod'

penso che gli dia problemi per il calcolo del sub totale


al <div id='prodotto"+id+"'> aggiungi la classe merce

Codice:

---

<div id='prodotto"+id+"' class='merce'>

---

altrimenti lo svuota carello non funziona

Ho messo così e ho aggiunto in fondo un </div> e funziona

var elementi = "<div id='prodotto"+id+"'><div id='prodotto"+id+"' class='merce'>…</div></div>";

Ho provato a togliere la parte rossa, ma è uguale

<input class='moneyCarrello1 mod' id='input-number-mod' type='text' name='moneyCarrello1' value='"+prezzo+"'>

Questo comando nella funzione CALCOLAsubTotale

Codice:

---

var valore = parseFloat($("#prodotto"+id+" .moneyCarrello1 mod").val());

---

ritorna NaN

e non capisco ancora il perche'


---------


questo NON va bene ! crea doppioni di codice..

Codice:

---

var elementi = "<div id='prodotto"+id+"'><div id='prodotto"+id+"' class='merce'>…</div></div>";

---

usa

Codice:

---

var elementi = "<div id='prodotto"+id+"' class='merce'>......</div>";

---

Tutti ritornano NaN, come si può vedere, quando si aumenta un numero nella Q.tà, appare 0,00

L'unico che funziona è la percentuale che al terzo libro scatta a 20%

La quantita' funziona poiche' lo sconto viene eseguito... quello che non capisco ancora e' perche' non riesce a leggere il prezzo per calcolare il sub totale

prova a cambiare il type in number (del campo prezzo)


allora .... l'errore NaN dipende dal fatto che quando legge la stringa per convertirla in numero essa presenta dei caratteri invisibili
che danno l'errore.

prova ad eseguire un TRIM della stringa prima di convertirla

Codice:

---

var stringa = $("#prodotto"+id+" .moneyCarrello1 mod").val();
stringa = stringa.trim();
var valore = parseFloat(stringa);

---

questa prova falla se non cambi il campo input da text a number

Se metto number, da lo stesso risultato, inoltre mette i pulsantini.

Non stampa nemmeno i decimali, nonostante il parseFloat


****************

Mi viene in mente una cosa, il problema è iniziato con questo ultimo codice, col precedente non lo dava.
In questo ultimo è stata modificata questa parte

var valore = parseFloat($("#prodotto"+id+" .moneyCarrello1 mod").val());

la precedente aveva dentro anche il numero 2 (2)

lascia INPUT come TEXT

nella funzione AGGIUNGIalCARRELLO cambia

Codice:

---

...<input class='moneyCarrello1 mod' id='input-number-mod' type='text' name='moneyCarrello1' value='"+prezzo+"'>....

---

con

Codice:

---

...<input class='moneyCarrello1 mod' id='input-number-mod' type='text' name='moneyCarrello1' value='"+prezzo.toFixed(2)+"'>....

---

per ripristinare i decimali

--------------------------------
PICCOLO ESEMPIO
-------------------------------
dato un campo input TEXT con un numero con decimali
leggo il dato del campo
lo trasformo in numero float
lo inserisco in un DIV con un HTML formattato
rileggo lo stesso dato dal nuovo campo input
lo ritrasformo in numero float
ci sommo 1 ed eseguo un alert per vedere se fa la somma !
------------------------------

Codice HTML:

---

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  var c = parseFloat($("#costo").val()); 
  $("#cosa").append("<input class='prezzo' type='text' value='"+c.toFixed(2)+"'/>");
  var a = parseFloat($("#cosa .prezzo").val());
  a++;
  alert(a);
});
</script>
</head>
<body>
<input id="costo" type="text" value="21,00"/>
<div id="cosa"></div>
</body>
</html>

---

Ora appaiono, però qui appare sempre zero e non si sommano, qui non ho una variabile inserita come in moneyCarrello1

<input class='subTotale mod' id='input-number-mod' type='text' name='subTotale' value='0'>

non e' che per caso quello spazio che hai messo nel nome della classe gli da fastidio....
.subTotale mod

prova a farlo diventare

.subTotale-mod


e fallo per tutti i nomi e anche nelle funzioni script

mi sa che e' propio questo l'errore!!!

cambiando il piccolo esempio che ti ho fatto sopra , e mettendo uno spazio nel nome della classe

Codice HTML:

---

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  var c = parseFloat($("#costo").val()); 
  $("#cosa").append("<input class='prezzo mod' type='text' value='"+c.toFixed(2)+"'/>");
  var a = parseFloat($("#cosa .prezzo mod").val());
  a++;
  alert(a);
});
</script>
</head>
<body>
<input id="costo" type="text" value="21,00"/>
<div id="cosa"></div>
</body>
</html>

---

ESEMPIO mi NaN

Se il problema fosse il mod, allora lo darebbe anche qui, ma qui funziona


<input class='moneyCarrello1 mod' id='input-number-mod' type='text' name='moneyCarrello1' value='"+prezzo.toFixed(2)+"'>

il problema (come da esempio che ti ho illustrato sopra) e' LO SPAZIO nel nome
i due "Piccoli Esempi" sono identici tranne che per lo spazio nel nome della classe
il primo funziona , il secondo (dove c'e' lo spazio) ritorna NaN

....

Ora il subTotale appare, ho messo vari trattini a -mod, ma non appaiono i decimali e sotto c'è ancora NaN che sparisce quando si aumenta la quantità.

Ho notato anche che qui <input style="display: none;" type="text" class="PREZZO8" value="21.00"> devo mettere il punto, se metto la virgola non mostra i decimali

alla funzione CALCOLAsubTotale modifica

Codice:

---

$("#prodotto"+id+" .subTotale-mod").val(subtotale);

---

con

Codice:

---

$("#prodotto"+id+" .subTotale-mod").val(subtotale.toFixed(2));

---

per mostrare i decimali al sub totale


nella funzione AGGIUNGI
correggi questo

Codice:

---

var totaleacquisto = parseFloat($("#prodotto .totspesa").val());

---

con

Codice:

---

var totaleacquisto = parseFloat($("#areacalcolo .totspesa").val());

---

Va meglio, ho notato che se aumento la quantità, i decimali spariscono.

Volevo chiederti: è possibile trasformare il punto dei decimali in virgola?

Come nel post precedente devi mettere il comando toFixed alla funzione aggiornaQuantita

Codice:

---

$("#prodotto"+id+" .subTotale-mod").val(subtotale.toFixed(2));

---

Avevo provato anche io, ho che sbaglio qualcosa. Per la virgola non si può?

Poi, sto tentando di mettere il numero dei libri e non il costo, sopra in Vai al carrello, la variabile dovrebbe essere totquantita (magari sbaglio), non riesco a collocarla.

Per cambiare il riporto in alto dal prezzo alla quantita'
devi cambiare nella funzione CARRELLO
questa linea di comando

Codice:

---

$("#inizio").html("€ "+dapagare.toFixed(2));

---

in

Codice:

---

$("#inizio").html(totalequantita);

---

per la virgola ... i numeri decimali in JS sono definiti con il punto
l'unico modo e' quello di convertire il numero il testo , cercare il . e sostituirlo con la ,

Non ho capito la parte del numero di testo, dove lo trovo?

Citazione:

---

Originalmente inviato da gruppoalveo

Non ho capito la parte del numero di testo, dove lo trovo?

---

dopo aver eseguito i vari calcoli , prima di scrivere il risultato negli appositi campi
devi convertire il valore in una stringa , quindi usi la funzione JS .replace per trovare il . e modificarlo in ,
dopo aver fatto questo scrivi la stringa nel campo
esempio:

Codice:

---

var stringa = valore.replace(".", ",");

---

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

mi sembra che finalmente ci siamo ! :=):

Così andrebbe bene?

var stringa = totaleacquisto.replace(".", ",");
$("#carrello li:eq(0)").html("Totale prezzo pieno: € "+totaleacquisto.toFixed(2)+"");
...