Stampare il totale costo in base alla quantità prodotto

25-09-2014, 22.59.17

Così va quasi bene, scompare solo il pulsante ma non il prodotto Vedo che il pulsante Aggiungi scompare al click, ho "creato" uno codice in js che trasforma il pulsante in un altro. Funziona però solo su un pulsante, se lo applico a tutti gli 8, non funziona, non so trasformalo in jQuery.

Codice PHP:



<script>
document.getElementById("aggiunto").onclick = function() {myFunction()};

function myFunction() {
    document.getElementById("aggiunto").innerHTML = "Aggiunto!";
    document.getElementById("aggiunto").style.background = "#ffff00";
    document.getElementById("aggiunto").style.color = "#ff0000";
}
</script>

…

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

**NLSweb** · 25-09-2014, 23.41.00

Quindi vuoi che quando si prema il pulsante AGGIUNGI questo invece du scomparire (come mi avevi chiesto prima) si trasformi in AGGIUNTO
ma senza funzione pulsante ..giusto ?!

ecco l'esempio (e siamo arrivati a quota 10... : )

25-09-2014, 23.55.11

Così, va bene, per stasera me lo adatto con i css. Domani se vuoi facciamo l'ultimo ritocco, la percentuale di sconto in base alla quantità che compra (vedi scritta in rosso sopra). Io sono qui se vuoi puoi farlo anche adesso, vedi tu.

26-09-2014, 00.01.25

Una cosa, quel numero 2 che metti per la quantità, si può sostituire con un simbolo che non ha un limite di quantità?

var numeroMERCI = 2;

**NLSweb** · 26-09-2014, 00.02.04

adesso ti preparo lo sconto... ma non mi e' chiara una cosa ...
1 o 2 libri 15% ????

significa che 1 libri ho il 15% ... vale a dire che tutti i prezzi sono gia' scontati del 15% ???

dovrebbe essere : due libri 15% dal terzo in poi 20%

aggiornami cosi ti preparo il calcolo

ps

ma eseguo direttamente il calcolo..o vuoi una voce a parte aggiunta che lo evidenzi ?
tipo
prodotto X prezzo 100 quantita 3 sconto 20% sub totale 240

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

Originalmente inviato da gruppoalveo

Una cosa, quel numero 2 che metti per la quantità, si può sostituire con un simbolo che non ha un limite di quantità?

var numeroMERCI = 2;

??? ehhmmm .. var numeroMerici NON E' la quantita' !!
ma il numero di prodotti che elenchi (nel tuo caso il numero di libri in vendita)

26-09-2014, 00.23.07

Si, appunto, mettiamo che ne ho tanti in vendita o nel carrello, non sto lì a cambiare sempre il numero…allora posso mettere 1000.

Riguardo allo sconto: si, tutti sono scontati del 15%, dal terzo in poi diventa il 20%.

Come voce puoi mettere:

…

TOT € 56.00

Sconto quantità x 1 libro -15%
Sconto quantità x 2 libr1 -15%

Sconto quantità x 3 libri -20%
ecc.

TOT SCONTATO €…

**NLSweb** · 26-09-2014, 01.34.05

Ecco l'esempio con lo sconto...

26-09-2014, 01.55.42

Va meglio, però fai una cosa più semplice, stai facendo già molto, in modo che il cliente capisce al volo. Così va bene:

Nel Carrello (2)
Vuota il Carrello

Il tuo Carrello (se vuoto, Il Carrello è vuoto)

Prezzo: € 30,00 Q.tà: 1 Tot: € 30,00 Elimina
Prezzo: € 40,00 Q.tà: 1 Tot: € 40,00 Elimina

TOT: € 70,00

Sconto 15%, (Risparmio € 10,50) (dal terzo libro passa al 20%)

