Aiutino su un calcolo javascript in tempo reale

[guru of future]

Dovrei realizzare un calcolo in tempo reale che lavori cosi..
qualcuno è cosi gentile da darmi una mano?




1)Scelta select (numero fisso)
2)Scelta radio (aggiunge e toglie un valore)

totale: Totale aggiornato in base ai valori


<select>
**<optgroup label="prima scelta">
***<option value="#">---scegli---</option>
***<option value="#">1 opzione € 1.00</option>
***<option value="#">2 opzione € 2.00</option>
***<option value="#">3 opzione € 3.00</option>
**</optgroup>
**<optgroup label="seconda scelta">
***<option value="#">4 opzione € 4.00</option>
***<option value="#">5 opzione € 5.00</option>
***<option value="#">6 opzione € 6.00</option>
**</optgroup>
</select>
<input type="radio" name="primoradio" value="+2" > <strong>scelta radio1</strong><br>
<input type="radio" name="secondoradio" value="-2"> <strong>scelta radio2</strong><br>


GRAZIE MILLE!!!!

 

[Nefyt]

Ti ho scritto una piccola soluzione con jquery

$('select').change(function(){
      var add = parseInt($(this).find('option:selected').attr('value'));
      $('input[name=totale]').val('€ '+add.toFixed(2));
});
$('input:radio').change(function(){
    if($(this).is(':checked')) $('input[name=totale]').val('€ '
      +(parseInt($('input[name=totale]').val().substr(2))+parseInt($(this).val())).toFixed(2));
});

da applicare con ad esempio

<select>
<optgroup label="prima scelta">
<option value="#">---scegli---</option>
<option value="1">1 opzione € 1.00</option>
<option value="2">2 opzione € 2.00</option>
<option value="3">3 opzione € 3.00</option>
</optgroup>
<optgroup label="seconda scelta">
<option value="4">4 opzione € 4.00</option>
<option value="5">5 opzione € 5.00</option>
<option value="6">6 opzione € 6.00</option>
</optgroup>
</select><br>
<input type="radio" name="primoradio" value="+2" > <strong>scelta radio1</strong><br>
<input type="radio" name="secondoradio" value="-2"> <strong>scelta radio2</strong><br>
<input type='text' name='totale' value='€ 0.00' disabled>

Forse è migliorabile ma comunque funziona bene

 

[guru of future]

Quasi perfetta!!!

GRAZIE MILLE!!!

è quasi perfetta!!!
ho notato che se cambio la select, poi la radio e ok ma se intervengo nuovamente sulla select la radi oin posizione non funziona piu..
e fixabile ?

Ti ho scritto una piccola soluzione con jquery

$('select').change(function(){
      var add = parseInt($(this).find('option:selected').attr('value'));
      $('input[name=totale]').val('€ '+add.toFixed(2));
});
$('input:radio').change(function(){
    if($(this).is(':checked')) $('input[name=totale]').val('€ '
      +(parseInt($('input[name=totale]').val().substr(2))+parseInt($(this).val())).toFixed(2));
});

da applicare con ad esempio

<select>
<optgroup label="prima scelta">
<option value="#">---scegli---</option>
<option value="1">1 opzione € 1.00</option>
<option value="2">2 opzione € 2.00</option>
<option value="3">3 opzione € 3.00</option>
</optgroup>
<optgroup label="seconda scelta">
<option value="4">4 opzione € 4.00</option>
<option value="5">5 opzione € 5.00</option>
<option value="6">6 opzione € 6.00</option>
</optgroup>
</select><br>
<input type="radio" name="primoradio" value="+2" > <strong>scelta radio1</strong><br>
<input type="radio" name="secondoradio" value="-2"> <strong>scelta radio2</strong><br>
<input type='text' name='totale' value='€ 0.00' disabled>

Forse è migliorabile ma comunque funziona bene

 

[Fez Vrasta]

Io non ho neanche capito cosa vuoi ottenere :\

 

[Nefyt]

Cosi il problema dovrebbe essere risolto

$('select').change(function(){
      var add = parseInt($(this).find('option:selected').attr('value'));
    $('input[type=radio]:checked').each(function(i,v){
       add+=parseInt($(v).val());
    });
    $('input[name=totale]').val('€ '+add.toFixed(2));
});
$('input:radio').change(function(){
    if($(this).is(':checked'))
        $('input[name=totale]').val('€ '
      +(parseInt($('input[name=totale]').val().substr(2))+parseInt($(this).val())).toFixed(2));
});

Io non ho neanche capito cosa vuoi ottenere :\

Fez non spammare messaggi poco chiari o inutili

 

[Fez Vrasta]

Non è poco chiaro o inutile. Ho chiesto chiarimenti dato che la sua domanda è alquanto criptica.

 

[guru of future]

Nefyt grazie mille

Ciao Nefyt e grazie mille per i uoi interventi riguardo questa mia domanda
inutile dire quanto rapido, utile e ottimi siano stati per me i tuoi interventi!!

ho visto l'ultimo script che però non mi funziona come dovrebbe
in sostanza il problema sta nel fatto che la prima volta che seleziono il valore con la select
e imposto la scelta radio somma e toglie valori diversi da quelli settati nel value..

mi spiego meglio..
h**p://jsfiddle.net/WwqY3/

vado sulla select e scelgo il primo valore 1€, poi clicco sulla prima scelta radio
dovrebbe fare 1+2 =3
invece mi restituisce 5

se muovo la select nuovamente torna giusto ..
e mi restituisce i valori corretti..

non vorrei chiederti troppo ma apprezzo davvero tanto il tuo aiuto!
ps.. che valore dovrei mettere per avere una radio con valore neutro? ovvero che non aumenta e non diminuisce?

