ugrás a tartalomhoz

Több Select-ből adatok kinyerése

cszlak · 2014. Okt. 10. (P), 09.17
Sziasztok.

Olyan problémám lenne, hogy van több dinamikusan létrejövő Select-em és Inputom.
Szeretnék adatokat kinyerni belőlük.

html:

<script type="text/javascript">
function szamolo() {    
	var price = 0; 
	var units=0;
	var vat=0;
	var id = 0;
	var teszt =0;	

 $('.product').each(function() {   
 id += parseFloat( $(this).val() ); 
 price += parseFloat ($('.product').find('option:selected').attr("id"));
 vat += parseFloat   ($('.product').find('option:selected').attr('class'));
  //teszt +=  parseFloat ($('.product').find('option:selected').attr("id"));
 } );
 $('.units').each(function() {      units += parseFloat( $(this).val() ); } );
 var szorzat = price * units;
 alert(id+': '+price + ' * '+units+ ' = '+szorzat+' | Vat:'+vat+' | teszt:'+teszt);
  $('#net_amount').prev('input').val(szorzat);
}; 	
</script>


<form action="button2.php" method="post" enctype="multipart/form-data"  
role="form" id="TextForm">
 <div class="form-group" style="padding-bottom:30px;" >
 <select class="form-control product" name="product[]" id="product"  style="width: 60%;" onChange="szamolo();">
  <option    selected="selected"    value="1" id="100" class="12.5">name100</option>
  <option      value="2"  id="200"  class="13">name200</option>
  <option      value="4"  id="300"  class="13">name300</option>
</select> 
<input style="width: 50%; float:left;" name="unit[]" id="unit" type="text"  value="0"  class="form-control units" onChange="szamolo();" >
</div>
 <div class="form-group" style="padding-bottom:30px;" >
 <select class="form-control product" name="product[]" id="product"  style="width: 60%;" onChange="szamolo();">
  <option    selected="selected"    value="1" id="100" class="12.5">name100</option>
  <option      value="2"  id="200"  class="13">name200</option>
  <option      value="4"  id="300"  class="13">name300</option>
</select> 
<input style="width: 50%; float:left;" name="unit[]" id="unit" type="text"  value="0"  class="form-control units" onChange="szamolo();" >
</div>
Jelenleg a 'price' értéket duplán veszi be.
Gondolom ez a sor hibás:

 price += parseFloat ($('.product').find('option:selected').attr("id"));
ha lecserélem erre:

 price += parseFloat ($(this).find('option:selected').attr("id"));
Akkor NaN -t ad ki.
‹ ExtJS licenselés Parallax design ›
 ■
1

Mit ad vissza a

Poetro · 2014. Okt. 10. (P), 10.24
Mit ad vissza a $(this).find('option:selected').attr("id") ? Szerintem undefined-ot, ami miatt lesz NaN. Ezt az is okozhatja, hogy egyik sincs kiválasztva, vagy a kiválasztottnak nincs id attribútuma, vagy az nem szám. Jó lenne előbb kiíratni, hogy miket sikerült kiválasztani, és azoknak mi az id attribútuma. Ehhez legegyszerűbb a console.log-ot illetve a böngészőbe épített debugger-t használni.
3

console.log

cszlak · 2014. Okt. 10. (P), 10.45
kék karika 2 és 100
2

jsfiddle

Endyl · 2014. Okt. 10. (P), 10.32
Kicsit átkozmetikáztam jsfiddle-re; this-t használva sem ír NaN-t nálam, hacsak nem hagyom valamelyik mezőt üresen.

Meg amit Poetro írt; lépkedj végig a böngésző debuggerével a kódon, és meglátod, hogy mindenhol olyan értéket kapsz-e, mint amire számítasz.
4

Ez az hogy nem

cszlak · 2014. Okt. 10. (P), 10.49
Az első select dupla értéket ad, a többi meg simát.
5

Meg van a hiba

cszlak · 2014. Okt. 10. (P), 11.03
Egész más volt a probléma forrása, de a consol.log jó tipp volt.

A sorokat generáltam, és az új sorhoz mintát adtam meg neki (rejtve), és azt a mintát is hozzá vette.
Raktam a selectbe egy új sort elsőnek:

 <option  value="0" id="0" selected="selected"  class = "0" >Select product...</option>
Ez így megoldotta a problémát.

Köszönöm a segítséget!!!!!