Costo spedizione: € 0 (per l'Italia)

DA PAGARE: € 59,50

Vuota il Carrello

Poi una cosa: quando clicco su Aggiungi al carrello, si stampano nel carrello in modo sequienziale cioè: se clicco sul libro 5 e poi sul 2, si stampa libro2 poi libro5, fa in modo che si stampano nella sequenza per come vengono cliccati, cioè Libro5 poi Libro2

**NLSweb** · 26-09-2014, 23.45.23

ecco... ho fatto cosi' tante modifiche che il codice si e' incasinato....
quindi lo riscritto da capo (migliorandolo) ...

ESEMPIO

26-09-2014, 23.58.35

I css me li sistemo io, qui Nel Carrello € 25.93 penso che cambiando qualcosa esce il numero degli item, vedo io.

Così dovrebbe andar bene. Se c'è qualcosa ti avviso. Grazie intanto.

27-09-2014, 01.37.06

L'hai modificato molto, non mi ci trovo, con tutti qugli ul, li.

Io in pratica devo inserire questi nel carrello

Codice PHP:


<div class="carrello">
<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><!---Carrello->

Ecc.

**NLSweb** · 27-09-2014, 13.54.01

Si... lo dovuto modificare completamente poiche' le richieste che hai avanzato stravolgevano la struttura logica di come era impostato

ti spiego brevemente come funziona adesso , non e' complicato ..
HTML Struttura
ci sono tre parti: inizio , DescrizioneProdotti , ListaProdotti
inizo - e' la sezione che contiene NEL CARRELLO con l'ammontare netto della spesa e il pulsante vuota carrello
DescrizioneProdotti - l'area in cui mostri i prodotti in vendita
ListaProdotti - l'elenco di quello che compri e metti nel carrello

in dettaglio:

Inizio
ci sono tre elementi definiti in una lista (UL LI) che sono rispettivamente il testo,l'ammontare e il pulsante vuota carrello
puoi inserire l'intero DIV dove vuoi e personalizzarne l'aspetto CSS

DescrizioneProdotti
qui ogni prodotto ha un suo DIV che raggruppa tutte le info , questo ha una classe ed un ID (class="prodotto" id="descrizioneProdottoX")
all'interno c'e' una lista che contiene tre macro elementi: class="nome" , class="aggiungi" , class="aggiunto"
il primo elemento ci inserisci tutta la descrizione , le foto e quello che vuoi
il secondo elemento contiene il pulsante "Aggiungi al Carrello"
il terzo elemento contiene la dicitura "Aggiunto !"
fuori dalla lista ma sempre nel DIV del prodotto infine ho dovuto aggiungere un campo input (invisibile) che contiene il prezzo unitario class="prezzo"

ListaProdotti
ha tre DIV :
il primo id="contenutoCarrello" e' vuoto poiche' quando aggiungi al carrello un prodotto questo viene creato ed inserito (in modo da rispettare l'ordine con cui si scelgono i prodotti)
il secondo id="carrello" contiene una lista con 4 voci che sono il riassunto a pie' di pagina degli acquisti , quindi (1) il totale senza sconto , (2) lo sconto applicato , (3) i costi di spedizione , (4) il totale scontato
sempre in questo secondo div ma fuori dalla lista c'e' poi il pulsante vuota il carrello
il terzo id="areacalcolo" e' un DIV invisibile con due campi input necessari per eseguire tutti i calcoli

tra DescrizioneProdotti e ListaProdotti , poi ho inserito un div id="titolocarrello" con la descrizione "il carrello e' vuoto" / "Il tuo Carrello"

l'aspetto CSS puoi modificarlo come vuoi ed all'interno della lista puoi aggiungere le voci che desideri , ma cerca di rispettare ID CLASS e struttura come ti ho indicato per far funzionare bene gli script.

Ho creato 9 funzioni SCRIPT , come potrai vedere fanno riferimento agli ID a Class e LIST che ti ho indicato
in particolare devi guardare AGGIUNGIalCARRELLO questa e' la funzione che si occupa di creare il DIV prodotto che viene acquistato ed inserito nel carrello; noterai la variabile elementi contiene una struttura HTML del prodotto
quindi DIV id prodottoX class merce ; al suo interno avrai la stessa struttura dei vecchi esempi:
-il nome del prodotto acquistato class='NomeProdotto'
-i tre campi input : prezzo , quantita , sub totale
-ed il pulsante Elimina

chiaramente anche qui puoi modificare come vuoi i CSS basta che mantiene la struttura con ID e Class

ho eliminato la variabile il numero dei prodotti (quella che mi chiedevi di impostare a 1000) adesso non serve piu'

se hai bisogno di aiuto per implementarlo con il tuo codice fammi sapere...

27-09-2014, 14.12.19

Un po' ho capito. I codici che mi avevi fatto precedentemente era più semplice ed ero in grado di modificarlo. Io nel mio codice che ho nel sito, non ho messo ul e li eppure è proprio come vorrei (css e struttura), ma questo lo posso fare io, basta che mi semplifichi il codice.

Non potresti modificare il tuo, togliendo ul, li, id, quello che è, in modo che poi mi è più comprensibile e modificabile?

**NLSweb** · 27-09-2014, 14.52.22

ho eliminato tutti i CSS (lasciando solo i due per gli elementi che devono essere invisibili)

ed ho eliminato gran parte delle liste (lasciando solo quella del riepilogo economico a pie' di pagina)

spero sia piu' semplice comprenderlo adesso...

mi raccomando se modifichi una classe o un id di quelli che sono indicati in HTML
devi modificarli acnhe negli script !

esempio la cambio la classe "descrizioneProdottoX" in "qualcosaX"
negli script ogni volta che sia presente quella classa sostituiscila con la nuova
$("#descrizioneProdotto"+id+" .aggiunto").hide(); ---> $("#qualcosa"+id+" .aggiunto").hide();

ESEMPIO SEMPLIFICATO

27-09-2014, 15.03.51

Ok, ti faccio sapere.

Questi li a cosa servono?

<div id="carrello">
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>

**NLSweb** · 27-09-2014, 15.08.30

Come ti dicevo contengono il riassunto economico a pie di pagina
(1) il totale senza sconto
(2) lo sconto applicato
(3) i costi di spedizione
(4) il totale scontato

27-09-2014, 15.14.50

Non sapevo che 2 semplici <li> potessero fare da echo

27-09-2014, 15.32.09

Qui c'è una cosa che non capisco, questo tuo codice

Codice PHP:


 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);  

  }

come lo modifico per far richiamare il mio

Codice PHP:


<!-- INIZIO CARRELLO --> 

<div class="carrello">

<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>

Il resto vedo io

**NLSweb** · 27-09-2014, 16.07.46

Questa e' la funzione che aggiunge al carrello i prodotti desiderati

quindi la variabile elementi deve contenere tutto la formattazione HTML che vuoi che appaia nel carrello

alla funzione passo tre argomenti ID , NOME , PREZZO

che sono rispettivamente:
ID = l'identificativo del prodotto
NOME = descrizione del prodotto
PREZZO = prezzo del prodotto

se noti questa funzione viene eseguita dalla funzione AGGIUNGI(id) associata al pulsante "Aggiungi al Carrello"
e i restanti argomenti funzione sono estratti da

Codice:

   var nome = $("#descrizioneProdotto"+id+" .nome").html();
   var prezzo = parseFloat($("#descrizioneProdotto"+id+" .prezzo").val());

esempio:

Codice HTML:

var elementi = "
<div id='prodotto"+id+"'><p class="nomeLibro">"+nome+"<br><br>
<span class='moneyCarrello'>€ </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>  
";

Non sapevo che 2 semplici <li> potessero fare da echo

i LI come ogni elemento HTML puo' essere controllato con DOM , quindi io gli assegno al loro interno le info che voglio pubblicare

27-09-2014, 21.31.23

Non riesco a venirne fuori, eppure con i codici precedenti riuscivo, è questa parte che non riesco a far richiamare il mio codice:

Codice PHP:


 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/>quantity<input class='quantity' type='number' min='0' value='1' name='quantity' onchange='aggiornaQuantita("+id+")'/>Costo €<input class='subtotale' type='number' value='0' disabled/><button onclick='ELIMINA("+id+")'>Elimina</button></div></div>";
   $("#contenutoCarrello").append(elementi);  
  }  */ //QUESTO SOPRA E' IL TUO