GRAZIE MILLE PER IL SUPPORTO!!!

Cosi il problema dovrebbe essere risolto

$('select').change(function(){
      var add = parseInt($(this).find('option:selected').attr('value'));
    $('input[type=radio]:checked').each(function(i,v){
       add+=parseInt($(v).val());
    });
    $('input[name=totale]').val('€ '+add.toFixed(2));
});
$('input:radio').change(function(){
    if($(this).is(':checked'))
        $('input[name=totale]').val('€ '
      +(parseInt($('input[name=totale]').val().substr(2))+parseInt($(this).val())).toFixed(2));
});

Fez non spammare messaggi poco chiari o inutili

 

[Nefyt]

A me funziona correttamente, probabilmente non ti funziona perché hai lasciato il codice precedente, infatti guarda http://jsfiddle.net/WwqY3/1/


ps: se ti serve solo per una checkbox(dal nome univoco intendo) è abbreviabile il codice

 

[guru of future]

Provo a riassumerti cosa faccio..

vado sulla select e seleziono un valore, vado sul radio e ne scelgo uno, cambio nuovamente la select, i radio sono ora sfalsati
panic?
http://jsfiddle.net/WwqY3/3/

A me funziona correttamente, probabilmente non ti funziona perché hai lasciato il codice precedente, infatti guarda http://jsfiddle.net/WwqY3/1/


ps: se ti serve solo per una checkbox(dal nome univoco intendo) è abbreviabile il codice

 

[Nefyt]

Provo a riassumerti cosa faccio..

vado sulla select e seleziono un valore, vado sul radio e ne scelgo uno, cambio nuovamente la select, i radio sono ora sfalsati
panic?
http://jsfiddle.net/WwqY3/3/

Hai ragione l'ho notato solo ora, fra poco te lo sistemo e posto.

 

[guru of future]

Nefyt ti ringrazio davvero tanto, sei davvero gentile

Hai ragione l'ho notato solo ora, fra poco te lo sistemo e posto.

 

[Nefyt]

Cosi funziona fammi sapere se riscontri altri problemi

$('select').change(function(){
      		var add = parseInt($(this).find('option:selected').attr('value'));
            var check = parseInt($('input[name=primoradio]:checked').val());
         if(!isNaN(check))   add += check;
    		$('input[name=totale]').val('€ '+add.toFixed(2));
		});
		
$('input[name=primoradio]').change(function(){
            var v = parseInt($('select option:selected').attr('value'));   		    
                $('input[name=totale]').val('€ '+                                       ((isNaN(v)?0:v)+parseInt($(this).val())).toFixed(2));
		});

http://jsfiddle.net/mzShr/3/

 

[guru of future]

Nefyt ti ringrazio davvero tanto, funziona perfettamente!!
come faccio a passare la variabile in un altra pagina?

credevo di riuscire con php ma in effetti quando ci lavora javascript è già via per un caffè ..

Cosi funziona fammi sapere se riscontri altri problemi

$('select').change(function(){
      		var add = parseInt($(this).find('option:selected').attr('value'));
            var check = parseInt($('input[name=primoradio]:checked').val());
         if(!isNaN(check))   add += check;
    		$('input[name=totale]').val('€ '+add.toFixed(2));
		});
		
$('input[name=primoradio]').change(function(){
            var v = parseInt($('select option:selected').attr('value'));   		    
                $('input[name=totale]').val('€ '+                                       ((isNaN(v)?0:v)+parseInt($(this).val())).toFixed(2));
		});

http://jsfiddle.net/mzShr/3/

 

[Nefyt]

Utilizza l'ajax se non vuoi il classico submit con refresh, esempio

$.post('pagina.php',$('form').serialize(),function(output){
        alert(output);
});

Ovviamente devi gestirlo a seconda dell'evento che ti serve

 

[guru of future]

Mi si è presentato un altro problema

nella scelta radio dovrà esserci anche "consegna a domicilio"
questo "importo" cambia a seconda del prodotto selezionato nella select PA NI C

se e selezionata l'opzione 1 addiziona 2€
se e selezionata l'opzione 2 addiziona 3€
se e selezionata l'opzione 3 addiziona 4€
dalla 4 in poi addiziona 5 €

reference: http://jsfiddle.net/mzShr/4/

Utilizza l'ajax se non vuoi il classico submit con refresh, esempio

$.post('pagina.php',$('form').serialize(),function(output){
        alert(output);
});

Ovviamente devi gestirlo a seconda dell'evento che ti serve

 

[Nefyt]

Mi si è presentato un altro problema

nella scelta radio dovrà esserci anche "consegna a domicilio"
questo "importo" cambia a seconda del prodotto selezionato nella select PA NI C

se e selezionata l'opzione 1 addiziona 2€
se e selezionata l'opzione 2 addiziona 3€
se e selezionata l'opzione 3 addiziona 4€
dalla 4 in poi addiziona 5 €

reference: http://jsfiddle.net/mzShr/4/

Intendi cosi?

$('select').change(function(){
      		var add = parseInt($(this).find('option:selected').attr('value'));
    $('input[name=primoradio]').eq(0).attr('value',((add>=4)?'+5':'+'+(add+1)));
            var check = parseInt($('input[name=primoradio]:checked').val());
         if(!isNaN(check))   add += check;
    		$('input[name=totale]').val('€ '+add.toFixed(2));
		});
		
$('input[name=primoradio]').change(function(){
            var v = parseInt($('select option:selected').attr('value'));   		    
                $('input[name=totale]').val('€ '+                                       ((isNaN(v)?0:v)+parseInt($(this).val())).toFixed(2));
		});

http://jsfiddle.net/mzShr/26/