var elementi = "<div id='prodotto"+id+"'><p class="nomeLibro">"+nome+"<br><br><span class='moneyCarrello'>€ </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>";
 
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");
  }

**NLSweb** · 28-09-2014, 00.20.07

Stai attento ai doppi apici ed agli apici ... tu stai assegnado una stringa html ad una variabile

quindi parti da

Codice:

var elementi = "...";

i doppi apici li usi per definire la variabile
se devi innestare degli elementi esterni alla tua variabile usi i doppi apici e i +
quindi avrai

Codice:

var elementi = "...."+elemento+".....";

se all'interno della stringa hai dei doppi apici li sostituisci con gli apici

Codice:

var elementi = "<div id='....' >";

partendo da questi presupposti vediamo la tua definizione
la sconpongo in piu righe in modo da semplificare la lettura

Codice:

var elementi = "
<div id='prodotto"+id+"'>
<p class='nomeLibro'>
"+nome+"
<br><br><span class='moneyCarrello'>€ </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>
";

se puoi essere piu' specifico su quale problema riscontri , riesco ad aiutarti meglio ...

28-09-2014, 00.38.31

C'erano 2 apici doppi òi ho trasformati in singoli, ma non ha risolto. Il problema è che cliccando sul pulsante Aggiungi al carrello, non appare niente nel carrello

Codice PHP:


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>";

**NLSweb** · 28-09-2014, 00.48.54

Se posti il link e' meglio...

allora..
tui hai questa funzione che
- definisce la porzione di HTML che descrive il prodotto da mettere nel carrello
- aggiunge HTML al DIV del carrello

Codice:

function AGGIUNGIalCARRELLO(id,nome,prezzo){

   var elementi = "..................";

   $("#contenutoCarrello").append(elementi);  

}

se non ti appare niente non credo che il problema sia nella definizione della variabile
ma forse altrove dove mostri / nascondi il carrello
quindi nella funzione AGGIUNGI devi verificare che questa line di codice

$(".ListaProdotti").show();

abbia la classe coretta con il DIV che contiene il dati del carrello

puoi anche usare il debug del browser per controllare che effettivamente il prodotto sia nel carrello (anche se invisibile)

28-09-2014, 01.06.02

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

Codice PHP:


<!-- INIZIO CARRELLO --> 

<div class="carrello">

<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>

**NLSweb** · 28-09-2014, 01.11.04

usando il Debug mi dice che la funzione AGGIUNGI non e' definita

andando a vedere il sorgente .. la funzione NON C'E' !!

dove sono le 9 ! funzioni script ? (tra cui AGGIUNGI ?)

28-09-2014, 01.27.38

C'è nella index, il codice è in formG, ma la index lo richiama


<?php
include ("ordine/formG.php");
?>

Questo è nella index

Codice PHP:


<div id="descrizioneProdotto8">

<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** · 28-09-2014, 01.40.45

io analizzo con il DEBUG il codice generato , e NON CI SONO GLI SCRIPT
gli unici <script> che ci sono, sono questi:

Codice:

<script>
$(document).ready(function(){
  function CALCOLA(id){
   var moneyCarrello1 = $("#prodotto"+id+" .moneyCarrello1").val();
   var quantity = $("#prodotto"+id+" .quantity").val();
   var costo = quantity * moneyCarrello1; 
   $("#prodotto"+id+" .subTotale").val(costo.toFixed(2)); //Mette i decimali
    return parseFloat(costo);
  }
  
  function CARELLO(){
   var numeroMERCI = 8; //Quantità dei libri in vendita
   var totale = 0;
   for(i=1;i<=numeroMERCI;i++){
    totale += CALCOLA(i);
   }
   $("#carrello .totale").val(totale.toFixed(2)); //Mette i decimali
  }
  
  $("input").change(function(){  
   CARELLO();
   
  });
});   

function ELIMINA(id){
   $("#prodotto"+id+" .quantity").val("0");
   $("#prodotto"+id+" .subTotale").val("0");
   CARELLO();
}
</script>

che sono quelli vecchi !!!!

quando ho riscritto il codice ci sono 9 funzioni script (tra cui anche AGGIUNGI)

quando clicco sul tuo pulsante "Aggiungi al Carrello" lui chiama la funzione AGGIUNGI con onclick , ma la CONSOLE mi da ERRORE poiche' la funzione NON C'E' nel codice

28-09-2014, 01.54.25

Questo è tutto il codice che ho, una parte l'ho commentata per non creare possibili conflitti

Codice PHP:


<script>  

$(document).ready(function(){

  AZZERA();    

});

 

  function AZZERA(){  

   $(".ListaProdotti").hide();

   $(".aggiunto").hide();

   $(".aggiungi").show();

   $("#inizio p").html("€ 0");

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

   $(".prezzo").hide();

   $("#titolocarrello").html("Il Carrello è vuoto");

   $("#areacalcolo .totquantita").val("0");

   $("#areacalcolo .totspesa").val("0");

  }

  

  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/>quantity<input class='quantity' type='number' min='0' value='1' name='quantity' 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>";

  

  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");

  } 

  

  function CARRELLO(){

   var totalequantita = parseInt($("#areacalcolo .totquantita").val());

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

   if(totalequantita>2){

    var percentosconto = 20;

   }else{

    var percentosconto = 15;

   }

   var totalesconto = (totaleacquisto/100)*percentosconto;

   var dapagare = totaleacquisto - totalesconto;

   $("#carrello li:eq(0)").html("Totale € "+totaleacquisto.toFixed(2));

   $("#carrello li:eq(1)").html("Sconto del "+percentosconto.toFixed(2)+"% (Risparmio €"+totalesconto.toFixed(2)+")");

   $("#carrello li:eq(2)").html("Costo spedizione: € 0 (per l'Italia)");

   $("#carrello li:eq(3)").html("DA PAGARE € "+dapagare.toFixed(2));

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

  }

  

  function aggiornaQuantita(id){

   var quantita = parseInt($("#prodotto"+id+" .quantita").val());

   var prezzo = parseFloat($("#prodotto"+id+" .costo").val());

   var subtotale = quantita * prezzo;

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

   calcolaCarrello();

  }

  

  function calcolaCarrello(){

   var totalequantita = 0;

   var totaleacquisto = 0;

   $(".subtotale").each(function(){

      totaleacquisto += parseFloat($(this).val());

   });   

   $(".quantita").each(function(){

      totalequantita += parseInt($(this).val());

   });

   $("#areacalcolo .totquantita").val(totalequantita);

   $("#areacalcolo .totspesa").val(totaleacquisto);

   CARRELLO();

  }

  

  function ELIMINA(id){

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

   var quantita = parseFloat($("#prodotto"+id+" .quantita").val());

   $("#prodotto"+id).remove();

   var totalequantita = parseInt($("#areacalcolo .totquantita").val());

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

   totalequantita-=quantita;

   totaleacquisto-=valore;

   $("#areacalcolo .totquantita").val(totalequantita);

   $("#areacalcolo .totspesa").val(totaleacquisto);

   if(totalequantita==0){

    AZZERA();

   }else{

    $("#descrizioneProdotto"+id+" .aggiunto").hide();

    $("#descrizioneProdotto"+id+" .aggiungi").show();

    CARRELLO();

   }

  }

  

  function SVUOTA(){

   $(".merce").each(function(){

      $(this).remove();

   });

   AZZERA();

  }

</script>

<style>

#areacalcolo{

 visibility:hidden;

}

.prezzo{

 visibility:hidden;

}

</style>

</head>

<body>



<!--PRIMA PARTE-->

<div id="inizio">

Nel Carrello<p></p>

<button onclick="SVUOTA()">Vuota il Carrello</button>

</div>



<!--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>-->



<!--TERZA PARTE CARRELLO-->

<div id="titolocarrello"></div>



<div class="ListaProdotti">

<div id="contenutoCarrello"></div>

<div id="carrello">

<ul>

<li></li>

<li></li>

<li></li>

<li></li>

</ul>

<button onclick="SVUOTA()">Vuota il Carrello</button>

</div>

</div>

<div id="areacalcolo">

<input class="totquantita" type="number" value="0" disabled/>

<input class="totspesa" type="number" value="0" disabled/>

</div>

**NLSweb** · 28-09-2014, 02.09.08

Estratto dall'ultimo esempio semplificato che ti ho postato

Codice PHP:


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<script>  

$(document).ready(function(){

  AZZERA();    

});

 

  function AZZERA(){  

   $(".ListaProdotti").hide();

   $(".aggiunto").hide();

   $(".aggiungi").show();

   $("#inizio p").html("€ 0");

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

   $(".prezzo").hide();

   $("#titolocarrello").html("Il Carrello è vuoto");

   $("#areacalcolo .totquantita").val("0");

   $("#areacalcolo .totspesa").val("0");

  }

  

  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);  

  }

  

  function CALCOLAsubTotale(id){

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

   var quantita = parseFloat($("#prodotto"+id+" .quantita").val());

   var subtotale = valore * quantita;

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

  }

  

  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");

  } 

  

  function CARRELLO(){

   var totalequantita = parseInt($("#areacalcolo .totquantita").val());

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

   if(totalequantita>2){

    var percentosconto = 20;

   }else{

    var percentosconto = 15;

   }

   var totalesconto = (totaleacquisto/100)*percentosconto;

   var dapagare = totaleacquisto - totalesconto;

   $("#carrello li:eq(0)").html("Totale € "+totaleacquisto.toFixed(2));

   $("#carrello li:eq(1)").html("Sconto del "+percentosconto.toFixed(2)+"% (Risparmio €"+totalesconto.toFixed(2)+")");

   $("#carrello li:eq(2)").html("Costo spedizione: € 0 (per l'Italia)");

   $("#carrello li:eq(3)").html("DA PAGARE € "+dapagare.toFixed(2));

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

  }

  

  function aggiornaQuantita(id){

   var quantita = parseInt($("#prodotto"+id+" .quantita").val());

   var prezzo = parseFloat($("#prodotto"+id+" .costo").val());

   var subtotale = quantita * prezzo;

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

   calcolaCarrello();

  }

  

  function calcolaCarrello(){

   var totalequantita = 0;

   var totaleacquisto = 0;

   $(".subtotale").each(function(){

      totaleacquisto += parseFloat($(this).val());

   });   

   $(".quantita").each(function(){

      totalequantita += parseInt($(this).val());

   });

   $("#areacalcolo .totquantita").val(totalequantita);

   $("#areacalcolo .totspesa").val(totaleacquisto);

   CARRELLO();

  }

  

  function ELIMINA(id){

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

   var quantita = parseFloat($("#prodotto"+id+" .quantita").val());

   $("#prodotto"+id).remove();

   var totalequantita = parseInt($("#areacalcolo .totquantita").val());

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

   totalequantita-=quantita;

   totaleacquisto-=valore;

   $("#areacalcolo .totquantita").val(totalequantita);

   $("#areacalcolo .totspesa").val(totaleacquisto);

   if(totalequantita==0){

    AZZERA();

   }else{

    $("#descrizioneProdotto"+id+" .aggiunto").hide();

    $("#descrizioneProdotto"+id+" .aggiungi").show();

    CARRELLO();

   }

  }

  

  function SVUOTA(){

   $(".merce").each(function(){

      $(this).remove();

   });

   AZZERA();

  }

</script>

28-09-2014, 02.14.05

So che il tuo funziona, ma il problema è che non riesco farlo sui miei codici

Discussione: Stampare il totale costo in base alla quantità prodotto

LinkBack

Strumenti discussione

Display

Regole di scrittura